From 77200ed8fc070183f07c4e6c804e11b3154ba26e Mon Sep 17 00:00:00 2001
From: JimmFly <yangjinfei001@gmail.com>
Date: Mon, 10 Jul 2023 15:00:23 +0800
Subject: [PATCH] style: change switch tip color (#3123)

(cherry picked from commit 812e0e9c9a01b7ac1126ca840b14886ddb5fa11a)
---
 .../workspace-header/editor-mode-switch/index.tsx           | 3 ++-
 .../blocksuite/workspace-header/editor-mode-switch/style.ts | 6 +++---
 2 files changed, 5 insertions(+), 4 deletions(-)

diff --git a/apps/web/src/components/blocksuite/workspace-header/editor-mode-switch/index.tsx b/apps/web/src/components/blocksuite/workspace-header/editor-mode-switch/index.tsx
index 70ef4b1fa0..0c6ca2522d 100644
--- a/apps/web/src/components/blocksuite/workspace-header/editor-mode-switch/index.tsx
+++ b/apps/web/src/components/blocksuite/workspace-header/editor-mode-switch/index.tsx
@@ -19,9 +19,10 @@ export type EditorModeSwitchProps = {
   style?: CSSProperties;
 };
 const TooltipContent = () => {
+  const t = useAFFiNEI18N();
   return (
     <div>
-      Switch
+      {t['Switch']()}
       <StyledKeyboardItem>
         {!environment.isServer && environment.isMacOs ? '⌥ + S' : 'Alt + S'}
       </StyledKeyboardItem>
diff --git a/apps/web/src/components/blocksuite/workspace-header/editor-mode-switch/style.ts b/apps/web/src/components/blocksuite/workspace-header/editor-mode-switch/style.ts
index adb7adb74e..361b9b9492 100644
--- a/apps/web/src/components/blocksuite/workspace-header/editor-mode-switch/style.ts
+++ b/apps/web/src/components/blocksuite/workspace-header/editor-mode-switch/style.ts
@@ -56,11 +56,11 @@ export const StyledSwitchItem = styled('button')<{
 
 export const StyledKeyboardItem = styled('span')(() => {
   return {
-    marginLeft: '5px',
-    fontSize: '4px',
+    marginLeft: '10px',
+    fontSize: 'var(--affine-font-xs)',
     paddingLeft: '5px',
     paddingRight: '5px',
-    backgroundColor: '#55545A',
+    backgroundColor: 'var(--affine-white-10)',
     borderRadius: '4px',
   };
 });