fix(core): replace most --affine with cssVar (#5728)

using a [babel plugin](https://gist.github.com/pengx17/49e24ae8a5a609bdaff122ee8c679d1c) to transform all var(--affine-xxx) to cssVar

Some issues:
- tried ast-grep but it seems to be not easy to add imports conditionally
- current work does not work well with ts with types because babel will strip them out

packages/frontend/component/src/ui/popover/styles.css.ts

@@ -1,13 +1,13 @@
+import { cssVar } from '@toeverything/theme';
 import { style } from '@vanilla-extract/css';
-
 export const popoverContent = style({
   minWidth: '180px',
-  color: 'var(--affine-text-primary-color)',
+  color: cssVar('textPrimaryColor'),
   borderRadius: '8px',
   padding: '8px',
-  fontSize: 'var(--affine-font-sm)',
+  fontSize: cssVar('fontSm'),
   fontWeight: '400',
-  backgroundColor: 'var(--affine-background-overlay-panel-color)',
-  boxShadow: 'var(--affine-menu-shadow)',
+  backgroundColor: cssVar('backgroundOverlayPanelColor'),
+  boxShadow: cssVar('menuShadow'),
   userSelect: 'none',
 });