From f2a2ed727b9b2c285fda38b7d1ea50ff69d51d4f Mon Sep 17 00:00:00 2001
From: jmfrancois <jmfrancois@talend.com>
Date: Thu, 20 Jul 2023 13:54:53 +0200
Subject: [PATCH] fix: SidePanel for the theme

---
 packages/components/src/SidePanel/SidePanel.component.js | 9 ++++++++-
 packages/components/src/SidePanel/SidePanel.module.scss  | 1 +
 2 files changed, 9 insertions(+), 1 deletion(-)

diff --git a/packages/components/src/SidePanel/SidePanel.component.js b/packages/components/src/SidePanel/SidePanel.component.js
index 0749169e1d3..90109896032 100644
--- a/packages/components/src/SidePanel/SidePanel.component.js
+++ b/packages/components/src/SidePanel/SidePanel.component.js
@@ -110,7 +110,14 @@ function SidePanel({
 	const toggleButtonTitle = docked ? expandLabel : collapseTitle;
 	const Components = Inject.getAll(getComponent, { Action, ActionList });
 	return (
-		<nav id={id} className={navCSS} role="navigation" ref={ref} style={{ width }}>
+		<nav
+			id={id}
+			className={navCSS}
+			role="navigation"
+			ref={ref}
+			style={{ width }}
+			data-theme="light"
+		>
 			{backgroundIcon && (
 				<style>
 					{`#${id}::before {
diff --git a/packages/components/src/SidePanel/SidePanel.module.scss b/packages/components/src/SidePanel/SidePanel.module.scss
index ab5fbaf9c4f..c316cd382c9 100644
--- a/packages/components/src/SidePanel/SidePanel.module.scss
+++ b/packages/components/src/SidePanel/SidePanel.module.scss
@@ -192,6 +192,7 @@ $large-docked-width: 7rem;
 
 	&.reverse[role='navigation'] {
 		background: tokens.$coral-color-neutral-background-medium !important;
+		color: tokens.$coral-color-neutral-text !important;
 
 		&::before {
 			content: none;