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

ux(): added gf-form-select-wrapper

Browse Source
This commit is contained in:
Torkel Ödegaard 2016-02-20 17:21:35 +01:00
parent 640c9a49d8
commit 1f28ff6890
2 changed files with 28 additions and 29 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
public/app/features/datasources/partials/edit.html
View File

@ -20,7 +20,9 @@
<div class="gf-form">
<span class="gf-form-label width-7">Type</span>
<select class="gf-form-input gf-size-auto" ng-model="current.type" ng-options="k as v.name for (k, v) in types" ng-change="typeChanged()"></select>
<div class="gf-form-select-wrapper">
<select class="gf-form-input gf-size-auto" ng-model="current.type" ng-options="k as v.name for (k, v) in types" ng-change="typeChanged()"></select>
</div>
</div>
</div>

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

@ -104,34 +104,31 @@ $gf-form-label-margin: 0.2rem;
&.gf-size-auto { width: auto; }
}
// select.gf-form-input {
// -webkit-appearance: none;
// -moz-appearance: menulist-text; // was set to "window" and caused odd display on windos and linux.
// appearance: none;
//
//
// &:-moz-focusring {
// color: transparent;
// }
// }
//
// .gf-form-select-wrapper {
// position: relative;
// &:after {
// position: absolute;
// top: 50%;
// right: 10px;
// height: 12px;
// margin-top: -6px;
// padding: 0;
// background-color: transparent;
// color: $input-color;
// font: normal normal normal 14px/1 FontAwesome;
// text-align: center;
// content: '\f0d7';
// pointer-events: none;
// }
// }
.gf-form-select-wrapper {
position: relative;
select.gf-form-input {
padding-right: $input-padding-x*2;
-webkit-appearance: none;
-moz-appearance: menulist-text; // was set to "window" and caused odd display on windos and linux.
appearance: none;
&:-moz-focusring {
color: transparent;
}
}
&:after {
position: absolute;
top: 35%;
right: $input-padding-x/2;
background-color: transparent;
color: $input-color;
font: normal normal normal $font-size-sm/1 FontAwesome;
content: '\f0d7';
pointer-events: none;
}
}
.gf-form-btn {
padding: $input-padding-y $input-padding-x;