Fix desktop pulldown slider remove button overflow

This commit is contained in:
2026-05-19 16:00:12 +02:00
parent 67ddc2e57a
commit 78fef1ba5f
+46
View File
@@ -969,6 +969,52 @@ section + section {
opacity: var(--disabled-opacity); opacity: var(--disabled-opacity);
} }
.sg-pulldown-panel .sg-slider-row[data-activatable="true"] {
display: grid;
grid-template-columns:
var(--layout-input-label-width)
minmax(0, 1fr)
auto
var(--interaction-height);
align-items: center;
column-gap: var(--spacing-small);
padding-right: 0;
}
.sg-pulldown-panel .sg-slider-row[data-activatable="true"] .sg-label {
min-width: 0;
flex: 0 0 auto;
grid-column: 1;
grid-row: 1;
}
.sg-pulldown-panel .sg-slider-row[data-activatable="true"] .sg-slider {
min-width: 0;
max-width: 100%;
width: 100%;
grid-column: 2;
grid-row: 1;
}
.sg-pulldown-panel .sg-slider-row[data-activatable="true"] .sg-slider-value {
min-width: calc(var(--interaction-height) * 1.25);
justify-self: end;
align-self: center;
white-space: nowrap;
grid-column: 3;
grid-row: 1;
}
.sg-pulldown-panel .sg-slider-row[data-activatable="true"] .sg-activatable-remove {
position: static;
top: auto;
right: auto;
transform: none;
margin-left: 0;
grid-column: 4;
grid-row: 1;
}
@media (max-width: 48rem) { @media (max-width: 48rem) {
#component-slider .sg-state-example { #component-slider .sg-state-example {
grid-template-columns: 1fr; grid-template-columns: 1fr;