mebtte · mebtte · Oct 12, 2023 · Oct 7, 2023 · Oct 8, 2023 · Oct 8, 2023
diff --git a/apps/cli/src/commands/start_server/index.ts b/apps/cli/src/commands/start_server/index.ts
@@ -6,7 +6,6 @@ import cors from '@koa/cors';
 import mount from 'koa-mount';
 import { PathPrefix } from '#/constants';
 import { updateConfig, getConfig, Config, Mode } from '@/config';
-import definition from '@/definition';
 import initialize from './initialize';
 import startSchedule from './schedule';
 import { getAssetApp } from './asset_app';
@@ -61,14 +60,7 @@ export default async ({
   server.use(mount(`/${PathPrefix.FORM}`, getFormApp()));
   server.use(mount(`/${PathPrefix.API}`, getApiApp()));
   server.use(mount(`/${PathPrefix.BASE}`, getBaseApp()));
-
-  /**
-   * 非构建模式下不用托管 pwa
-   * @author mebtte<hi@mebtte.com>
-   */
-  if (definition.BUILT) {
-    server.use(mount('/', getPwaApp()));
-  }
+  server.use(mount('/', getPwaApp()));
 
   http.createServer(server.callback()).listen(getConfig().port);
 };
diff --git a/apps/cli/src/commands/start_server/pwa_app.ts b/apps/cli/src/commands/start_server/pwa_app.ts
@@ -2,10 +2,16 @@ import path from 'path';
 import Koa from 'koa';
 import serve from 'koa-static';
 import etag from 'koa-etag';
+import definition from '@/definition';
 
 export function getPwaApp() {
   const app = new Koa();
   app.use(etag());
-  app.use(serve(path.join(__dirname, 'pwa')));
+
+  if (definition.BUILT) {
+    app.use(serve(path.join(__dirname, 'pwa')));
+  } else {
+    app.use(serve(path.join(__dirname, '../../../../../dist/pwa')));
+  }
   return app;
 }
diff --git a/apps/pwa/src/app/index.tsx b/apps/pwa/src/app/index.tsx
@@ -1,5 +1,6 @@
 import ErrorBoundary from '@/components/error_boundary';
 import { GlobalStyle } from '@/global_style';
+import { GlobalStyle as SelectGlobalStyle } from '@/components/select';
 import { ThemeProvider } from 'styled-components';
 import App from './app';
 import UncaughtError from './uncaught_error';
@@ -13,8 +14,9 @@ function Wrapper() {
     <ErrorBoundary fallback={fallback}>
       <ThemeProvider theme={theme.useState()}>
         <Head />
-        <GlobalStyle />
         <App />
+        <GlobalStyle />
+        <SelectGlobalStyle />
       </ThemeProvider>
     </ErrorBoundary>
   );

diff --git a/apps/pwa/src/components/button.tsx b/apps/pwa/src/components/button.tsx
@@ -87,7 +87,7 @@ const Style = styled.button<{
   padding: 0 15px;
 
   border-radius: ${CSSVariable.BORDER_RADIUS_NORMAL};
-  font-size: 14px;
+  font-size: ${CSSVariable.TEXT_SIZE_NORMAL};
   cursor: pointer;
   transition: all 300ms;
   user-select: none;

diff --git a/apps/pwa/src/components/cover/cover.tsx b/apps/pwa/src/components/cover/cover.tsx
@@ -65,12 +65,16 @@ function Cover({
   useLayoutEffect(() => {
     setCurrentSrc(DefaultCover);
 
-    const unobserve = intersectionObserver.observe(ref.current!, () =>
-      loadImage(src)
-        .then(() => setCurrentSrc(src))
-        .catch((error) => logger.error(error, `Failed to load cover "${src}"`)),
-    );
-    return unobserve;
+    if (src) {
+      const unobserve = intersectionObserver.observe(ref.current!, () =>
+        loadImage(src)
+          .then(() => setCurrentSrc(src))
+          .catch((error) =>
+            logger.error(error, `Failed to load cover "${src}"`),
+          ),
+      );
+      return unobserve;
+    }
   }, [src]);
 
   const transitions = useTransition(currentSrc, {

diff --git a/apps/pwa/src/components/dialog.tsx b/apps/pwa/src/components/dialog.tsx
@@ -131,7 +131,7 @@ export const Content = styled.div`
   flex: 1;
   min-height: 0;
 
-  font-size: 14px;
+  font-size: ${CSSVariable.TEXT_SIZE_NORMAL};
   color: ${CSSVariable.TEXT_COLOR_SECONDARY};
   line-height: 1.5;
   overflow: auto;

diff --git a/apps/pwa/src/components/empty.tsx b/apps/pwa/src/components/empty.tsx
@@ -17,7 +17,7 @@ const Style = styled.div`
   }
 
   > .description {
-    font-size: 12px;
+    font-size: ${CSSVariable.TEXT_SIZE_SMALL};
     color: ${CSSVariable.TEXT_COLOR_SECONDARY};
 
     ${capitalize}

diff --git a/apps/pwa/src/components/error_card.tsx b/apps/pwa/src/components/error_card.tsx
@@ -24,7 +24,7 @@ const Style = styled.div`
     max-width: 400px;
 
     white-space: pre-wrap;
-    font-size: 12px;
+    font-size: ${CSSVariable.TEXT_SIZE_SMALL};
     line-height: 1.5;
     text-align: center;
 

diff --git a/apps/pwa/src/components/file_select.tsx b/apps/pwa/src/components/file_select.tsx
@@ -7,10 +7,11 @@ import selectFile from '../utils/select_file';
 const Style = styled.div<{ disabled: boolean }>`
   padding: 10px 20px;
 
+  border-radius: ${CSSVariable.BORDER_RADIUS_NORMAL};
   border: 1px solid ${CSSVariable.COLOR_BORDER};
   cursor: pointer;
   text-align: center;
-  font-size: 12px;
+  font-size: ${CSSVariable.TEXT_SIZE_SMALL};
   transition: inherit;
   user-select: none;
   word-break: break-all;

diff --git a/apps/pwa/src/components/input.tsx b/apps/pwa/src/components/input.tsx
@@ -18,7 +18,7 @@ const Input = styled.input`
   border-radius: ${CSSVariable.BORDER_RADIUS_NORMAL};
   border: 1px solid ${CSSVariable.COLOR_BORDER};
   color: ${CSSVariable.TEXT_COLOR_PRIMARY};
-  font-size: 14px;
+  font-size: ${CSSVariable.TEXT_SIZE_NORMAL};
   outline: none;
   transition: inherit;
   -webkit-tap-highlight-color: transparent;

diff --git a/apps/pwa/src/components/label.tsx b/apps/pwa/src/components/label.tsx
@@ -22,7 +22,7 @@ const Style = styled.label`
       min-width: 0;
 
       color: ${CSSVariable.TEXT_COLOR_PRIMARY};
-      font-size: 12px;
+      font-size: ${CSSVariable.TEXT_SIZE_SMALL};
       transition: inherit;
       ${upperCaseFirstLetter}
     }

diff --git a/apps/pwa/src/components/menu_item.tsx b/apps/pwa/src/components/menu_item.tsx
@@ -17,7 +17,7 @@ const Style = styled.div<{ active: boolean }>`
   border-radius: ${CSSVariable.BORDER_RADIUS_NORMAL};
 
   > .label {
-    font-size: 14px;
+    font-size: ${CSSVariable.TEXT_SIZE_NORMAL};
     ${capitalize}
   }
 

diff --git a/apps/pwa/src/components/multiple_select/constants.ts b/apps/pwa/src/components/multiple_select/constants.ts
diff --git a/apps/pwa/src/components/multiple_select/index.tsx b/apps/pwa/src/components/multiple_select/index.tsx
diff --git a/apps/pwa/src/components/multiple_select/multiple_select.tsx b/apps/pwa/src/components/multiple_select/multiple_select.tsx