feat: modify theme colors (#1421)

apps/web/src/components/blocksuite/block-suite-editor/index.tsx

@@ -1,5 +1,3 @@
-import '@blocksuite/editor/themes/affine.css';
-
 import { config } from '@affine/env';
 import { BlockHub } from '@blocksuite/blocks';
 import { EditorContainer } from '@blocksuite/editor';

apps/web/src/components/pure/workspace-slider-bar/style.ts

@@ -8,7 +8,7 @@ export const StyledSliderBar = styled('div')<{ show: boolean }>(
       height: '100vh',
       minHeight: '450px',
       background: theme.colors.hubBackground,
-      boxShadow: theme.shadow.modal,
+      boxShadow: theme.shadow.popover,
       transition: 'width .15s, padding .15s',
       position: 'relative',
       zIndex: theme.zIndex.modal,

apps/web/src/providers/ThemeProvider.tsx

@@ -20,7 +20,10 @@ const ThemeInjector = React.memo<{
   return (
     <GlobalStyles
       styles={{
-        '#__next': {
+        // '#__next': {
+        //   ...globalThemeVariables(themeStyle),
+        // },
+        ':root': {
           ...globalThemeVariables(themeStyle),
         },
         html: {