From abef44f37da6d97d4703b3bb55577dd64fceb8fb Mon Sep 17 00:00:00 2001 From: Charles Hacskaylo Date: Tue, 30 Jun 2015 10:37:19 -0700 Subject: [PATCH] [Frontend] Moved browse mode splitter settings to CSS file WTD-1404 WTD-1399 --- .../commonUI/browse/res/templates/browse.html | 5 +- .../general/res/css/theme-espresso.css | 96 ++++++++++--------- .../res/sass/_hide-non-functional.scss | 10 -- platform/commonUI/general/res/sass/_main.scss | 1 + .../res/sass/user-environ/_layout.scss | 5 +- 5 files changed, 61 insertions(+), 56 deletions(-) diff --git a/platform/commonUI/browse/res/templates/browse.html b/platform/commonUI/browse/res/templates/browse.html index 0a7698e8bd..3671e08ace 100644 --- a/platform/commonUI/browse/res/templates/browse.html +++ b/platform/commonUI/browse/res/templates/browse.html @@ -23,8 +23,9 @@
-
+
diff --git a/platform/commonUI/general/res/css/theme-espresso.css b/platform/commonUI/general/res/css/theme-espresso.css index ea093fb650..2b850933fa 100644 --- a/platform/commonUI/general/res/css/theme-espresso.css +++ b/platform/commonUI/general/res/css/theme-espresso.css @@ -614,56 +614,61 @@ mct-container { /* line 199, ../sass/user-environ/_layout.scss */ .pane { position: absolute; } - /* line 202, ../sass/user-environ/_layout.scss */ - .pane.treeview .create-btn-holder { - bottom: auto; - top: 0; - height: 24px; } - /* line 205, ../sass/user-environ/_layout.scss */ - .pane.treeview .create-btn-holder .wrapper.menu-element { - position: absolute; - bottom: 5px; } - /* line 210, ../sass/user-environ/_layout.scss */ - .pane.treeview .tree-holder { - overflow: auto; - top: 34px; } - /* line 217, ../sass/user-environ/_layout.scss */ + /* line 201, ../sass/user-environ/_layout.scss */ + .pane.treeview { + min-width: 150px; + max-width: 50%; } + /* line 204, ../sass/user-environ/_layout.scss */ + .pane.treeview .create-btn-holder { + bottom: auto; + top: 0; + height: 24px; } + /* line 207, ../sass/user-environ/_layout.scss */ + .pane.treeview .create-btn-holder .wrapper.menu-element { + position: absolute; + bottom: 5px; } + /* line 212, ../sass/user-environ/_layout.scss */ + .pane.treeview .tree-holder { + overflow: auto; + top: 34px; + padding-right: 5px; } + /* line 220, ../sass/user-environ/_layout.scss */ .pane.items .object-browse-bar .left.abs, .pane.items .object-browse-bar .btn-menu span.left.l-click-area, .btn-menu .pane.items .object-browse-bar span.left.l-click-area, .pane.items .object-browse-bar .right.abs, .pane.items .object-browse-bar .btn-menu span.right.l-click-area, .btn-menu .pane.items .object-browse-bar span.right.l-click-area { top: auto; } - /* line 222, ../sass/user-environ/_layout.scss */ + /* line 225, ../sass/user-environ/_layout.scss */ .pane.items .object-holder { top: 34px; } - /* line 227, ../sass/user-environ/_layout.scss */ + /* line 230, ../sass/user-environ/_layout.scss */ .pane.edit-main .object-holder { top: 0; } - /* line 233, ../sass/user-environ/_layout.scss */ + /* line 236, ../sass/user-environ/_layout.scss */ .pane .object-holder { overflow: auto; } -/* line 241, ../sass/user-environ/_layout.scss */ +/* line 244, ../sass/user-environ/_layout.scss */ .split-layout.horizontal > .pane { margin-top: 5px; } - /* line 244, ../sass/user-environ/_layout.scss */ + /* line 247, ../sass/user-environ/_layout.scss */ .split-layout.horizontal > .pane:first-child { margin-top: 0; } -/* line 251, ../sass/user-environ/_layout.scss */ +/* line 254, ../sass/user-environ/_layout.scss */ .split-layout.vertical > .pane { margin-left: 5px; } - /* line 253, ../sass/user-environ/_layout.scss */ + /* line 256, ../sass/user-environ/_layout.scss */ .split-layout.vertical > .pane > .holder { left: 0; right: 0; } - /* line 257, ../sass/user-environ/_layout.scss */ + /* line 260, ../sass/user-environ/_layout.scss */ .split-layout.vertical > .pane:first-child { margin-left: 0; } - /* line 259, ../sass/user-environ/_layout.scss */ + /* line 262, ../sass/user-environ/_layout.scss */ .split-layout.vertical > .pane:first-child .holder { - right: 5px; } + right: 3px; } -/* line 268, ../sass/user-environ/_layout.scss */ +/* line 271, ../sass/user-environ/_layout.scss */ .vscroll { overflow-y: auto; } @@ -3741,7 +3746,7 @@ input[type="text"] { overflow: hidden; } /* line 50, ../sass/plots/_plots-main.scss */ .gl-plot .gl-plot-axis-area.gl-plot-y { - top: 29px; + top: 25px; right: auto; bottom: 37px; left: 0; @@ -3758,7 +3763,7 @@ input[type="text"] { color: #e6e6e6; padding: 2px 5px; position: absolute; - top: 39px; + top: 35px; right: auto; bottom: auto; left: 70px; @@ -3769,7 +3774,7 @@ input[type="text"] { /* line 76, ../sass/plots/_plots-main.scss */ .gl-plot .gl-plot-display-area { position: absolute; - top: 29px; + top: 25px; right: 0; bottom: 37px; left: 60px; @@ -3837,7 +3842,7 @@ input[type="text"] { right: 0; bottom: auto; left: 0; - height: 24px; + height: 20px; overflow-x: hidden; overflow-y: auto; } /* line 157, ../sass/plots/_plots-main.scss */ @@ -3895,14 +3900,15 @@ input[type="text"] { .legend .plot-legend-item, .legend .legend-item { display: inline-block; - margin-right: 10px; } - /* line 204, ../sass/plots/_plots-main.scss */ + margin-right: 10px; + margin-bottom: 3px; } + /* line 205, ../sass/plots/_plots-main.scss */ .gl-plot-legend .plot-legend-item span, .gl-plot-legend .legend-item span, .legend .plot-legend-item span, .legend .legend-item span { vertical-align: middle; } - /* line 207, ../sass/plots/_plots-main.scss */ + /* line 208, ../sass/plots/_plots-main.scss */ .gl-plot-legend .plot-legend-item .plot-color-swatch, .gl-plot-legend .plot-legend-item .color-swatch, .gl-plot-legend .legend-item .plot-color-swatch, @@ -3918,7 +3924,7 @@ input[type="text"] { height: 8px; width: 8px; } -/* line 220, ../sass/plots/_plots-main.scss */ +/* line 221, ../sass/plots/_plots-main.scss */ .gl-plot-legend .plot-legend-item { -moz-border-radius: 2px; -webkit-border-radius: 2px; @@ -3926,22 +3932,22 @@ input[type="text"] { color: #fff; line-height: 1.5em; padding: 0px 5px; } - /* line 226, ../sass/plots/_plots-main.scss */ + /* line 227, ../sass/plots/_plots-main.scss */ .gl-plot-legend .plot-legend-item .plot-color-swatch { border: 1px solid #333; height: 9px; width: 9px; } -/* line 234, ../sass/plots/_plots-main.scss */ +/* line 235, ../sass/plots/_plots-main.scss */ .tick { position: absolute; border: 0 rgba(255, 255, 255, 0.3) solid; } - /* line 237, ../sass/plots/_plots-main.scss */ + /* line 238, ../sass/plots/_plots-main.scss */ .tick.tick-x { border-right-width: 1px; height: 100%; } -/* line 243, ../sass/plots/_plots-main.scss */ +/* line 244, ../sass/plots/_plots-main.scss */ .gl-plot-tick, .tick-label { font-size: 0.7rem; @@ -3949,7 +3955,7 @@ input[type="text"] { overflow: hidden; white-space: nowrap; text-overflow: ellipsis; } - /* line 251, ../sass/plots/_plots-main.scss */ + /* line 252, ../sass/plots/_plots-main.scss */ .gl-plot-tick.gl-plot-x-tick-label, .gl-plot-tick.tick-label-x, .tick-label.gl-plot-x-tick-label, .tick-label.tick-label-x { @@ -3960,7 +3966,7 @@ input[type="text"] { width: 20%; margin-left: -10%; text-align: center; } - /* line 261, ../sass/plots/_plots-main.scss */ + /* line 262, ../sass/plots/_plots-main.scss */ .gl-plot-tick.gl-plot-y-tick-label, .gl-plot-tick.tick-label-y, .tick-label.gl-plot-y-tick-label, .tick-label.tick-label-y { @@ -3970,18 +3976,18 @@ input[type="text"] { margin-bottom: -0.5em; text-align: right; } -/* line 273, ../sass/plots/_plots-main.scss */ +/* line 274, ../sass/plots/_plots-main.scss */ .gl-plot-tick.gl-plot-x-tick-label { top: 5px; } -/* line 276, ../sass/plots/_plots-main.scss */ +/* line 277, ../sass/plots/_plots-main.scss */ .gl-plot-tick.gl-plot-y-tick-label { right: 5px; left: 5px; } -/* line 283, ../sass/plots/_plots-main.scss */ +/* line 284, ../sass/plots/_plots-main.scss */ .tick-label.tick-label-x { top: 0; } -/* line 286, ../sass/plots/_plots-main.scss */ +/* line 287, ../sass/plots/_plots-main.scss */ .tick-label.tick-label-y { right: 0; left: 0; } @@ -4941,6 +4947,10 @@ input[type="text"] { height: 100%; width: 100%; } +/* line 6, ../sass/_initialization.scss */ +.browse-mode .split-layout .pane .treeview { + width: 15%; } + /***************************************************************************** * Open MCT Web, Copyright (c) 2014-2015, United States Government * as represented by the Administrator of the National Aeronautics and Space diff --git a/platform/commonUI/general/res/sass/_hide-non-functional.scss b/platform/commonUI/general/res/sass/_hide-non-functional.scss index 0f1fcd525a..14860ec8ce 100644 --- a/platform/commonUI/general/res/sass/_hide-non-functional.scss +++ b/platform/commonUI/general/res/sass/_hide-non-functional.scss @@ -32,15 +32,5 @@ .browse-area.holder { // When .browse.top-bar is hidden, set the top of the browse-area holder top: $bodyMargin; - > .contents.split-layout { - // Don't pad in from top and bottom - //top: 0; bottom: 0; - .object-browse-bar { - .btn.key-window { - // Hide the Open in New Window button -// display: none; - } - } - } } } \ No newline at end of file diff --git a/platform/commonUI/general/res/sass/_main.scss b/platform/commonUI/general/res/sass/_main.scss index 07fec4ed79..d56c55aca5 100644 --- a/platform/commonUI/general/res/sass/_main.scss +++ b/platform/commonUI/general/res/sass/_main.scss @@ -70,4 +70,5 @@ @import "properties"; @import "autoflow"; @import "iframe"; +@import "initialization"; @import "hide-non-functional"; diff --git a/platform/commonUI/general/res/sass/user-environ/_layout.scss b/platform/commonUI/general/res/sass/user-environ/_layout.scss index 639e53af75..4bbfa59069 100644 --- a/platform/commonUI/general/res/sass/user-environ/_layout.scss +++ b/platform/commonUI/general/res/sass/user-environ/_layout.scss @@ -199,6 +199,8 @@ .pane { position: absolute; &.treeview { + min-width: 150px; + max-width: 50%; .create-btn-holder { bottom: auto; top: 0; height: $ueTopBarH; @@ -210,6 +212,7 @@ .tree-holder { overflow: auto; top: $ueTopBarH + $interiorMarginLg; + padding-right: $interiorMargin; } } &.items { @@ -257,7 +260,7 @@ &:first-child { margin-left: 0; .holder { - right: $interiorMargin; + right: $interiorMarginSm; } } }