fix

src/pages/main.vue

@@ -41,28 +41,20 @@
 </script>
 <style scoped lang = 'scss'>
     @import '../style/transition.scss';
+    @import '../style/style.scss';
+
     #main_page {
-        background: linear-gradient(to right, rgb(255, 228, 230), white, white, white, rgb(204, 251, 241));
-        height: 100%;
-        min-height: 100vh;
-        width: 100%;
         .background {
             position: fixed;
-            background: linear-gradient(to right, rgb(134, 239, 172), rgb(59, 130, 246), rgb(147, 51, 234));
-            width: 100%;
-            height: 100vh;
             z-index: 100;
-            font-family: 'Courier New', monospace;
             display: flex;
             justify-content: center;
             align-items: center;
             margin: 0;
             .pic {
-                color: white;
                 white-space: pre;
                 line-height: 1;
                 letter-spacing: 0;
-                font-size: 12px;
             }
         }
         .Tabulator {

src/pages/tabulator.vue

@@ -113,7 +113,6 @@
                 <transition name = 'switch'>
                     <uni-list
                         v-show = 'search.result.total > 0 && page.menu'
-                        :class = "{ vertical : size.width <= size.height}"
                     >
                         <uni-list-item
                             id = 'list'
@@ -485,4 +484,5 @@
 <style scoped lang = 'scss'>
     @import '../style/page.scss';
     @import '../style/transition.scss';
+    @import '../style/style.scss';
 </style>
\ No newline at end of file

src/style/page.scss

@@ -4,6 +4,7 @@
         grid-template-columns: repeat(5, 1fr);
         grid-template-rows: 1fr;
         align-items: center;
+        z-index: 0;
         :deep(.uni-list) {
             :hover {
                 cursor: pointer;
@@ -12,7 +13,7 @@
     }
     #really {
         box-shadow: 2px 2px 10px rgba(0, 0, 0, 0.2);
-        background-color: white;
+        // background-color: white;
         position: fixed;
         width: 100%;
         z-index: 1;
@@ -70,20 +71,6 @@
         }
     }
 
-    button {
-        background-color: white;
-        color : #606266;
-        border-radius: 4px;
-        white-space: nowrap;
-        border: 0.02px solid #606266;
-        transition: all 0.3s ease;
-        &:hover {
-            color: #ecf5ff;
-            background-color: #ecf5ff;
-            border: 0.02px solid #409eff;
-        }
-    }
-
     .Pics {
         position: fixed;
         z-index: 2;
@@ -102,10 +89,4 @@
             }
         }
     }
-
-    .vertical {
-        :deep(.uni-list-item) {
-            background: linear-gradient(to right, rgb(255, 228, 230), white, white, white, rgb(204, 251, 241)) !important;
-        }
-    }
 }

src/style/style.scss

+.uni-list-item, .uni-list-chat, .uni-list {
+    background: none !important;
+}
+
+#really{
+    background: linear-gradient(to right, rgb(255, 228, 230), white, white, white, rgb(204, 251, 241));
+}
+
+#main_page {
+    background: linear-gradient(to right, rgb(255, 228, 230), white, white, white, rgb(204, 251, 241));
+    height: 100%;
+    min-height: 100vh;
+    width: 100%;
+    .background {
+        // background: linear-gradient(to right, rgb(134, 239, 172), rgb(59, 130, 246), rgb(147, 51, 234));
+        background: linear-gradient(to right, rgb(255, 228, 230), white, white, white, rgb(204, 251, 241));
+        width: 100%;
+        height: 100vh;
+        font-family: 'Courier New', monospace;
+        .pic {
+            color: rgb(0, 70, 28);
+            font-size: 12px;
+        }
+    }
+}
+
+#page {
+    button {
+        background-color: white;
+        border-radius: 4px;
+        white-space: nowrap;
+        border: 0.02px solid white;
+        transition: all 0.3s ease;
+        &:hover {
+            background-color: rgb(254, 245, 245);
+            border: 0.02px solid rgb(255, 228, 230);
+        }
+    }
+}

src/style/tournament.scss

@@ -50,6 +50,8 @@
             }
             #header {
                 min-width: 30%;
+                max-width: 30%;
+                text-overflow: ellipsis;
             }
             #body {
                 &:hover {