mirror of
https://github.com/nasa/openmct.git
synced 2024-12-22 06:27:48 +00:00
[Frontend] Tree sanding and polishing
open #431 Fixed vertical margins problem in tree and search results;
This commit is contained in:
parent
0296cfe3c1
commit
941d0d0057
@ -128,7 +128,7 @@
|
|||||||
}
|
}
|
||||||
|
|
||||||
.active-filter-display {
|
.active-filter-display {
|
||||||
$s: 0.65em;
|
$s: 0.7em;
|
||||||
$p: $interiorMargin;
|
$p: $interiorMargin;
|
||||||
@include box-sizing(border-box);
|
@include box-sizing(border-box);
|
||||||
line-height: 130%;
|
line-height: 130%;
|
||||||
@ -147,7 +147,6 @@
|
|||||||
|
|
||||||
.search-results {
|
.search-results {
|
||||||
@include trans-prop-nice((opacity, visibility), 250ms);
|
@include trans-prop-nice((opacity, visibility), 250ms);
|
||||||
margin-top: $interiorMarginLg; // Always include margin here to fend off the search input
|
|
||||||
padding-right: $interiorMargin;
|
padding-right: $interiorMargin;
|
||||||
.hint {
|
.hint {
|
||||||
margin-bottom: $interiorMarginLg;
|
margin-bottom: $interiorMarginLg;
|
||||||
|
@ -5246,8 +5246,8 @@ span.req {
|
|||||||
-webkit-box-sizing: border-box;
|
-webkit-box-sizing: border-box;
|
||||||
box-sizing: border-box;
|
box-sizing: border-box;
|
||||||
line-height: 130%;
|
line-height: 130%;
|
||||||
padding-left: 1.4625em;
|
padding-left: 1.575em;
|
||||||
font-size: 0.65em; }
|
font-size: 0.7em; }
|
||||||
/* line 138, ../../../../general/res/sass/search/_search.scss */
|
/* line 138, ../../../../general/res/sass/search/_search.scss */
|
||||||
.holder-search .active-filter-display .clear-filters-icon {
|
.holder-search .active-filter-display .clear-filters-icon {
|
||||||
color: #737373;
|
color: #737373;
|
||||||
@ -5274,18 +5274,17 @@ span.req {
|
|||||||
-o-transition-delay: 0;
|
-o-transition-delay: 0;
|
||||||
-webkit-transition-delay: 0;
|
-webkit-transition-delay: 0;
|
||||||
transition-delay: 0;
|
transition-delay: 0;
|
||||||
margin-top: 10px;
|
|
||||||
padding-right: 5px; }
|
padding-right: 5px; }
|
||||||
/* line 152, ../../../../general/res/sass/search/_search.scss */
|
/* line 151, ../../../../general/res/sass/search/_search.scss */
|
||||||
.holder-search .search-results .hint {
|
.holder-search .search-results .hint {
|
||||||
margin-bottom: 10px;
|
margin-bottom: 10px;
|
||||||
font-size: 0.65em;
|
font-size: 0.65em;
|
||||||
opacity: 0.6; }
|
opacity: 0.6; }
|
||||||
/* line 157, ../../../../general/res/sass/search/_search.scss */
|
/* line 156, ../../../../general/res/sass/search/_search.scss */
|
||||||
.holder-search .search-results.active {
|
.holder-search .search-results.active {
|
||||||
visibility: visible;
|
visibility: visible;
|
||||||
opacity: 1; }
|
opacity: 1; }
|
||||||
/* line 161, ../../../../general/res/sass/search/_search.scss */
|
/* line 160, ../../../../general/res/sass/search/_search.scss */
|
||||||
.holder-search .search-results .load-more-button {
|
.holder-search .search-results .load-more-button {
|
||||||
-moz-transform: translateX(-50%);
|
-moz-transform: translateX(-50%);
|
||||||
-ms-transform: translateX(-50%);
|
-ms-transform: translateX(-50%);
|
||||||
|
@ -5168,8 +5168,8 @@ span.req {
|
|||||||
-webkit-box-sizing: border-box;
|
-webkit-box-sizing: border-box;
|
||||||
box-sizing: border-box;
|
box-sizing: border-box;
|
||||||
line-height: 130%;
|
line-height: 130%;
|
||||||
padding-left: 1.4625em;
|
padding-left: 1.575em;
|
||||||
font-size: 0.65em; }
|
font-size: 0.7em; }
|
||||||
/* line 138, ../../../../general/res/sass/search/_search.scss */
|
/* line 138, ../../../../general/res/sass/search/_search.scss */
|
||||||
.holder-search .active-filter-display .clear-filters-icon {
|
.holder-search .active-filter-display .clear-filters-icon {
|
||||||
color: #a6a6a6;
|
color: #a6a6a6;
|
||||||
@ -5196,18 +5196,17 @@ span.req {
|
|||||||
-o-transition-delay: 0;
|
-o-transition-delay: 0;
|
||||||
-webkit-transition-delay: 0;
|
-webkit-transition-delay: 0;
|
||||||
transition-delay: 0;
|
transition-delay: 0;
|
||||||
margin-top: 10px;
|
|
||||||
padding-right: 5px; }
|
padding-right: 5px; }
|
||||||
/* line 152, ../../../../general/res/sass/search/_search.scss */
|
/* line 151, ../../../../general/res/sass/search/_search.scss */
|
||||||
.holder-search .search-results .hint {
|
.holder-search .search-results .hint {
|
||||||
margin-bottom: 10px;
|
margin-bottom: 10px;
|
||||||
font-size: 0.65em;
|
font-size: 0.65em;
|
||||||
opacity: 0.6; }
|
opacity: 0.6; }
|
||||||
/* line 157, ../../../../general/res/sass/search/_search.scss */
|
/* line 156, ../../../../general/res/sass/search/_search.scss */
|
||||||
.holder-search .search-results.active {
|
.holder-search .search-results.active {
|
||||||
visibility: visible;
|
visibility: visible;
|
||||||
opacity: 1; }
|
opacity: 1; }
|
||||||
/* line 161, ../../../../general/res/sass/search/_search.scss */
|
/* line 160, ../../../../general/res/sass/search/_search.scss */
|
||||||
.holder-search .search-results .load-more-button {
|
.holder-search .search-results .load-more-button {
|
||||||
-moz-transform: translateX(-50%);
|
-moz-transform: translateX(-50%);
|
||||||
-ms-transform: translateX(-50%);
|
-ms-transform: translateX(-50%);
|
||||||
|
@ -20,11 +20,13 @@
|
|||||||
at runtime from the About dialog for additional information.
|
at runtime from the About dialog for additional information.
|
||||||
-->
|
-->
|
||||||
<div class="l-flex-col flex-elem grows holder holder-search" ng-controller="SearchController as controller">
|
<div class="l-flex-col flex-elem grows holder holder-search" ng-controller="SearchController as controller">
|
||||||
<div class="search-bar flex-elem" ng-controller="ClickAwayController as toggle">
|
<div class="search-bar flex-elem"
|
||||||
|
ng-controller="ClickAwayController as toggle"
|
||||||
|
ng-class="{ holder: !(ngModel.input === '' || ngModel.input === undefined) }">
|
||||||
<input class="search-input"
|
<input class="search-input"
|
||||||
type="text"
|
type="text"
|
||||||
ng-model="ngModel.input"
|
ng-model="ngModel.input"
|
||||||
ng-keyup="controller.search()" />
|
ng-keyup="controller.search()"/>
|
||||||
<a class="clear-icon"
|
<a class="clear-icon"
|
||||||
ng-class="{show: !(ngModel.input === '' || ngModel.input === undefined)}"
|
ng-class="{show: !(ngModel.input === '' || ngModel.input === undefined)}"
|
||||||
ng-click="ngModel.input = ''; controller.search()"></a>
|
ng-click="ngModel.input = ''; controller.search()"></a>
|
||||||
@ -37,13 +39,13 @@
|
|||||||
ng-click="toggle.setState(true)">
|
ng-click="toggle.setState(true)">
|
||||||
</mct-include>
|
</mct-include>
|
||||||
</div>
|
</div>
|
||||||
<div class="active-filter-display flex-elem"
|
<div class="active-filter-display flex-elem holder"
|
||||||
ng-class="{off: ngModel.filtersString === '' || ngModel.filtersString === undefined || !ngModel.search}"
|
ng-class="{off: ngModel.filtersString === '' || ngModel.filtersString === undefined || !ngModel.search}"
|
||||||
ng-controller="SearchMenuController as menuController">
|
ng-controller="SearchMenuController as menuController">
|
||||||
<a class="clear-icon clear-filters-icon"
|
<a class="clear-icon clear-filters-icon"
|
||||||
ng-click="ngModel.checkAll = true; menuController.checkAll()"></a>Filtered by: {{ ngModel.filtersString }}
|
ng-click="ngModel.checkAll = true; menuController.checkAll()"></a>Filtered by: {{ ngModel.filtersString }}
|
||||||
</div>
|
</div>
|
||||||
<div class="search-results flex-elem grows vscroll"
|
<div class="search-results flex-elem holder grows vscroll"
|
||||||
ng-class="{ off: !(loading || results.length > 0), loading: loading }">
|
ng-class="{ off: !(loading || results.length > 0), loading: loading }">
|
||||||
<mct-representation key="'search-item'"
|
<mct-representation key="'search-item'"
|
||||||
ng-repeat="result in results"
|
ng-repeat="result in results"
|
||||||
|
Loading…
Reference in New Issue
Block a user