Reuse multiselect panel width token
This commit is contained in:
1 parent
91bbd235e5
commit
23992dcf70
3 files changed
+3
-4
No files matched your search
@@ -192,7 +192,6 @@
|
||||
<tr><td>notifications-card-min-width</td><td>445px</td><td>Mindestbreite der Notification Card im Pattern Notifications; 50px größer als die Object Card und Grundlage für Flex-Basis und Mindestbreite des Patterns.</td></tr>
|
||||
<tr><td>search-field-width</td><td>15.3rem</td><td>Fixe Breite des Suchfeld-Inputs inklusive Clear-Button-Bereich.</td></tr>
|
||||
<tr><td>layer-pulldown-panel</td><td>40</td><td>Layer-Stufe für geöffnete Pulldown-Ausklappfelder, damit sie über anderen Inhalten liegen.</td></tr>
|
||||
<tr><td>pulldown-panel-form-mobile-width</td><td>340px</td><td>Feste Mindestbreite für formularbasierte Pulldown-Panels; bei schmaleren Viewports greift die vorhandene Viewport-Kappe.</td></tr>
|
||||
<tr><td>multiselect-pulldown-panel-desktop-width</td><td>500px</td><td>Reservierte Foundation-Breite für Multiselektions-Pulldown-Panels; aktuell nicht aktiv genutzt, da das Panel inhaltsbasiert mit Viewport-Kappe skaliert.</td></tr>
|
||||
<tr><td>multiselect-pulldown-panel-mobile-width</td><td>80vw</td><td>Reservierte mobile Foundation-Breite für Multiselektions-Pulldown-Panels; aktuell nicht aktiv genutzt, da das Panel inhaltsbasiert mit Viewport-Kappe skaliert.</td></tr>
|
||||
<tr><td>options-row-mode-toggle-width</td><td>7rem</td><td>Breite des Modus-Schiebers in der Options Row.</td></tr>
|
||||
|
||||
@@ -79,7 +79,7 @@
|
||||
--layout-pulldown-chevron-offset: var(--compact-interaction-padding-horizontal);
|
||||
--layout-tab-navigation-large-padding-inline: var(--interaction-padding-horizontal);
|
||||
--layout-pulldown-chevron-reserved-space: var(--spacing-large);
|
||||
--layout-pulldown-panel-form-mobile-width: 340px;
|
||||
--layout-pulldown-panel-form-mobile-width: 90%;
|
||||
--layer-pulldown-panel: var(--dimension-layer-pulldown-panel);
|
||||
--layout-multiselect-pulldown-panel-desktop-width: var(--dimension-multiselect-pulldown-panel-desktop-width);
|
||||
--layout-input-label-width: var(--dimension-input-label-width);
|
||||
|
||||
@@ -104,11 +104,11 @@
|
||||
|
||||
.sg-options-row[data-pattern="multiselektions-pulldown"] .sg-pulldown-panel {
|
||||
width: min(
|
||||
var(--layout-pulldown-panel-form-mobile-width),
|
||||
var(--layout-multiselect-pulldown-panel-desktop-width),
|
||||
calc(100vw - (2 * var(--spacing-large)))
|
||||
);
|
||||
min-width: min(
|
||||
var(--layout-pulldown-panel-form-mobile-width),
|
||||
var(--layout-multiselect-pulldown-panel-desktop-width),
|
||||
calc(100vw - (2 * var(--spacing-large)))
|
||||
);
|
||||
max-width: calc(100vw - (2 * var(--spacing-large)));
|
||||
|
||||
Reference in new issue
Block a user