From b135be19684d81b0692a04a02e11370495c6f6a3 Mon Sep 17 00:00:00 2001
From: Cagatay Civici <cagatay.civici@gmail.com>
Date: Tue, 14 May 2024 15:01:05 +0300
Subject: [PATCH] Tabs for Nora

---
 components/lib/themes/lara/tabs/index.js |  2 +-
 components/lib/themes/nora/tabs/index.js | 39 ++++++++++++------------
 2 files changed, 20 insertions(+), 21 deletions(-)

diff --git a/components/lib/themes/lara/tabs/index.js b/components/lib/themes/lara/tabs/index.js
index 5a2561680..127659826 100644
--- a/components/lib/themes/lara/tabs/index.js
+++ b/components/lib/themes/lara/tabs/index.js
@@ -13,7 +13,7 @@ export default {
         hoverColor: '{text.color}',
         activeColor: '{primary.color}',
         padding: '1rem 1.25rem',
-        fontWeight: '600',
+        fontWeight: '700',
         margin: '0',
         focusRing: {
             width: '{focus.ring.width}',
diff --git a/components/lib/themes/nora/tabs/index.js b/components/lib/themes/nora/tabs/index.js
index 27a9f707e..dec18ad71 100644
--- a/components/lib/themes/nora/tabs/index.js
+++ b/components/lib/themes/nora/tabs/index.js
@@ -5,26 +5,25 @@ export default {
         borderColor: '{content.border.color}'
     },
     tab: {
-        background: 'transparent',
-        hoverBackground: 'transparent',
-        activeBackground: 'transparent',
-        borderWidth: '0 0 1px 0',
-        borderColor: '{content.border.color}',
-        hoverBorderColor: '{content.border.color}',
-        activeBorderColor: '{primary.color}',
+        background: '{content.background}',
+        hoverBackground: '{surface.200}',
+        activeBackground: '{primary.color}',
+        borderWidth: '0',
+        borderColor: 'transparent',
+        hoverBorderColor: 'transparent',
+        activeBorderColor: 'transparent',
         color: '{text.muted.color}',
         hoverColor: '{text.color}',
-        activeColor: '{primary.color}',
-        padding: '1rem 1.125rem',
-        fontWeight: '600',
-        margin: '0 0 -1px 0',
-        gap: '0.5rem',
+        activeColor: '{primary.contrast.color}',
+        padding: '1rem 1.25rem',
+        fontWeight: '700',
+        margin: '0',
         focusRing: {
             width: '{focus.ring.width}',
             style: '{focus.ring.style}',
             color: '{focus.ring.color}',
             offset: '{focus.ring.offset}',
-            shadow: '{focus.ring.shadow}'
+            shadow: 'inset {focus.ring.shadow}'
         }
     },
     tabpanel: {
@@ -41,24 +40,24 @@ export default {
             width: '{focus.ring.width}',
             style: '{focus.ring.style}',
             color: '{focus.ring.color}',
-            offset: '-1px',
-            shadow: '{focus.ring.shadow}'
+            offset: '{focus.ring.offset}',
+            shadow: 'inset {focus.ring.shadow}'
         }
     },
     activeBar: {
-        height: '1px',
-        bottom: '-1px',
-        background: '{primary.color}'
+        height: '0',
+        bottom: '0',
+        background: 'transparent'
     },
     colorScheme: {
         light: {
             navButton: {
-                boxShadow: '0px 0px 10px 50px rgba(255, 255, 255, 0.6)'
+                shadow: '0px 0px 10px 50px rgba(255, 255, 255, 0.6)'
             }
         },
         dark: {
             navButton: {
-                boxShadow: '0px 0px 10px 50px color-mix(in srgb, {content.background}, transparent 50%)'
+                shadow: '0px 0px 10px 50px color-mix(in srgb, {content.background}, transparent 50%)'
             }
         }
     }