From dbdc5848953e71c7ecfab36586850a92d92b3b79 Mon Sep 17 00:00:00 2001
From: sokumon <sohamkulkarns9@gmail.com>
Date: Sat, 4 Jan 2025 18:57:30 +0530
Subject: [PATCH] fix(style): dark mode suport for sidebar

---
 frappe/public/scss/desk/sidebar.scss | 16 +++++++++++++---
 1 file changed, 13 insertions(+), 3 deletions(-)

diff --git a/frappe/public/scss/desk/sidebar.scss b/frappe/public/scss/desk/sidebar.scss
index 671f1a85a9..c336670763 100644
--- a/frappe/public/scss/desk/sidebar.scss
+++ b/frappe/public/scss/desk/sidebar.scss
@@ -1,4 +1,14 @@
 // clean-this-file
+:root {
+	--sidebar-hover-color: #f3f3f3;
+	--sidebar-active-color: rgba(255, 255, 255, 1);
+	--sidebar-border-color: #ededed;
+}
+[data-theme="dark"] {
+	--sidebar-hover-color: rgba(43, 43, 43, 1);
+	--sidebar-active-color: rgba(66, 66, 66, 1);
+	--sidebar-border-color: #232323;
+}
 .underline-hover {
 	display: initial;
 }
@@ -65,7 +75,7 @@ body {
 .body-sidebar {
 	width: 50px;
 	background: var(--subtle-accent);
-	border-right: 1px solid var(--dark-border-color);
+	border-right: 1px solid var(--sidebar-border-color);
 
 	display: flex;
 	flex-direction: column;
@@ -381,7 +391,7 @@ body {
 }
 // sidebar-item states
 @mixin hover-mixin {
-	background-color: #f3f3f3;
+	background-color: var(--sidebar-hover-color);
 	border-radius: 8px;
 }
 
@@ -390,7 +400,7 @@ body {
 }
 
 .active-sidebar {
-	background: var(--surface-selected, rgba(255, 255, 255, 1));
+	background: var(--sidebar-active-color);
 	box-shadow: 0px 1px 2px 0px rgba(0, 0, 0, 0.1);
 	border-radius: 8px;
 }