From b8ac6bef4466f372f7a9ca5c2c69df6d5116ca66 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Mathias=20Gla=CC=88ser?= <mathias.glaeser@beaufort.ch>
Date: Wed, 10 Jun 2026 17:31:19 +0200
Subject: [PATCH] Use large tab navigation for VSF header actions

---
 patterns/vsf-portal-header-public.html | 6 +++---
 1 file changed, 3 insertions(+), 3 deletions(-)

diff --git a/patterns/vsf-portal-header-public.html b/patterns/vsf-portal-header-public.html
index ad88cc7..f337d0c 100644
--- a/patterns/vsf-portal-header-public.html
+++ b/patterns/vsf-portal-header-public.html
@@ -17,12 +17,12 @@
           <p class="sg-portal-header__brand sg-brand-title" data-pattern-part="portal-header-brand">ValueStockFinder</p>
 
           <div class="sg-portal-header__menu-wrap" data-pattern-part="portal-header-action">
-            <div class="sg-component-row">
-              <button class="sg-interaction-element sg-button sg-button--active" type="button" data-component="button" data-component-state="active">
+            <div class="sg-tab-button-group" role="tablist" aria-label="Anmeldung" data-component="tab-navigation" data-component-size="large" data-component-context="portal-header">
+              <button class="sg-interaction-element sg-button sg-tab-button" type="button" role="tab" aria-selected="false" data-component-part="tab-button" data-component-state="inactive">
                 Login
               </button>
 
-              <button class="sg-interaction-element sg-button sg-button--active" type="button" data-component="button" data-component-state="active">
+              <button class="sg-interaction-element sg-button sg-tab-button" type="button" role="tab" aria-selected="false" data-component-part="tab-button" data-component-state="inactive">
                 Registrieren
               </button>
             </div>