From 6cdb683410626a16ef08b16b1a773ccfb4cec53e Mon Sep 17 00:00:00 2001
From: David Luzar <5153846+dwelle@users.noreply.github.com>
Date: Fri, 31 Jan 2025 12:33:54 +0100
Subject: [PATCH] fix: button bg CSS variable leaking into other styles (#9075)

---
 packages/excalidraw/css/styles.scss | 8 +++++++-
 packages/excalidraw/css/theme.scss  | 3 ---
 2 files changed, 7 insertions(+), 4 deletions(-)

diff --git a/packages/excalidraw/css/styles.scss b/packages/excalidraw/css/styles.scss
index 673106700e..6f1d9cd48c 100644
--- a/packages/excalidraw/css/styles.scss
+++ b/packages/excalidraw/css/styles.scss
@@ -649,15 +649,21 @@ body.excalidraw-cursor-resize * {
     @include filledButtonOnCanvas;
   }
 
+  .App-mobile-menu,
   .App-menu__left {
     --button-border: transparent;
     --button-bg: var(--color-surface-mid);
+  }
 
-    @at-root .excalidraw.theme--dark#{&} {
+  @at-root .excalidraw.theme--dark#{&} {
+    .App-mobile-menu,
+    .App-menu__left {
       --button-hover-bg: #363541;
       --button-bg: var(--color-surface-high);
     }
+  }
 
+  .App-menu__left {
     .buttonList {
       padding: 0.25rem 0;
     }
diff --git a/packages/excalidraw/css/theme.scss b/packages/excalidraw/css/theme.scss
index 40ecaf8cab..69c28afdab 100644
--- a/packages/excalidraw/css/theme.scss
+++ b/packages/excalidraw/css/theme.scss
@@ -32,7 +32,6 @@
     0px 0px 3.1270833015441895px 0px rgba(0, 0, 0, 0.08),
     0px 7px 14px 0px rgba(0, 0, 0, 0.05);
 
-  --button-bg: var(--color-surface-mid);
   --button-hover-bg: var(--color-surface-high);
   --button-active-bg: var(--color-surface-high);
   --button-active-border: var(--color-brand-active);
@@ -172,8 +171,6 @@
     --button-destructive-bg-color: #5a0000;
     --button-destructive-color: #{$oc-red-3};
 
-    --button-bg: var(--color-surface-high);
-
     --button-gray-1: #363636;
     --button-gray-2: #272727;
     --button-gray-3: #222;