From 7b983b6506c8ad03e1492c80cc45ca4ef2be6543 Mon Sep 17 00:00:00 2001
From: Heleen <magned@gmail.com>
Date: Wed, 27 Sep 2023 16:38:19 +0200
Subject: [PATCH] Fixes tabs styling

---
 docs/documentation/components/tabs.html | 4 ++++
 manon/tabs-variables.scss               | 6 +++++-
 manon/tabs.scss                         | 4 ++++
 3 files changed, 13 insertions(+), 1 deletion(-)

diff --git a/docs/documentation/components/tabs.html b/docs/documentation/components/tabs.html
index 90ded65d..7e7aa9eb 100644
--- a/docs/documentation/components/tabs.html
+++ b/docs/documentation/components/tabs.html
@@ -156,6 +156,7 @@ <h3>CSS</h3>
   --tabs-item-line-height: ;
   --tabs-item-background-color: ;
   --tabs-item-text-decoration: ;
+  --tabs-item-font-weight: ;
 
   /* List item hover */
   --tabs-item-hover-border-width: ;
@@ -163,6 +164,7 @@ <h3>CSS</h3>
   --tabs-item-hover-border-color: ;
   --tabs-item-hover-text-color: ;
   --tabs-item-hover-background-color: ;
+  --tabs-item-hover-font-weight: ;
 
   /* List item active */
   --tabs-item-active-border-width: ;
@@ -171,6 +173,7 @@ <h3>CSS</h3>
   --tabs-item-active-text-color: ;
   --tabs-item-active-background-color: ;
   --tabs-item-padding: ;
+  --tabs-item-active-font-weight: ;
 
   /* List item active hover */
   --tabs-item-active-hover-border-width: ;
@@ -178,6 +181,7 @@ <h3>CSS</h3>
   --tabs-item-active-hover-border-color: ;
   --tabs-item-active-hover-text-color: ;
   --tabs-item-active-hover-background-color: ;
+  --tabs-item-active-hover-font-weight: ;
 }
               </code>
             </pre>
diff --git a/manon/tabs-variables.scss b/manon/tabs-variables.scss
index 77e0db8c..7d59edc2 100644
--- a/manon/tabs-variables.scss
+++ b/manon/tabs-variables.scss
@@ -19,13 +19,15 @@
   --tabs-item-line-height: var(--application-base-line-height);
   --tabs-item-background-color: var(--tabs-background-color);
   --tabs-item-text-decoration: none;
+  --tabs-item-font-weight: var(--application-base-font-weight);
 
   /* List item hover */
-  --tabs-item-hover-border-width: 0 0 4px 0;
+  --tabs-item-hover-border-width: 0;
   --tabs-item-hover-border-style: solid;
   --tabs-item-hover-border-color: var(--application-base-accent-color);
   --tabs-item-hover-text-color: black;
   --tabs-item-hover-background-color: var(--tabs-item-background-color);
+  --tabs-item-hover-font-weight: var(--tabs-item-font-weight);
 
   /* List item active */
   --tabs-item-active-border-width: 0 0 4px 0;
@@ -34,6 +36,7 @@
   --tabs-item-active-text-color: black;
   --tabs-item-active-background-color: var(--tabs-item-background-color);
   --tabs-item-padding: 0.5rem 0;
+  --tabs-item-active-font-weight: bold;
 
   /* List item active hover */
   --tabs-item-active-hover-border-width: 0 0 4px 0;
@@ -41,4 +44,5 @@
   --tabs-item-active-hover-border-color: var(--application-base-accent-color);
   --tabs-item-active-hover-text-color: black;
   --tabs-item-active-hover-background-color: var(--tabs-item-background-color);
+  --tabs-item-active-hover-font-weight: var(--tabs-item-active-font-weight);
 }
diff --git a/manon/tabs.scss b/manon/tabs.scss
index 394af991..cd9bd61e 100644
--- a/manon/tabs.scss
+++ b/manon/tabs.scss
@@ -13,6 +13,7 @@
   padding: var(--tabs-item-padding);
   background-color: var(--tabs-item-background-color);
   text-decoration: var(--tabs-item-text-decoration);
+  font-weight: var(--tabs-item-font-weight);
   white-space: nowrap;
   display: inline-block;
 
@@ -21,6 +22,7 @@
     border-style: var(--tabs-item-hover-border-style);
     border-color: var(--tabs-item-hover-border-color);
     color: var(--tabs-item-hover-text-color);
+    font-weight: var(--tabs-item-hover-font-weight);
     background-color: var(--tabs-item-hover-background-color);
   }
 }
@@ -31,6 +33,7 @@
   border-color: var(--tabs-item-active-border-color);
   color: var(--tabs-item-active-text-color);
   background-color: var(--tabs-item-active-background-color);
+  font-weight: var(--tabs-item-active-font-weight);
 
   &:hover {
     border-width: var(--tabs-item-active-hover-border-width);
@@ -38,6 +41,7 @@
     border-color: var(--tabs-item-active-hover-border-color);
     color: var(--tabs-item-active-hover-text-color);
     background-color: var(--tabs-item-active-hover-background-color);
+    font-weight: var(--tabs-item-active-hover-font-weight);
   }
 }