ExternalVendorCode/openmct
1
0
Fork 0
mirror of https://github.com/nasa/openmct.git synced 2025-05-09 12:03:21 +00:00
Code Issues Actions Packages Projects Releases Wiki Activity

[Search] Clear icon tweaks

Browse Source 
Comments and CSS. Still not clickable.
This commit is contained in:
slhale 2015-08-12 11:20:02 -07:00
parent 515470fa6a
commit a76e54483a
3 changed files with 33 additions and 42 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

40
platform/commonUI/general/res/css/tree.css
View File

@ -304,18 +304,20 @@ ul.tree {
visibility: hidden;
opacity: 0; }
/* line 80, ../sass/search/_search.scss */
.search-holder .search .search-bar .clear-button {
.search-holder .search .search-bar .clear-icon {
color: #737373;
font-size: 6px;
float: right;
margin-right: 4px;
margin-top: 2px; }
/* line 94, ../sass/search/_search.scss */
margin-right: 2px;
margin-top: -2px;
padding: 4px;
cursor: crosshair; }
/* line 98, ../sass/search/_search.scss */
.search-holder .search .search-scroll {
top: 25px;
overflow-y: auto;
padding-right: 5px; }
/* line 102, ../sass/search/_search.scss */
/* line 106, ../sass/search/_search.scss */
.search-holder .search .search-scroll .results .search-result-item {
-moz-transition: background-color 0.25s;
-o-transition: background-color 0.25s;
@ -325,10 +327,10 @@ ul.tree {
border-radius: 2px;
padding-top: 4px;
padding-bottom: 2px; }
/* line 116, ../sass/search/_search.scss */
/* line 120, ../sass/search/_search.scss */
.search-holder .search .search-scroll .results .search-result-item .label {
margin-left: 6px; }
/* line 120, ../sass/search/_search.scss */
/* line 124, ../sass/search/_search.scss */
.search-holder .search .search-scroll .results .search-result-item .label .title-label {
display: inline-block;
position: absolute;
@ -340,47 +342,47 @@ ul.tree {
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap; }
/* line 142, ../sass/search/_search.scss */
/* line 146, ../sass/search/_search.scss */
.search-holder .search .search-scroll .results .search-result-item.selected {
background: #005177;
color: #fff; }
/* line 146, ../sass/search/_search.scss */
/* line 150, ../sass/search/_search.scss */
.search-holder .search .search-scroll .results .search-result-item.selected .view-control {
color: #0099cc; }
/* line 149, ../sass/search/_search.scss */
/* line 153, ../sass/search/_search.scss */
.search-holder .search .search-scroll .results .search-result-item.selected .label .type-icon {
color: #fff; }
/* line 156, ../sass/search/_search.scss */
/* line 160, ../sass/search/_search.scss */
.search-holder .search .search-scroll .results .search-result-item:not(.selected):hover {
background: #404040;
color: #cccccc; }
/* line 159, ../sass/search/_search.scss */
/* line 163, ../sass/search/_search.scss */
.search-holder .search .search-scroll .results .search-result-item:not(.selected):hover .context-trigger {
display: block; }
/* line 162, ../sass/search/_search.scss */
/* line 166, ../sass/search/_search.scss */
.search-holder .search .search-scroll .results .search-result-item:not(.selected):hover .icon {
color: #33ccff; }
/* line 170, ../sass/search/_search.scss */
/* line 174, ../sass/search/_search.scss */
.search-holder .search .search-scroll .load-icon {
position: relative; }
/* line 172, ../sass/search/_search.scss */
/* line 176, ../sass/search/_search.scss */
.search-holder .search .search-scroll .load-icon.loading {
pointer-events: none;
margin-left: 6px; }
/* line 176, ../sass/search/_search.scss */
/* line 180, ../sass/search/_search.scss */
.search-holder .search .search-scroll .load-icon.loading .title-label {
font-style: italic;
font-size: .9em;
opacity: 0.5;
margin-left: 26px;
line-height: 24px; }
/* line 186, ../sass/search/_search.scss */
/* line 190, ../sass/search/_search.scss */
.search-holder .search .search-scroll .load-icon.loading .wait-spinner {
margin-left: 6px; }
/* line 191, ../sass/search/_search.scss */
/* line 195, ../sass/search/_search.scss */
.search-holder .search .search-scroll .load-icon:not(.loading) {
cursor: pointer; }
/* line 196, ../sass/search/_search.scss */
/* line 200, ../sass/search/_search.scss */
.search-holder .search .search-scroll .load-more-button {
margin-top: 5px;
margin-bottom: 5px;

10
platform/commonUI/general/res/sass/search/_search.scss
View File

@ -77,17 +77,21 @@
opacity: 0;
}
.clear-button {
.clear-icon {
color: $colorItemFg;
font-size: 6px;
float: right;
margin-right: 4px;
margin-top: 2px;
margin-right: 2px;
margin-top: -2px;
padding: 4px;
&.content {
// Make button visible only when there is text input
}
//temp
cursor: crosshair;
}
}

25
platform/search/res/templates/search.html
View File

@ -22,40 +22,25 @@
<div class="search"
ng-controller="SearchController as controller">
<!-- Search bar input -->
<!-- Search bar -->
<div class="search-bar">
<!-- Input field -->
<input class="search-input"
type="text"
ng-model="ngModel.input"
ng-keyup="controller.search()"
id="searchInput" />
<!-- Search icon -->
<!-- ui symbols for search are 'd' and 'M' -->
<div class="ui-symbol search-icon"
ng-class="{content: controller.hasInput()}">
M
</div>
<a class="ui-symbol clear-button"
<!-- Clear button/icon 'x' -->
<a class="ui-symbol clear-icon"
ng-class="{content: controller.hasInput()}">
x
</a>
<!--mct-control key="textfield"
class="search-input"
ng-model="ngModel.input">
</mct-control>
<!--input type="text"
ng-required="false"
ng-model="ngModel.index"
name="mctControl" /-->
<!--mct-form structure="{sections: [rows: {control: 'textfield'}]}" ng-model="ngModle.input">
</mct-form>
<!--mct-control key="row.control"
ng-model="ngModel"
ng-required="row.required"
ng-pattern="getRegExp(row.pattern)"
options="row.options"
structure="row"
field="row.key">
</mct-control-->
</div>
<!-- This div exists to determine scroll bar location -->