feat: small

src/styles/antd.scss

@@ -2,6 +2,7 @@
 .ant-btn {
   display: flex;
   align-items: center;
+  justify-content: center;
 }
 
 // 点击按钮产生的波浪扩散效果

src/styles/core.scss

 @charset "utf-8";
-@import url("https://fonts.googleapis.com/css2?family=Electrolize&display=swap");
+@import url("https://fonts.font.im/css2?family=Electrolize&display=swap");
 @import "./antd.scss";
 
 body {
@@ -29,6 +29,7 @@ body {
 img {
   user-select: none;
   -webkit-user-drag: none;
+  display: block; // 取消默认的4px下边距
 }
 
 * {

src/ui/BuildDeck/DeckSelect.module.scss

@@ -45,20 +45,17 @@
   }
 }
 
-.btn-add-container {
+.btn-add {
   position: absolute;
   bottom: 40px;
-  width: 100%;
-  display: flex;
-  justify-content: center;
-  .btn-add {
-    background-color: rgba(0, 168, 202, 0.451);
-
-    box-shadow: 0 0 20px 0 rgba(0, 221, 255, 0.5);
-    &:hover {
-      background-color: rgba(0, 168, 202, 0.451) !important;
-      transform: scale(1.1);
-      filter: brightness(1.2);
-    }
+  left: 0;
+  right: 0;
+  margin: auto;
+  background-color: rgba(0, 168, 202, 0.451);
+  box-shadow: 0 0 20px 0 rgba(0, 221, 255, 0.5);
+  &:hover {
+    background-color: rgba(0, 168, 202, 0.451) !important;
+    transform: scale(1.1);
+    filter: brightness(1.2);
   }
 }

src/ui/BuildDeck/DeckSelect.tsx

@@ -40,16 +40,14 @@ export const DeckSelect: React.FC<{
           </div>
         ))}
       </div>
-      <div className={styles["btn-add-container"]}>
-        <Button
-          className={styles["btn-add"]}
-          icon={<PlusOutlined />}
-          shape="circle"
-          type="text"
-          onClick={onAdd}
-          size="large"
-        />
-      </div>
+      <Button
+        className={styles["btn-add"]}
+        icon={<PlusOutlined />}
+        shape="circle"
+        type="text"
+        onClick={onAdd}
+        size="large"
+      />
     </>
   );
 };

src/ui/Layout/index.module.scss

@@ -7,15 +7,18 @@
   padding: 0 2rem;
   gap: 1.5rem;
   box-sizing: border-box;
-  .logo {
-    width: 60px;
-    filter: brightness(1.5);
-    transform: translateY(1px);
+  .logo-container {
+    align-items: center;
+    height: min-content;
+    .logo {
+      width: 60px;
+      filter: brightness(1.5);
+      transform: translateY(1px);
+    }
   }
+
   a {
     color: white;
-    font-family: sans-serif;
-    text-decoration: none;
     font-size: 0.825rem;
     line-height: var(--header-height);
     transition: 0.3s;

src/ui/Layout/index.tsx

@@ -20,12 +20,18 @@ export const Component = () => {
   return (
     <>
       <nav className={styles.navbar}>
-        <img
+        <div className={styles["logo-container"]}>
+          <img
+            className={styles.logo}
+            src={`${NeosConfig.assetsPath}/neos-logo.svg`}
+            alt="NEOS"
+          />
+        </div>
+        {/* <img
           className={styles.logo}
           src={`${NeosConfig.assetsPath}/neos-logo.svg`}
           alt="NEOS"
-        />
-
+        /> */}
         <NavLink to="/">主页</NavLink>
         <NavLink to="/match">匹配</NavLink>
         <NavLink to="/build">组卡</NavLink>

src/ui/NewWaitRoom/index.tsx

@@ -103,32 +103,27 @@ const MoraButton: React.FC<{
 }> = () => {
   // TODO: 实现这个onclick
   // 防抖
+
+  const map = {
+    [Mora.Rock]: "石头",
+    [Mora.Scissors]: "剪刀",
+    [Mora.Paper]: "布",
+  };
+
   return (
     <Popover
       overlayStyle={{ backdropFilter: "blur(10px)" }}
       content={
         <Space>
-          <Button
-            size="large"
-            type="text"
-            icon={<IconFont type="icon-hand-rock" size={16} />}
-          >
-            石头
-          </Button>
-          <Button
-            size="large"
-            type="text"
-            icon={<IconFont type="icon-hand-scissors" size={16} />}
-          >
-            剪刀
-          </Button>
-          <Button
-            size="large"
-            type="text"
-            icon={<IconFont type="icon-hand-paper" size={16} />}
-          >
-            布
-          </Button>
+          {[Mora.Rock, Mora.Scissors, Mora.Paper].map((mora) => (
+            <Button
+              size="large"
+              type="text"
+              icon={<IconFont type={`icon-hand-${mora}`} size={16} />}
+            >
+              {map[mora]}
+            </Button>
+          ))}
         </Space>
       }
       trigger="focus"