feat: upgrate to new theme (#2027)

Co-authored-by: Himself65 <himself65@outlook.com>

packages/component/src/ui/modal/ModalWrapper.tsx

@@ -11,7 +11,7 @@ export const ModalWrapper = styled('div')<{
     width,
     height,
     minHeight,
-    backgroundColor: theme.colors.popoverBackground,
+    backgroundColor: 'var(--affine-white)',
     borderRadius: '16px',
     position: 'relative',
     maxHeight: 'calc(100vh - 32px)',

packages/component/src/ui/modal/styles.ts

@@ -12,7 +12,7 @@ export const StyledBackdrop = styled('div')(({ theme }) => {
     bottom: '0',
     top: '0',
     left: '0',
-    backgroundColor: theme.colors.modalBackground,
+    backgroundColor: 'var(--affine-background-modal-color)',
   };
 });
 
@@ -33,7 +33,7 @@ export const StyledModal = styled(ModalUnstyled, {
     position: 'fixed',
     left: '0',
     top: '0',
-    zIndex: theme.zIndex.modal,
+    zIndex: 'var(--affine-z-index-modal)',
     '*': {
       WebkitTapHighlightColor: 'transparent',
       outline: 'none',