[Frontend] Tree sanding and polishing

open #431
Fixed vertical margins problem in tree and search results;
This commit is contained in:
Charles Hacskaylo 2015-12-17 10:49:39 -08:00
parent 0296cfe3c1
commit 941d0d0057
4 changed files with 17 additions and 18 deletions

View File

@ -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;

View File

@ -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%);

View File

@ -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%);

View File

@ -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"