IntenseWebs/grafana
3
0
Fork 0
mirror of https://github.com/grafana/grafana.git synced 2025-02-25 18:55:37 -06:00
Code Issues Packages Projects Releases Wiki Activity

Magnifying glass on search fields #10188 (#10206)

Browse Source 
* 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
Download Patch File Download Diff File Expand all files Collapse all files

22
public/sass/components/_gf-form.scss
View File

@@ -1,6 +1,7 @@
$gf-form-margin: 3px;
$input-border: 1px solid $input-border-color;
.gf-form {
margin-bottom: $gf-form-margin;
display: flex;
@@ -31,6 +32,27 @@ $input-border: 1px solid $input-border-color;
}
}
.gf-form--has-input-icon {
position: relative;
.gf-form-input-icon {
position: absolute;
top: 50%;
margin-top: -9px;
font-size: $font-size-lg;
left: 10px;
color: $input-color-placeholder;
}
> input {
padding-left: 30px;
&:focus + .gf-form-input-icon {
color: $gray-4;
}
}
}
.gf-form-disabled {
color: $text-color-weak;