Tokenize multiselect panel sizing and remove local viewport magic values
This commit is contained in:
+6
-2
@@ -73,6 +73,8 @@
|
||||
--layout-tab-navigation-large-padding-inline: var(--interaction-padding-horizontal);
|
||||
--layout-pulldown-chevron-reserved-space: var(--spacing-large);
|
||||
--layout-pulldown-panel-form-mobile-width: 90%;
|
||||
--layout-multiselect-pulldown-panel-desktop-width: var(--dimension-multiselect-pulldown-panel-desktop-width);
|
||||
--layout-multiselect-pulldown-panel-mobile-width: var(--dimension-multiselect-pulldown-panel-mobile-width);
|
||||
--layout-input-label-width: var(--dimension-input-label-width);
|
||||
--layout-input-field-desktop-width: var(--dimension-input-field-desktop-width);
|
||||
--layout-input-field-max-width: var(--dimension-input-field-max-width);
|
||||
@@ -220,6 +222,8 @@
|
||||
--dimension-input-field-desktop-width: 400px;
|
||||
--dimension-input-field-max-width: 600px;
|
||||
--dimension-search-field-width: 15.3rem;
|
||||
--dimension-multiselect-pulldown-panel-desktop-width: 500px;
|
||||
--dimension-multiselect-pulldown-panel-mobile-width: 80vw;
|
||||
--dimension-options-row-mode-toggle-width: 7rem;
|
||||
--dimension-options-row-help-panel-width: 16rem;
|
||||
--dimension-card-list-drawer-width: 40%;
|
||||
@@ -1874,13 +1878,13 @@ section + section {
|
||||
}
|
||||
|
||||
.sg-options-row[data-pattern="multiselektions-pulldown"] .sg-pulldown-demo .sg-pulldown-panel {
|
||||
width: 500px;
|
||||
width: var(--layout-multiselect-pulldown-panel-desktop-width);
|
||||
max-width: calc(100vw - (2 * var(--spacing-large)));
|
||||
}
|
||||
|
||||
@media (max-width: 48rem) {
|
||||
.sg-options-row[data-pattern="multiselektions-pulldown"] .sg-pulldown-panel {
|
||||
width: 80vw;
|
||||
width: var(--layout-multiselect-pulldown-panel-mobile-width);
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
Reference in New Issue
Block a user