mirror of
https://github.com/grafana/grafana.git
synced 2025-02-25 18:55:37 -06:00
91 lines
1.8 KiB
Plaintext
91 lines
1.8 KiB
Plaintext
// ==========================================================================
|
|
// DROPDOWN
|
|
//
|
|
// dropdown.scss
|
|
// ==========================================================================
|
|
|
|
|
|
|
|
.select-input {
|
|
display: inline-block;
|
|
position: relative;
|
|
width: auto;
|
|
max-width: 100%;
|
|
margin: 0 5px;
|
|
padding: 0 12px 0 6px;
|
|
border: @grafanaPanelBorder;
|
|
background-color: @grafanaSelectBackground;
|
|
background-color: red;
|
|
overflow: hidden;
|
|
vertical-align: top;
|
|
-webkit-border-radius: 3px;
|
|
-moz-border-radius: 3px;
|
|
border-radius: 3px;
|
|
}
|
|
|
|
.select-input > select {
|
|
width: 115%;
|
|
min-width: 110%;
|
|
max-width: 115%;
|
|
height: 24px;
|
|
margin: 0;
|
|
padding: 0 20px 0 0;
|
|
border: 0;
|
|
outline: none;
|
|
background: transparent;
|
|
color: @linkColor;
|
|
font-size: 16px;
|
|
font-weight: 400;
|
|
line-height: 24px;
|
|
text-indent: .01px;
|
|
text-overflow: '';
|
|
-webkit-appearance: none;
|
|
-moz-appearance: menulist-text; // was set to "window" and caused odd display on windows and linux.
|
|
appearance: none;
|
|
}
|
|
|
|
// This hides native dropdown button arrow in IE
|
|
.select-input > select::-ms-expand {
|
|
display: none;
|
|
}
|
|
|
|
.select-input:after {
|
|
position: absolute;
|
|
top: 50%;
|
|
right: 10px;
|
|
height: 12px;
|
|
margin-top: -6px;
|
|
padding: 0;
|
|
background-color: transparent;
|
|
color: @linkColor;
|
|
font: normal normal normal 14px/1 FontAwesome;
|
|
text-align: center;
|
|
content: '\f0d7';
|
|
pointer-events: none;
|
|
}
|
|
|
|
.select-input > select:focus {
|
|
outline: none;
|
|
}
|
|
|
|
// This hides focus around selected option in FF
|
|
.select-input > select:-moz-focusring {
|
|
color: transparent;
|
|
text-shadow: 0 0 0 #adafae;
|
|
}
|
|
|
|
.rt-form .select-input {
|
|
margin: 0;
|
|
background: @grafanaSelectBackground;
|
|
}
|
|
|
|
.rt-form .select-interior {
|
|
margin: 0;
|
|
background-color: @inputBackground;
|
|
border: 1px solid @inputBorder;
|
|
}
|
|
|
|
.rt-form .select-input > select {
|
|
height: 34px;
|
|
line-height: 34px;
|
|
} |