[Search] Selecting results works
Can now click on search results. The view will be updated, as well as the selected object being higlighted.
This commit is contained in:
@@ -30,7 +30,8 @@
|
||||
</mct-representation>
|
||||
<div class='search-holder'>
|
||||
<mct-include key="'search'"
|
||||
mct-object="domainObject">
|
||||
mct-object="domainObject"
|
||||
ng-model="treeModel">
|
||||
</mct-include>
|
||||
</div>
|
||||
<div class='holder tree-holder abs'>
|
||||
|
||||
@@ -284,26 +284,35 @@ ul.tree {
|
||||
/* line 40, ../sass/search/_search.scss */
|
||||
.search-holder .search .results .search-result-item {
|
||||
margin-bottom: 5px;
|
||||
background: #005177;
|
||||
border-radius: 2px;
|
||||
padding-top: 2px;
|
||||
padding-bottom: 1px; }
|
||||
/* line 50, ../sass/search/_search.scss */
|
||||
/* line 49, ../sass/search/_search.scss */
|
||||
.search-holder .search .results .search-result-item .label {
|
||||
margin-left: 6px; }
|
||||
/* line 59, ../sass/search/_search.scss */
|
||||
/* line 58, ../sass/search/_search.scss */
|
||||
.search-holder .search .results .search-result-item .label .title-label {
|
||||
display: inline-block;
|
||||
position: absolute;
|
||||
width: auto;
|
||||
left: 29px;
|
||||
right: 0;
|
||||
font-size: .8em;
|
||||
line-height: 17px;
|
||||
width: auto;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap; }
|
||||
/* line 82, ../sass/search/_search.scss */
|
||||
/* line 79, ../sass/search/_search.scss */
|
||||
.search-holder .search .results .search-result-item.selected {
|
||||
background: #005177;
|
||||
color: #fff; }
|
||||
/* line 83, ../sass/search/_search.scss */
|
||||
.search-holder .search .results .search-result-item.selected .view-control {
|
||||
color: #0099cc; }
|
||||
/* line 86, ../sass/search/_search.scss */
|
||||
.search-holder .search .results .search-result-item.selected .label .type-icon {
|
||||
color: #fff; }
|
||||
/* line 93, ../sass/search/_search.scss */
|
||||
.search-holder .search .load-more-button {
|
||||
margin-top: 5px;
|
||||
position: relative;
|
||||
|
||||
@@ -42,7 +42,6 @@
|
||||
margin-bottom: 5px;
|
||||
|
||||
// Make the highlights the right color and shape
|
||||
background: $colorKeySelectedBg; // Later make this apply to only certain ones
|
||||
border-radius: 2px;
|
||||
padding-top: 2px;
|
||||
padding-bottom: 1px;
|
||||
@@ -61,7 +60,6 @@
|
||||
position: absolute;
|
||||
|
||||
// Give some padding away from the left side
|
||||
width: auto;
|
||||
left: $leftMargin + 3px + $iconWidth;
|
||||
right: 0;
|
||||
|
||||
@@ -70,12 +68,25 @@
|
||||
line-height: 17px;
|
||||
|
||||
// Hide overflow text
|
||||
// Only works when width is defined
|
||||
width: auto;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
}
|
||||
}
|
||||
|
||||
// Change styling when it's selected
|
||||
&.selected {
|
||||
$c: #fff;
|
||||
background: $colorKeySelectedBg;
|
||||
color: $c;
|
||||
.view-control {
|
||||
color: $colorItemTreeIcon;
|
||||
}
|
||||
.label .type-icon {
|
||||
color: #fff; //$colorItemTreeIconHover;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
Reference in New Issue
Block a user