From 0296cfe3c12a244f540acff07bde9656f070f060 Mon Sep 17 00:00:00 2001 From: Charles Hacskaylo Date: Thu, 17 Dec 2015 10:21:06 -0800 Subject: [PATCH] [Frontend] Mobile sanding and polishing open #431 Fixed hiding of "search by type" in phone only; Fixed search-input magnify glass z-index value; Fixed tree search results heights; --- .../general/res/sass/mobile/_tree.scss | 6 +- .../res/sass/mobile/search/_search.scss | 2 +- .../general/res/sass/search/_search.scss | 1 + .../espresso/res/css/theme-espresso.css | 59 ++++++++++--------- .../themes/snow/res/css/theme-snow.css | 59 ++++++++++--------- 5 files changed, 65 insertions(+), 62 deletions(-) diff --git a/platform/commonUI/general/res/sass/mobile/_tree.scss b/platform/commonUI/general/res/sass/mobile/_tree.scss index 71d34705b9..22ed795ce8 100644 --- a/platform/commonUI/general/res/sass/mobile/_tree.scss +++ b/platform/commonUI/general/res/sass/mobile/_tree.scss @@ -30,9 +30,9 @@ } .tree-item, .search-result-item { - height: $mobileTreeItemH; - line-height: $mobileTreeItemH; - margin-bottom: 0px; + height: $mobileTreeItemH !important; + line-height: $mobileTreeItemH !important; + margin-bottom: 0px !important; .view-control { font-size: 1.2em; margin-right: 0; diff --git a/platform/commonUI/general/res/sass/mobile/search/_search.scss b/platform/commonUI/general/res/sass/mobile/search/_search.scss index d37514a0a5..3ceadcbaed 100644 --- a/platform/commonUI/general/res/sass/mobile/search/_search.scss +++ b/platform/commonUI/general/res/sass/mobile/search/_search.scss @@ -1,5 +1,5 @@ @include phone { - .search { + .search-holder { .search-bar { // Hide menu-icon and adjust spacing when in phone mode .menu-icon { diff --git a/platform/commonUI/general/res/sass/search/_search.scss b/platform/commonUI/general/res/sass/search/_search.scss index 78071c085f..adc5342e8b 100644 --- a/platform/commonUI/general/res/sass/search/_search.scss +++ b/platform/commonUI/general/res/sass/search/_search.scss @@ -82,6 +82,7 @@ left: $interiorMarginSm; @include trans-prop-nice(color, 250ms); pointer-events: none; + z-index: 1; } // Make icon lighten when hovering over search bar diff --git a/platform/commonUI/themes/espresso/res/css/theme-espresso.css b/platform/commonUI/themes/espresso/res/css/theme-espresso.css index 390cbe456a..a71ff5f53d 100644 --- a/platform/commonUI/themes/espresso/res/css/theme-espresso.css +++ b/platform/commonUI/themes/espresso/res/css/theme-espresso.css @@ -20,7 +20,7 @@ * this source code distribution or the Licensing information page available * at runtime from the About dialog for additional information. *****************************************************************************/ -/* line 5, ../../../../../../../../../../../Library/Ruby/Gems/2.0.0/gems/compass-core-1.0.3/stylesheets/compass/reset/_utilities.scss */ +/* line 5, ../../../../../../../../../../Library/Ruby/Gems/2.0.0/gems/compass-core-1.0.3/stylesheets/compass/reset/_utilities.scss */ html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, @@ -41,38 +41,38 @@ time, mark, audio, video { font-size: 100%; vertical-align: baseline; } -/* line 22, ../../../../../../../../../../../Library/Ruby/Gems/2.0.0/gems/compass-core-1.0.3/stylesheets/compass/reset/_utilities.scss */ +/* line 22, ../../../../../../../../../../Library/Ruby/Gems/2.0.0/gems/compass-core-1.0.3/stylesheets/compass/reset/_utilities.scss */ html { line-height: 1; } -/* line 24, ../../../../../../../../../../../Library/Ruby/Gems/2.0.0/gems/compass-core-1.0.3/stylesheets/compass/reset/_utilities.scss */ +/* line 24, ../../../../../../../../../../Library/Ruby/Gems/2.0.0/gems/compass-core-1.0.3/stylesheets/compass/reset/_utilities.scss */ ol, ul { list-style: none; } -/* line 26, ../../../../../../../../../../../Library/Ruby/Gems/2.0.0/gems/compass-core-1.0.3/stylesheets/compass/reset/_utilities.scss */ +/* line 26, ../../../../../../../../../../Library/Ruby/Gems/2.0.0/gems/compass-core-1.0.3/stylesheets/compass/reset/_utilities.scss */ table { border-collapse: collapse; border-spacing: 0; } -/* line 28, ../../../../../../../../../../../Library/Ruby/Gems/2.0.0/gems/compass-core-1.0.3/stylesheets/compass/reset/_utilities.scss */ +/* line 28, ../../../../../../../../../../Library/Ruby/Gems/2.0.0/gems/compass-core-1.0.3/stylesheets/compass/reset/_utilities.scss */ caption, th, td { text-align: left; font-weight: normal; vertical-align: middle; } -/* line 30, ../../../../../../../../../../../Library/Ruby/Gems/2.0.0/gems/compass-core-1.0.3/stylesheets/compass/reset/_utilities.scss */ +/* line 30, ../../../../../../../../../../Library/Ruby/Gems/2.0.0/gems/compass-core-1.0.3/stylesheets/compass/reset/_utilities.scss */ q, blockquote { quotes: none; } - /* line 103, ../../../../../../../../../../../Library/Ruby/Gems/2.0.0/gems/compass-core-1.0.3/stylesheets/compass/reset/_utilities.scss */ + /* line 103, ../../../../../../../../../../Library/Ruby/Gems/2.0.0/gems/compass-core-1.0.3/stylesheets/compass/reset/_utilities.scss */ q:before, q:after, blockquote:before, blockquote:after { content: ""; content: none; } -/* line 32, ../../../../../../../../../../../Library/Ruby/Gems/2.0.0/gems/compass-core-1.0.3/stylesheets/compass/reset/_utilities.scss */ +/* line 32, ../../../../../../../../../../Library/Ruby/Gems/2.0.0/gems/compass-core-1.0.3/stylesheets/compass/reset/_utilities.scss */ a img { border: none; } -/* line 116, ../../../../../../../../../../../Library/Ruby/Gems/2.0.0/gems/compass-core-1.0.3/stylesheets/compass/reset/_utilities.scss */ +/* line 116, ../../../../../../../../../../Library/Ruby/Gems/2.0.0/gems/compass-core-1.0.3/stylesheets/compass/reset/_utilities.scss */ article, aside, details, figcaption, figure, footer, header, hgroup, main, menu, nav, section, summary { display: block; } @@ -5205,41 +5205,42 @@ span.req { -o-transition-delay: 0; -webkit-transition-delay: 0; transition-delay: 0; - pointer-events: none; } - /* line 88, ../../../../general/res/sass/search/_search.scss */ + pointer-events: none; + z-index: 1; } + /* line 89, ../../../../general/res/sass/search/_search.scss */ .holder-search .search-bar:hover:before { color: #8c8c8c; } - /* line 92, ../../../../general/res/sass/search/_search.scss */ + /* line 93, ../../../../general/res/sass/search/_search.scss */ .holder-search .search-bar .clear-icon { right: 22px; visibility: hidden; opacity: 0; } - /* line 98, ../../../../general/res/sass/search/_search.scss */ + /* line 99, ../../../../general/res/sass/search/_search.scss */ .holder-search .search-bar .clear-icon.show { visibility: visible; opacity: 1; } - /* line 103, ../../../../general/res/sass/search/_search.scss */ + /* line 104, ../../../../general/res/sass/search/_search.scss */ .holder-search .search-bar .clear-icon:hover { color: #8c8c8c; } - /* line 108, ../../../../general/res/sass/search/_search.scss */ + /* line 109, ../../../../general/res/sass/search/_search.scss */ .holder-search .search-bar .menu-icon { font-size: 0.8em; padding-right: 4px; right: 4px; text-align: right; } - /* line 110, ../../../../general/res/sass/search/_search.scss */ + /* line 111, ../../../../general/res/sass/search/_search.scss */ .holder-search .search-bar .menu-icon:before { content: '\76'; } - /* line 116, ../../../../general/res/sass/search/_search.scss */ + /* line 117, ../../../../general/res/sass/search/_search.scss */ .holder-search .search-bar .menu-icon:hover { color: #8c8c8c; } - /* line 121, ../../../../general/res/sass/search/_search.scss */ + /* line 122, ../../../../general/res/sass/search/_search.scss */ .holder-search .search-bar .search-menu-holder { float: right; left: -20px; z-index: 70; transition: visibility .05s, opacity .05s; } -/* line 129, ../../../../general/res/sass/search/_search.scss */ +/* line 130, ../../../../general/res/sass/search/_search.scss */ .holder-search .active-filter-display { -moz-box-sizing: border-box; -webkit-box-sizing: border-box; @@ -5247,7 +5248,7 @@ span.req { line-height: 130%; padding-left: 1.4625em; font-size: 0.65em; } - /* line 137, ../../../../general/res/sass/search/_search.scss */ + /* line 138, ../../../../general/res/sass/search/_search.scss */ .holder-search .active-filter-display .clear-filters-icon { color: #737373; opacity: 1; @@ -5255,7 +5256,7 @@ span.req { position: absolute; left: 1px; cursor: pointer; } -/* line 147, ../../../../general/res/sass/search/_search.scss */ +/* line 148, ../../../../general/res/sass/search/_search.scss */ .holder-search .search-results { -moz-transition-property: opacity, visibility; -o-transition-property: opacity, visibility; @@ -5275,16 +5276,16 @@ span.req { transition-delay: 0; margin-top: 10px; padding-right: 5px; } - /* line 151, ../../../../general/res/sass/search/_search.scss */ + /* line 152, ../../../../general/res/sass/search/_search.scss */ .holder-search .search-results .hint { margin-bottom: 10px; font-size: 0.65em; opacity: 0.6; } - /* line 156, ../../../../general/res/sass/search/_search.scss */ + /* line 157, ../../../../general/res/sass/search/_search.scss */ .holder-search .search-results.active { visibility: visible; opacity: 1; } - /* line 160, ../../../../general/res/sass/search/_search.scss */ + /* line 161, ../../../../general/res/sass/search/_search.scss */ .holder-search .search-results .load-more-button { -moz-transform: translateX(-50%); -ms-transform: translateX(-50%); @@ -5299,10 +5300,10 @@ span.req { @media only screen and (orientation: portrait) and (max-device-width: 767px), only screen and (orientation: landscape) and (max-device-width: 767px) { /* line 5, ../../../../general/res/sass/mobile/search/_search.scss */ - .search .search-bar .menu-icon { + .search-holder .search-bar .menu-icon { display: none; } /* line 8, ../../../../general/res/sass/mobile/search/_search.scss */ - .search .search-bar .clear-icon { + .search-holder .search-bar .clear-icon { right: 5px; } } /***************************************************************************** * Open MCT Web, Copyright (c) 2014-2015, United States Government @@ -5954,9 +5955,9 @@ mct-representation.s-status-pending .t-object-label .t-title-label { /* line 31, ../../../../general/res/sass/mobile/_tree.scss */ .tree-item, .search-result-item { - height: 35px; - line-height: 35px; - margin-bottom: 0px; } + height: 35px !important; + line-height: 35px !important; + margin-bottom: 0px !important; } /* line 36, ../../../../general/res/sass/mobile/_tree.scss */ .tree-item .view-control, .search-result-item .view-control { diff --git a/platform/commonUI/themes/snow/res/css/theme-snow.css b/platform/commonUI/themes/snow/res/css/theme-snow.css index 222e7a36d5..bca5ac2a5b 100644 --- a/platform/commonUI/themes/snow/res/css/theme-snow.css +++ b/platform/commonUI/themes/snow/res/css/theme-snow.css @@ -20,7 +20,7 @@ * this source code distribution or the Licensing information page available * at runtime from the About dialog for additional information. *****************************************************************************/ -/* line 5, ../../../../../../../../../../../Library/Ruby/Gems/2.0.0/gems/compass-core-1.0.3/stylesheets/compass/reset/_utilities.scss */ +/* line 5, ../../../../../../../../../../Library/Ruby/Gems/2.0.0/gems/compass-core-1.0.3/stylesheets/compass/reset/_utilities.scss */ html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, @@ -41,38 +41,38 @@ time, mark, audio, video { font-size: 100%; vertical-align: baseline; } -/* line 22, ../../../../../../../../../../../Library/Ruby/Gems/2.0.0/gems/compass-core-1.0.3/stylesheets/compass/reset/_utilities.scss */ +/* line 22, ../../../../../../../../../../Library/Ruby/Gems/2.0.0/gems/compass-core-1.0.3/stylesheets/compass/reset/_utilities.scss */ html { line-height: 1; } -/* line 24, ../../../../../../../../../../../Library/Ruby/Gems/2.0.0/gems/compass-core-1.0.3/stylesheets/compass/reset/_utilities.scss */ +/* line 24, ../../../../../../../../../../Library/Ruby/Gems/2.0.0/gems/compass-core-1.0.3/stylesheets/compass/reset/_utilities.scss */ ol, ul { list-style: none; } -/* line 26, ../../../../../../../../../../../Library/Ruby/Gems/2.0.0/gems/compass-core-1.0.3/stylesheets/compass/reset/_utilities.scss */ +/* line 26, ../../../../../../../../../../Library/Ruby/Gems/2.0.0/gems/compass-core-1.0.3/stylesheets/compass/reset/_utilities.scss */ table { border-collapse: collapse; border-spacing: 0; } -/* line 28, ../../../../../../../../../../../Library/Ruby/Gems/2.0.0/gems/compass-core-1.0.3/stylesheets/compass/reset/_utilities.scss */ +/* line 28, ../../../../../../../../../../Library/Ruby/Gems/2.0.0/gems/compass-core-1.0.3/stylesheets/compass/reset/_utilities.scss */ caption, th, td { text-align: left; font-weight: normal; vertical-align: middle; } -/* line 30, ../../../../../../../../../../../Library/Ruby/Gems/2.0.0/gems/compass-core-1.0.3/stylesheets/compass/reset/_utilities.scss */ +/* line 30, ../../../../../../../../../../Library/Ruby/Gems/2.0.0/gems/compass-core-1.0.3/stylesheets/compass/reset/_utilities.scss */ q, blockquote { quotes: none; } - /* line 103, ../../../../../../../../../../../Library/Ruby/Gems/2.0.0/gems/compass-core-1.0.3/stylesheets/compass/reset/_utilities.scss */ + /* line 103, ../../../../../../../../../../Library/Ruby/Gems/2.0.0/gems/compass-core-1.0.3/stylesheets/compass/reset/_utilities.scss */ q:before, q:after, blockquote:before, blockquote:after { content: ""; content: none; } -/* line 32, ../../../../../../../../../../../Library/Ruby/Gems/2.0.0/gems/compass-core-1.0.3/stylesheets/compass/reset/_utilities.scss */ +/* line 32, ../../../../../../../../../../Library/Ruby/Gems/2.0.0/gems/compass-core-1.0.3/stylesheets/compass/reset/_utilities.scss */ a img { border: none; } -/* line 116, ../../../../../../../../../../../Library/Ruby/Gems/2.0.0/gems/compass-core-1.0.3/stylesheets/compass/reset/_utilities.scss */ +/* line 116, ../../../../../../../../../../Library/Ruby/Gems/2.0.0/gems/compass-core-1.0.3/stylesheets/compass/reset/_utilities.scss */ article, aside, details, figcaption, figure, footer, header, hgroup, main, menu, nav, section, summary { display: block; } @@ -5127,41 +5127,42 @@ span.req { -o-transition-delay: 0; -webkit-transition-delay: 0; transition-delay: 0; - pointer-events: none; } - /* line 88, ../../../../general/res/sass/search/_search.scss */ + pointer-events: none; + z-index: 1; } + /* line 89, ../../../../general/res/sass/search/_search.scss */ .holder-search .search-bar:hover:before { color: #8c8c8c; } - /* line 92, ../../../../general/res/sass/search/_search.scss */ + /* line 93, ../../../../general/res/sass/search/_search.scss */ .holder-search .search-bar .clear-icon { right: 22px; visibility: hidden; opacity: 0; } - /* line 98, ../../../../general/res/sass/search/_search.scss */ + /* line 99, ../../../../general/res/sass/search/_search.scss */ .holder-search .search-bar .clear-icon.show { visibility: visible; opacity: 1; } - /* line 103, ../../../../general/res/sass/search/_search.scss */ + /* line 104, ../../../../general/res/sass/search/_search.scss */ .holder-search .search-bar .clear-icon:hover { color: #8c8c8c; } - /* line 108, ../../../../general/res/sass/search/_search.scss */ + /* line 109, ../../../../general/res/sass/search/_search.scss */ .holder-search .search-bar .menu-icon { font-size: 0.8em; padding-right: 4px; right: 4px; text-align: right; } - /* line 110, ../../../../general/res/sass/search/_search.scss */ + /* line 111, ../../../../general/res/sass/search/_search.scss */ .holder-search .search-bar .menu-icon:before { content: '\76'; } - /* line 116, ../../../../general/res/sass/search/_search.scss */ + /* line 117, ../../../../general/res/sass/search/_search.scss */ .holder-search .search-bar .menu-icon:hover { color: #8c8c8c; } - /* line 121, ../../../../general/res/sass/search/_search.scss */ + /* line 122, ../../../../general/res/sass/search/_search.scss */ .holder-search .search-bar .search-menu-holder { float: right; left: -20px; z-index: 70; transition: visibility .05s, opacity .05s; } -/* line 129, ../../../../general/res/sass/search/_search.scss */ +/* line 130, ../../../../general/res/sass/search/_search.scss */ .holder-search .active-filter-display { -moz-box-sizing: border-box; -webkit-box-sizing: border-box; @@ -5169,7 +5170,7 @@ span.req { line-height: 130%; padding-left: 1.4625em; font-size: 0.65em; } - /* line 137, ../../../../general/res/sass/search/_search.scss */ + /* line 138, ../../../../general/res/sass/search/_search.scss */ .holder-search .active-filter-display .clear-filters-icon { color: #a6a6a6; opacity: 1; @@ -5177,7 +5178,7 @@ span.req { position: absolute; left: 1px; cursor: pointer; } -/* line 147, ../../../../general/res/sass/search/_search.scss */ +/* line 148, ../../../../general/res/sass/search/_search.scss */ .holder-search .search-results { -moz-transition-property: opacity, visibility; -o-transition-property: opacity, visibility; @@ -5197,16 +5198,16 @@ span.req { transition-delay: 0; margin-top: 10px; padding-right: 5px; } - /* line 151, ../../../../general/res/sass/search/_search.scss */ + /* line 152, ../../../../general/res/sass/search/_search.scss */ .holder-search .search-results .hint { margin-bottom: 10px; font-size: 0.65em; opacity: 0.6; } - /* line 156, ../../../../general/res/sass/search/_search.scss */ + /* line 157, ../../../../general/res/sass/search/_search.scss */ .holder-search .search-results.active { visibility: visible; opacity: 1; } - /* line 160, ../../../../general/res/sass/search/_search.scss */ + /* line 161, ../../../../general/res/sass/search/_search.scss */ .holder-search .search-results .load-more-button { -moz-transform: translateX(-50%); -ms-transform: translateX(-50%); @@ -5221,10 +5222,10 @@ span.req { @media only screen and (orientation: portrait) and (max-device-width: 767px), only screen and (orientation: landscape) and (max-device-width: 767px) { /* line 5, ../../../../general/res/sass/mobile/search/_search.scss */ - .search .search-bar .menu-icon { + .search-holder .search-bar .menu-icon { display: none; } /* line 8, ../../../../general/res/sass/mobile/search/_search.scss */ - .search .search-bar .clear-icon { + .search-holder .search-bar .clear-icon { right: 5px; } } /***************************************************************************** * Open MCT Web, Copyright (c) 2014-2015, United States Government @@ -5857,9 +5858,9 @@ mct-representation.s-status-pending .t-object-label .t-title-label { /* line 31, ../../../../general/res/sass/mobile/_tree.scss */ .tree-item, .search-result-item { - height: 35px; - line-height: 35px; - margin-bottom: 0px; } + height: 35px !important; + line-height: 35px !important; + margin-bottom: 0px !important; } /* line 36, ../../../../general/res/sass/mobile/_tree.scss */ .tree-item .view-control, .search-result-item .view-control {