From bf34176f79401bdd6a26d256a1c65c0fa8e5c56a Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Mathias=20Gla=CC=88ser?= Date: Tue, 19 May 2026 15:55:44 +0200 Subject: [PATCH] Apply global mobile slider wrap label-over-slider in pulldown panels --- styleguide.css | 32 ++++++++------------------------ 1 file changed, 8 insertions(+), 24 deletions(-) diff --git a/styleguide.css b/styleguide.css index e7fa2f9..c329149 100644 --- a/styleguide.css +++ b/styleguide.css @@ -1624,14 +1624,18 @@ section + section { } .sg-options-row .sg-pulldown-panel .sg-slider-row[data-activatable="true"] .sg-label { - min-width: 0; - flex: 0 0 auto; + min-width: 100%; + flex: 0 0 100%; + grid-column: 1 / -1; + grid-row: 1; } .sg-options-row .sg-pulldown-panel .sg-slider-row[data-activatable="true"] .sg-slider { min-width: 0; max-width: 100%; width: 100%; + grid-column: 1; + grid-row: 2; } .sg-options-row .sg-pulldown-panel .sg-slider-row[data-activatable="true"] .sg-slider-value { @@ -1639,33 +1643,13 @@ section + section { justify-self: end; align-self: center; white-space: nowrap; + grid-column: 2; + grid-row: 2; } .sg-options-row .sg-pulldown-panel .sg-slider-row[data-activatable="true"] .sg-activatable-remove { position: static; transform: none; - grid-column: 3; - grid-row: 1; - } - - .sg-options-row[data-pattern="multiselektions-pulldown"] .sg-pulldown-panel .sg-slider-row[data-activatable="true"] .sg-label { - min-width: 100%; - flex: 0 0 100%; - grid-column: 1 / -1; - grid-row: 1; - } - - .sg-options-row[data-pattern="multiselektions-pulldown"] .sg-pulldown-panel .sg-slider-row[data-activatable="true"] .sg-slider { - grid-column: 1; - grid-row: 2; - } - - .sg-options-row[data-pattern="multiselektions-pulldown"] .sg-pulldown-panel .sg-slider-row[data-activatable="true"] .sg-slider-value { - grid-column: 2; - grid-row: 2; - } - - .sg-options-row[data-pattern="multiselektions-pulldown"] .sg-pulldown-panel .sg-slider-row[data-activatable="true"] .sg-activatable-remove { grid-column: 3; grid-row: 2; }