From 8e6682b1ae016611104b621d2b5b2b8f3f77ce41 Mon Sep 17 00:00:00 2001
From: Ryan Di <ryan.weihao.di@gmail.com>
Date: Wed, 24 Sep 2025 19:12:48 +1000
Subject: [PATCH] change background

---
 packages/common/src/constants.ts            |  4 +---
 packages/excalidraw/components/Actions.scss | 10 +++++-----
 2 files changed, 6 insertions(+), 8 deletions(-)

diff --git a/packages/common/src/constants.ts b/packages/common/src/constants.ts
index b7c31e5273..546fce9db4 100644
--- a/packages/common/src/constants.ts
+++ b/packages/common/src/constants.ts
@@ -539,7 +539,5 @@ export const DOUBLE_TAP_POSITION_THRESHOLD = 35;
 
 // glass background for mobile action buttons
 export const MOBILE_ACTION_BUTTON_BG = {
-  background: "rgba(255, 255, 255, 0.1)",
-  backdropFilter: "blur(20px)",
-  WebkitBackdropFilter: "blur(20px)",
+  background: "var(--island-bg-color)",
 } as const;
diff --git a/packages/excalidraw/components/Actions.scss b/packages/excalidraw/components/Actions.scss
index 484afb6b65..32db665be0 100644
--- a/packages/excalidraw/components/Actions.scss
+++ b/packages/excalidraw/components/Actions.scss
@@ -122,9 +122,7 @@
       justify-content: center;
       transition: all 0.2s ease;
 
-      background: rgba(255, 255, 255, 0.1);
-      backdrop-filter: blur(20px);
-      -webkit-backdrop-filter: blur(20px);
+      background: var(--island-bg-color);
 
       svg {
         width: 1rem;
@@ -168,8 +166,10 @@
 
   .ToolIcon {
     .ToolIcon__icon {
-      width: 2.5rem;
-      height: 2.5rem;
+      width: var(--mobile-action-button-size);
+      height: var(--mobile-action-button-size);
+
+      background-color: var(--island-bg-color);
 
       &:hover {
         background-color: transparent;