Began polish and tweaks of new template variable multi select dropdown

This commit is contained in:
Torkel Ödegaard 2015-04-29 14:23:29 +02:00
parent b762f56aee
commit c5be95e46c
3 changed files with 38 additions and 27 deletions

View File

@ -7,10 +7,9 @@
</a>
<div ng-if="selectorOpen" class="variable-value-dropdown">
<div class="search-field-wrapper">
<div class="variable-search-wrapper">
<span style="position: relative;">
<input type="text" placeholder="Search variable values" give-focus="giveFocus" tabindex="1"
ng-keydown="keyDown($event)" ng-model="query.query" ng-model-options="{ debounce: 500 }" spellcheck='false' ng-change="search()" />
<input type="text" placeholder="Search values..." give-focus="giveFocus" tabindex="1" ng-model="query.query" spellcheck='false' ng-change="search()" />
</span>
</div>

View File

@ -28,15 +28,17 @@
position: absolute;
top: 43px;
min-width: 200px;
height: 400px;
max-height: 400px;
background: @grafanaPanelBackground;
box-shadow: 0px 0px 55px 0px black;
border: 1px solid @grafanaTargetFuncBackground;
z-index: 1000;
padding: 10px;
font-size: @baseFontSize;
padding: 4px 4px 8px 4px;
}
.variable-options-container {
height: 350px;
max-height: 350px;
overflow: auto;
display: block;
line-height: 28px;
@ -48,7 +50,7 @@
font-size: 130%;
position: relative;
top: 2px;
padding-right: 6px;
padding-right: 4px;
}
.fa-check-square-o { display: none; }
@ -61,4 +63,14 @@
}
}
}
.variable-search-wrapper {
input {
width: 100%;
padding: 7px 8px;
height: 100%;
box-sizing: border-box;
margin-bottom: 6px;
}
}