From e4c188f9c9faab2ad52a2419f564488dfe0b455f Mon Sep 17 00:00:00 2001
From: Lea <lea.gardavaud@post.ch>
Date: Thu, 10 Oct 2024 14:34:22 +0200
Subject: [PATCH] chore(documentation): improve storybook contrast on mode
 buttons (#3715)

---
 packages/documentation/.storybook/addons/addons.scss |  4 ++++
 .../addons/styles-switcher/StylesSwitcher.tsx        | 12 +++++++++---
 .../addons/version-switcher/VersionSwitcher.tsx      |  2 +-
 3 files changed, 14 insertions(+), 4 deletions(-)

diff --git a/packages/documentation/.storybook/addons/addons.scss b/packages/documentation/.storybook/addons/addons.scss
index eb90a8a8dc..f6861fbce9 100644
--- a/packages/documentation/.storybook/addons/addons.scss
+++ b/packages/documentation/.storybook/addons/addons.scss
@@ -1,5 +1,9 @@
 @use '@swisspost/design-system-styles/core' as post;
 
+.addon-label {
+  color: post.$body-color !important;
+}
+
 .addon-dropdown {
   min-width: 12rem;
   display: flex;
diff --git a/packages/documentation/.storybook/addons/styles-switcher/StylesSwitcher.tsx b/packages/documentation/.storybook/addons/styles-switcher/StylesSwitcher.tsx
index 722fd13277..adebf7a66d 100644
--- a/packages/documentation/.storybook/addons/styles-switcher/StylesSwitcher.tsx
+++ b/packages/documentation/.storybook/addons/styles-switcher/StylesSwitcher.tsx
@@ -164,7 +164,9 @@ function StylesSwitcher() {
           </div>
         }
       >
-        <IconButton size="medium">Theme: {currentTheme}</IconButton>
+        <IconButton className="addon-label" size="medium">
+          Theme: {currentTheme}
+        </IconButton>
       </WithTooltip>
 
       {/* Channel dropdown */}
@@ -186,7 +188,9 @@ function StylesSwitcher() {
           </div>
         }
       >
-        <IconButton size="medium">Chanel: {currentChannel}</IconButton>
+        <IconButton className="addon-label" size="medium">
+          Chanel: {currentChannel}
+        </IconButton>
       </WithTooltip>
 
       {/* Mode dropdown */}
@@ -208,7 +212,9 @@ function StylesSwitcher() {
           </div>
         }
       >
-        <IconButton size="medium">Mode: {currentMode}</IconButton>
+        <IconButton className="addon-label" size="medium">
+          Mode: {currentMode}
+        </IconButton>
       </WithTooltip>
     </>
   );
diff --git a/packages/documentation/.storybook/addons/version-switcher/VersionSwitcher.tsx b/packages/documentation/.storybook/addons/version-switcher/VersionSwitcher.tsx
index ad07d1df0b..bcd0fd0058 100644
--- a/packages/documentation/.storybook/addons/version-switcher/VersionSwitcher.tsx
+++ b/packages/documentation/.storybook/addons/version-switcher/VersionSwitcher.tsx
@@ -102,7 +102,7 @@ function VersionSwitcher() {
         </>
       )}
     >
-      <IconButton placeholder="Versions">
+      <IconButton placeholder="Versions" className="addon-label">
         v{CURRENT_MINOR_VERSION}
         <post-icon name="2052"></post-icon>
       </IconButton>