mirror of
https://github.com/grafana/grafana.git
synced 2025-02-25 18:55:37 -06:00
Single variable select state highlight fixed, Closes #2073
This commit is contained in:
parent
6ed17fe62f
commit
6f783f5a3b
@ -14,13 +14,13 @@
|
||||
|
||||
<input type="text" class="tight-form-clear-input input-small" style="display: none" ng-keydown="keyDown($event)" ng-model="search.query" ng-change="queryChanged()" ></input>
|
||||
|
||||
<div class="variable-value-dropdown" ng-if="dropdownVisible">
|
||||
<div class="variable-value-dropdown" ng-if="dropdownVisible" ng-class="{'multi': variable.multi, 'single': !variable.multi}">
|
||||
<div class="variable-options-wrapper">
|
||||
<div class="variable-options-column">
|
||||
<div class="variable-options-column-header" ng-if="variable.multi">
|
||||
Selected ({{selectedValuesCount}})
|
||||
</div>
|
||||
<a class="variable-option pointer" bindonce ng-repeat="option in search.options" ng-class="{'selected': option.selected, 'highlighted': $index === highlightIndex, 'multi': variable.multi}" ng-click="optionSelected(option, $event)">
|
||||
<a class="variable-option pointer" bindonce ng-repeat="option in search.options" ng-class="{'selected': option.selected, 'highlighted': $index === highlightIndex}" ng-click="optionSelected(option, $event)">
|
||||
<span class="variable-option-icon"></span>
|
||||
<span>{{option.text}}</span>
|
||||
</a>
|
||||
|
@ -55,7 +55,7 @@
|
||||
min-width: 150px;
|
||||
max-height: 400px;
|
||||
min-height: 150px;
|
||||
background: @dropdownBackground;
|
||||
background-color: @dropdownBackground;
|
||||
overflow-y: auto;
|
||||
overflow-x: hidden;
|
||||
box-shadow: 0px 0px 55px 0px black;
|
||||
@ -63,6 +63,29 @@
|
||||
z-index: 1000;
|
||||
font-size: @baseFontSize;
|
||||
border-radius: 3px 3px 0 0;
|
||||
|
||||
&.multi {
|
||||
.variable-option-icon {
|
||||
display: inline-block;
|
||||
width: 24px;
|
||||
height: 18px;
|
||||
position: relative;
|
||||
top: 4px;
|
||||
background: url(@checkboxImageUrl) left top no-repeat;
|
||||
}
|
||||
|
||||
.selected {
|
||||
.variable-option-icon{
|
||||
background: url(@checkboxImageUrl) 0px -18px no-repeat;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
&.single {
|
||||
.selected {
|
||||
background-color: @grafanaTargetFuncHightlight;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.variable-options-wrapper {
|
||||
@ -87,23 +110,6 @@
|
||||
position: relative;
|
||||
white-space: nowrap;
|
||||
min-width: 115px;
|
||||
|
||||
&.multi {
|
||||
.variable-option-icon {
|
||||
display: inline-block;
|
||||
width: 24px;
|
||||
height: 18px;
|
||||
position: relative;
|
||||
top: 4px;
|
||||
background: url(@checkboxImageUrl) left top no-repeat;
|
||||
}
|
||||
|
||||
&.selected {
|
||||
.variable-option-icon{
|
||||
background: url(@checkboxImageUrl) 0px -18px no-repeat;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.variable-options-column-header {
|
||||
|
Loading…
Reference in New Issue
Block a user