alihan/openmct
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

[Search] Item background highlight

Browse Source 
Each result item now has a highlighted
background, with correct rounding of
edges. Need to now detect when to
highlight (on selection).
This commit is contained in:
shale
2015-07-22 14:48:14 -07:00
parent 57d45b24be
commit d82538a799
6 changed files with 256 additions and 53 deletions
Download Patch File Download Diff File Expand all files Collapse all files

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

@@ -271,28 +271,37 @@ ul.tree {
* this source code distribution or the Licensing information page available
* at runtime from the About dialog for additional information.
*****************************************************************************/
/* line 27, ../sass/search/_search.scss */
span.search-holder .searchbar {
/* line 28, ../sass/search/_search.scss */
.search-holder .searchbar {
width: 100%;
margin-top: 20px; }
/* line 32, ../sass/search/_search.scss */
span.search-holder .results {
/* line 33, ../sass/search/_search.scss */
.search-holder .results {
margin-top: 10px; }
/* line 35, ../sass/search/_search.scss */
span.search-holder .results .search-result-item {
margin-bottom: 5px; }
/* line 45, ../sass/search/_search.scss */
span.search-holder .results .search-result-item .label .title-label {
display: inline-block;
position: absolute;
width: auto;
left: 20px;
right: 0;
font-size: .8em;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap; }
/* line 63, ../sass/search/_search.scss */
span.search-holder .load-more-button {
/* line 36, ../sass/search/_search.scss */
.search-holder .results .search-result-item {
margin-bottom: 5px;
background: #005177;
border-radius: 2px;
padding-top: 2px;
padding-bottom: 1px; }
/* line 43, ../sass/search/_search.scss */
.search-holder .results .search-result-item .label {
left: 15px;
margin-left: 8px; }
/* line 53, ../sass/search/_search.scss */
.search-holder .results .search-result-item .label .title-label {
display: inline-block;
position: absolute;
width: auto;
left: 31px;
right: 0;
font-size: .8em;
line-height: 17px;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap; }
/* line 72, ../sass/search/_search.scss */
.search-holder .load-more-button {
width: 100%;
margin-top: 5px; }

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

@@ -20,9 +20,10 @@
* at runtime from the About dialog for additional information.
*****************************************************************************/
span.search-holder {
$iconwidth: 20px;
.search-holder {
$iconWidth: 20px;
//$iconheight: 17px;
$leftMargin: 8px;
.searchbar {
width: 100%;
@@ -34,8 +35,15 @@ span.search-holder {
.search-result-item {
margin-bottom: 5px;
background: $colorKeySelectedBg; // Later make this apply to only certain ones
border-radius: 2px;
padding-top: 2px;
padding-bottom: 1px;
.label {
//position: absolute;
left: 15px;
margin-left: $leftMargin;
.type-icon {
.icon {
@@ -47,10 +55,11 @@ span.search-holder {
position: absolute;
width: auto;
left: $iconwidth;
left: $leftMargin + 3px + $iconWidth;
right: 0;
font-size: .8em;
line-height: 17px;
overflow: hidden;
text-overflow: ellipsis;