Fix desktop pulldown slider remove button overflow
This commit is contained in:
@@ -969,6 +969,52 @@ section + section {
|
||||
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) {
|
||||
#component-slider .sg-state-example {
|
||||
grid-template-columns: 1fr;
|
||||
|
||||
Reference in New Issue
Block a user