Magnifying glass on search fields #10188 (#10206)

* ux: Add magnifying glass icon to search input and remove the text label (#10188)

* ux: Add new look on search field to manage dashboards, users, teams, data sources, plugins. Change to use our own icon class instead of .fa (#10188)

* ux: Add new search look on org/users (#10188)
This commit is contained in:
Johannes Schill
2017-12-14 12:46:00 +01:00
committed by Torkel Ödegaard
parent 776c39fd79
commit b012131050
7 changed files with 44 additions and 27 deletions

View File

@@ -2,11 +2,11 @@
<div class="page-container page-body">
<div class="page-action-bar">
<div class="gf-form">
<label class="gf-form-label">Search</label>
<input class="gf-form-input width-15" type="text" placeholder="Find user by name/login/email" tabindex="1" give-focus="true" ng-model="ctrl.query" ng-model-options="{ debounce: 500 }" spellcheck='false' ng-change="ctrl.getUsers()" />
</div>
<div class="page-action-bar__spacer"></div>
<label class="gf-form gf-form--grow gf-form--has-input-icon">
<input type="text" class="gf-form-input max-width-30" placeholder="Find user by name/login/email" tabindex="1" give-focus="true" ng-model="ctrl.query" ng-model-options="{ debounce: 500 }" spellcheck='false' ng-change="ctrl.getUsers()" />
<i class="gf-form-input-icon fa fa-search"></i>
</label>
<div class="page-action-bar__spacer"></div>
<a class="btn btn-success" href="admin/users/create">
<i class="fa fa-plus"></i>
Add new user