[yew-devel] [PATCH yew-widget-toolkit-assets 1/1] material: tab panel: fix secondary tab bar style

Dominik Csapak d.csapak at proxmox.com
Mon Jan 12 13:09:02 CET 2026


secondary tabbars should align the icon in a row, not a column, and also
the icon should use the same size as the text.

Use the new 'primary' and 'secondary' classes on the tabbars to
differentiate them.

Signed-off-by: Dominik Csapak <d.csapak at proxmox.com>
---
 scss/material/_theme_post_material.scss | 20 ++++++++++++++++----
 1 file changed, 16 insertions(+), 4 deletions(-)

diff --git a/scss/material/_theme_post_material.scss b/scss/material/_theme_post_material.scss
index 0f448cb..c88b055 100644
--- a/scss/material/_theme_post_material.scss
+++ b/scss/material/_theme_post_material.scss
@@ -35,15 +35,27 @@ ul.pwt-menubar {
 
         span {
             display: flex;
-            flex-direction: column;
             align-items: center;
-            gap: 0;
+        }
+    }
+
+    &.primary {
+        .pwt-nav-link {
+            span {
+                gap: 0;
+                flex-direction: column;
 
-            &:before {
-                font-size: map-get($font-size, "headline-small");
+                &:before {
+                    font-size: map-get($font-size, "headline-small");
+                }
             }
         }
     }
+    &.secondary {
+        span {
+            flex-direction: row;
+        }
+    }
 }
 
 /// `pwt-datatable-content tr`
-- 
2.47.3





More information about the yew-devel mailing list