update css

src/styles/_join-room.css

-body {
-  margin: 0;
-  justify-content: center;
-}
-
-.login_div {
-  margin: auto;
-  padding: 10%;
-}
-
-.login_p {
-  text-align: center;
-}

src/styles/_mora.css → src/styles/_mora.scss

-.container {
+.mora_container {
   display: flex;
   margin: auto;
   padding: 0;

src/styles/_wait-room.css → src/styles/_wait-room.scss

-.container {
+.wait_container {
   display: flex;
   margin: auto;
   padding: 0;

src/styles/core.scss

+// ref: https://github.com/jvcjunior/login-react-redux
+// thanks!
 @charset "utf-8";
 
 html, body, div, span, applet, object, iframe,
@@ -46,13 +48,13 @@ table {
 
 
 @import 
+url("https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.2.1/css/all.min.css"),
 "commom",
-// "alerts",
 "header",
 "login-form",
 "sign-in",
-url("https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.2.1/css/all.min.css");
-// "loading";
+"wait-room",
+"mora";
 
 
 * {

src/ui/Mora.tsx

@@ -18,6 +18,7 @@ import { store } from "../store";
 import { useEffect } from "react";
 import { useNavigate } from "react-router-dom";
 import { Button } from "antd";
+import "../styles/core.scss";
 
 // TODO: 应该展示聊天信息
 export default function Mora() {
@@ -59,7 +60,7 @@ export default function Mora() {
   };
 
   return (
-    <div className="container">
+    <div className="mora_container">
       <div className="item">
         <Button disabled={!selectHandAble} onClick={handleSelectScissors}>
           scissors

src/ui/WaitRoom.tsx

@@ -24,6 +24,7 @@ import sqliteMiddleWare, { sqliteCmd } from "../middleware/sqlite";
 import { Button } from "antd";
 import { store } from "../store";
 import { initMeExtraDeckMeta } from "../reducers/duel/extraDeckSlice";
+import "../styles/core.scss";
 
 const READY_STATE = "ready";
 
@@ -87,7 +88,7 @@ export default function WaitRoom() {
   };
 
   return (
-    <div className="container">
+    <div className="wait_container">
       <div className="playerRegion">
         <h2>{joined ? "Room Joined!" : "Room Not Joined."}</h2>
         <p>