From d52c64d25ac5214efacd4f24465be01712a1341b Mon Sep 17 00:00:00 2001
From: heimoshuiyu <heimoshuiyu@gmail.com>
Date: Sat, 17 Dec 2022 15:54:04 +0800
Subject: [PATCH] Fix: web css modules tree shaking

---
 web/src/App.css   | 57 ------------------------------------------
 web/src/index.css | 63 +++++++++++++++++++++++++++++++++++++++++++----
 web/src/index.jsx |  2 +-
 3 files changed, 59 insertions(+), 63 deletions(-)

diff --git a/web/src/App.css b/web/src/App.css
index 7b8c7ea..fcf75fe 100644
--- a/web/src/App.css
+++ b/web/src/App.css
@@ -1,16 +1,3 @@
-html {
-  font-size: 1em;
-}
-body {
-  margin: auto;
-  padding-top: 1rem;
-  max-width: unset;
-  min-height: 100vh;
-}
-#root {
-  display: flex;
-  justify-content: center;
-}
 .base {
   display: grid;
   grid-row-gap: 1em;
@@ -48,54 +35,10 @@ body {
   color: rgb(229, 232, 245);
   padding: 1em;
 }
-a.unset {
-  color: unset;
-  text-decoration: unset;
-}
-a.active {
-  color: deeppink;
-  background-color: lightgray;
-  border-radius: 0.39em 0.39em 0 0;
-}
 .audio-player {
   height: 39px;
   width: 100%;
 }
-td.clickable {
-  cursor: pointer;
-}
-div.clickable {
-  cursor: pointer;
-}
-div.page {
-  display: flex;
-  flex-direction: column;
-  align-items: center;
-  justify-content: center;
-}
-div.search_toolbar {
-  display: flex;
-  flex-direction: row;
-  flex-wrap: wrap;
-  justify-content: flex-end;
-  width: 100%;
-}
-div.feedback {
-  display: flex;
-  flex-direction: row;
-  flex-wrap: wrap;
-}
-button.refresh {
-  width: 100%;
-}
-td,
-th {
-  padding-bottom: 0.5em;
-  padding-top: 0.5em;
-}
-dialog {
-  border: solid;
-}
 .player-options {
   display: flex;
 }
diff --git a/web/src/index.css b/web/src/index.css
index ec2585e..c605177 100644
--- a/web/src/index.css
+++ b/web/src/index.css
@@ -1,13 +1,66 @@
+#root {
+  display: flex;
+  justify-content: center;
+}
+html {
+  font-size: 1em;
+}
 body {
-  margin: 0;
-  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 'Oxygen',
-    'Ubuntu', 'Cantarell', 'Fira Sans', 'Droid Sans', 'Helvetica Neue',
+  margin: auto;
+  padding-top: 1rem;
+  max-width: none;
+  min-height: 100vh;
+  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen",
+    "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue",
     sans-serif;
   -webkit-font-smoothing: antialiased;
   -moz-osx-font-smoothing: grayscale;
 }
-
 code {
-  font-family: source-code-pro, Menlo, Monaco, Consolas, 'Courier New',
+  font-family: source-code-pro, Menlo, Monaco, Consolas, "Courier New",
     monospace;
 }
+a.unset {
+  color: unset;
+  text-decoration: unset;
+}
+a.active {
+  color: deeppink;
+  background-color: lightgray;
+  border-radius: 0.39em 0.39em 0 0;
+}
+td.clickable {
+  cursor: pointer;
+}
+div.clickable {
+  cursor: pointer;
+}
+div.page {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  justify-content: center;
+}
+div.search_toolbar {
+  display: flex;
+  flex-direction: row;
+  flex-wrap: wrap;
+  justify-content: flex-end;
+  width: 100%;
+}
+div.feedback {
+  display: flex;
+  flex-direction: row;
+  flex-wrap: wrap;
+}
+button.refresh {
+  width: 100%;
+}
+td,
+th {
+  padding-bottom: 0.5em;
+  padding-top: 0.5em;
+}
+dialog {
+  border: solid;
+}
diff --git a/web/src/index.jsx b/web/src/index.jsx
index 3e332ba..bc162c0 100644
--- a/web/src/index.jsx
+++ b/web/src/index.jsx
@@ -1,7 +1,7 @@
 import React from 'react';
 import ReactDOM from 'react-dom';
-import './index.css';
 import 'water.css';
+import './index.css';
 import App from './App';
 
 ReactDOM.render(