From 850cfe11877fea57534ae5e7bd847983278b63f8 Mon Sep 17 00:00:00 2001
From: Fangdun Tsai <cfddream@gmail.com>
Date: Sun, 30 Apr 2023 14:51:33 +0800
Subject: [PATCH] fix: theme button width (#2202)

---
 .../header-right-items/theme-mode-switch/style.ts            | 5 ++++-
 packages/component/src/ui/menu/styles.ts                     | 1 +
 2 files changed, 5 insertions(+), 1 deletion(-)

diff --git a/apps/web/src/components/blocksuite/workspace-header/header-right-items/theme-mode-switch/style.ts b/apps/web/src/components/blocksuite/workspace-header/header-right-items/theme-mode-switch/style.ts
index 29973c966f..649299a97f 100644
--- a/apps/web/src/components/blocksuite/workspace-header/header-right-items/theme-mode-switch/style.ts
+++ b/apps/web/src/components/blocksuite/workspace-header/header-right-items/theme-mode-switch/style.ts
@@ -17,6 +17,7 @@ export const StyledThemeModeContainer = styled('div')(() => {
 });
 export const StyledThemeButtonContainer = styled('div')(() => {
   return {
+    height: '32px',
     border: `1px solid var(--affine-border-color)`,
     borderRadius: '4px',
     cursor: 'pointer',
@@ -29,6 +30,8 @@ export const StyledThemeButton = styled('button')<{
   active: boolean;
 }>(({ active }) => {
   return {
+    height: '100%',
+    flex: 1,
     cursor: 'pointer',
     color: active ? 'var(--affine-primary-color)' : 'var(--affine-icon-color)',
   };
@@ -36,7 +39,7 @@ export const StyledThemeButton = styled('button')<{
 export const StyledVerticalDivider = styled('div')(() => {
   return {
     width: '1px',
-    height: '32px',
+    height: '100%',
     borderLeft: `1px solid var(--affine-border-color)`,
   };
 });
diff --git a/packages/component/src/ui/menu/styles.ts b/packages/component/src/ui/menu/styles.ts
index e6d89b24b3..4068b5b64a 100644
--- a/packages/component/src/ui/menu/styles.ts
+++ b/packages/component/src/ui/menu/styles.ts
@@ -15,6 +15,7 @@ export const StyledMenuWrapper = styled(StyledPopperContainer)<{
     fontSize: '14px',
     backgroundColor: 'var(--affine-white)',
     boxShadow: 'var(--affine-menu-shadow)',
+    userSelect: 'none',
   };
 });