mirror of
https://github.com/grafana/grafana.git
synced 2025-02-25 18:55:37 -06:00
Switch: made minor styling tweaks to switch to align to 4px grid (#16593)
This commit is contained in:
parent
d4bb92a3c5
commit
5f1b2691a3
@ -25,7 +25,7 @@ gf-form-switch[disabled] {
|
|||||||
.gf-form-switch {
|
.gf-form-switch {
|
||||||
display: flex;
|
display: flex;
|
||||||
position: relative;
|
position: relative;
|
||||||
width: 60px;
|
width: 56px;
|
||||||
height: $input-height;
|
height: $input-height;
|
||||||
background: $switch-bg;
|
background: $switch-bg;
|
||||||
border: 1px solid $input-border-color;
|
border: 1px solid $input-border-color;
|
||||||
@ -52,7 +52,7 @@ gf-form-switch[disabled] {
|
|||||||
background: $switch-slider-off-bg;
|
background: $switch-slider-off-bg;
|
||||||
border-radius: 8px;
|
border-radius: 8px;
|
||||||
height: 16px;
|
height: 16px;
|
||||||
width: 29px;
|
width: 32px;
|
||||||
display: block;
|
display: block;
|
||||||
position: relative;
|
position: relative;
|
||||||
|
|
||||||
@ -61,7 +61,7 @@ gf-form-switch[disabled] {
|
|||||||
content: '';
|
content: '';
|
||||||
height: 12px;
|
height: 12px;
|
||||||
width: 12px;
|
width: 12px;
|
||||||
left: 1px;
|
left: 2px;
|
||||||
top: 2px;
|
top: 2px;
|
||||||
background: $switch-slider-color;
|
background: $switch-slider-color;
|
||||||
transition: 0.4s;
|
transition: 0.4s;
|
||||||
@ -75,7 +75,7 @@ input:checked + .gf-form-switch__slider {
|
|||||||
}
|
}
|
||||||
|
|
||||||
input:checked + .gf-form-switch__slider::before {
|
input:checked + .gf-form-switch__slider::before {
|
||||||
transform: translateX(14px);
|
transform: translateX(16px);
|
||||||
}
|
}
|
||||||
|
|
||||||
.gf-form-checkbox {
|
.gf-form-checkbox {
|
||||||
|
Loading…
Reference in New Issue
Block a user