调整通用样式

src/assets/common.css

@@ -1,3 +1,6 @@
+#app {
+    width: 100%;
+}
 
 @tailwind base;
 @tailwind components;
@@ -6,40 +9,41 @@
     font-family: Inter, system-ui, Avenir, Helvetica, Arial, sans-serif;
     line-height: 1.5;
     font-weight: 400;
-  
+
     color-scheme: light dark;
     color: rgba(255, 255, 255, 0.87);
     background-color: #242424;
-  
+
     font-synthesis: none;
     text-rendering: optimizeLegibility;
     -webkit-font-smoothing: antialiased;
     -moz-osx-font-smoothing: grayscale;
-  }
-  
-  a {
+}
+
+a {
     font-weight: 500;
     color: #646cff;
     text-decoration: inherit;
-  }
-  a:hover {
+}
+
+a:hover {
     color: #535bf2;
-  }
-  
-  body {
+}
+
+body {
     margin: 0;
     display: flex;
     place-items: center;
     min-width: 320px;
     min-height: 100vh;
-  }
-  
-  h1 {
+}
+
+h1 {
     font-size: 3.2em;
     line-height: 1.1;
-  }
-  
-  button {
+}
+
+button {
     border-radius: 8px;
     border: 1px solid transparent;
     padding: 0.6em 1.2em;
@@ -49,30 +53,34 @@
     background-color: #1a1a1a;
     cursor: pointer;
     transition: border-color 0.25s;
-  }
-  button:hover {
+}
+
+button:hover {
     border-color: #646cff;
-  }
-  button:focus,
-  button:focus-visible {
+}
+
+button:focus,
+button:focus-visible {
     outline: 4px auto -webkit-focus-ring-color;
-  }
-  
-  .card {
+}
+
+.card {
     padding: 2em;
-  }
-  
-  
-  @media (prefers-color-scheme: light) {
+}
+
+
+@media (prefers-color-scheme: light) {
     :root {
-      color: #213547;
-      background-color: #ffffff;
+        color: #213547;
+        background-color: #ffffff;
     }
+
     a:hover {
-      color: #747bff;
+        color: #747bff;
     }
+
     button {
-      background-color: #f9f9f9;
+        background-color: #f9f9f9;
     }
-  }
+}