Slider mobile/header spacing und vertikale Ausrichtung der Werte korrigieren
This commit is contained in:
+14
-16
@@ -1071,15 +1071,15 @@ section + section {
|
|||||||
}
|
}
|
||||||
|
|
||||||
#component-slider .sg-slider-activatable-header {
|
#component-slider .sg-slider-activatable-header {
|
||||||
display: contents;
|
grid-column: 1 / 3;
|
||||||
}
|
display: grid;
|
||||||
|
grid-template-columns: max-content max-content;
|
||||||
#component-slider .sg-slider-activatable-header .sg-mode-toggle {
|
column-gap: var(--spacing-large);
|
||||||
grid-column: 1;
|
align-items: center;
|
||||||
|
width: max-content;
|
||||||
}
|
}
|
||||||
|
|
||||||
#component-slider .sg-slider-activatable-header .sg-label {
|
#component-slider .sg-slider-activatable-header .sg-label {
|
||||||
grid-column: 2;
|
|
||||||
min-width: 0;
|
min-width: 0;
|
||||||
}
|
}
|
||||||
|
|
||||||
@@ -1100,6 +1100,14 @@ section + section {
|
|||||||
min-width: calc(var(--interaction-height) * 1.25);
|
min-width: calc(var(--interaction-height) * 1.25);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
#component-slider .sg-slider-row .sg-slider-value,
|
||||||
|
#component-slider .sg-activatable-row .sg-slider-row .sg-slider-value {
|
||||||
|
display: inline-flex;
|
||||||
|
align-items: center;
|
||||||
|
height: var(--interaction-height);
|
||||||
|
line-height: 1;
|
||||||
|
}
|
||||||
|
|
||||||
.sg-pulldown-panel .sg-slider-row[data-activatable="true"] {
|
.sg-pulldown-panel .sg-slider-row[data-activatable="true"] {
|
||||||
display: grid;
|
display: grid;
|
||||||
grid-template-columns:
|
grid-template-columns:
|
||||||
@@ -1153,17 +1161,7 @@ section + section {
|
|||||||
column-gap: var(--spacing-large);
|
column-gap: var(--spacing-large);
|
||||||
}
|
}
|
||||||
|
|
||||||
#component-slider .sg-slider-activatable-header {
|
|
||||||
display: contents;
|
|
||||||
}
|
|
||||||
|
|
||||||
#component-slider .sg-slider-activatable-header .sg-mode-toggle {
|
|
||||||
grid-column: 1;
|
|
||||||
grid-row: 1;
|
|
||||||
}
|
|
||||||
|
|
||||||
#component-slider .sg-slider-activatable-header .sg-label {
|
#component-slider .sg-slider-activatable-header .sg-label {
|
||||||
grid-column: 2;
|
|
||||||
grid-row: 1;
|
grid-row: 1;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|||||||
Reference in New Issue
Block a user