重构

apps/admin/src/views/Matches.vue

@@ -408,6 +408,11 @@ function onLeagueArchived() {
           </el-button>
         </div>
       </div>
+      <div class="list-chrome__actions">
+        <el-button type="primary" @click.stop="openCreateLeague">
+          {{ t('match.create_btn') }}
+        </el-button>
+      </div>
     </div>
     <p v-if="filterStatus" class="list-hint">{{ t('match.filter.status_hint') }}</p>
   </div>
@@ -489,9 +494,6 @@ function onLeagueArchived() {
         <template #header>
           <div class="actions-col-header">
             <span class="actions-col-header__label">{{ t('common.actions') }}</span>
-            <el-button type="primary" size="small" @click.stop="openCreateLeague">
-              {{ t('match.create_btn') }}
-            </el-button>
           </div>
         </template>
         <template #default="{ row }">
@@ -596,6 +598,7 @@ function onLeagueArchived() {
           :placeholder="t('matchEditor.ph.kickoff')"
           style="width: 100%"
         />
+        <p class="field-hint schedule-timezone-hint">{{ t('match.timezone.platform_hint') }}</p>
       </el-form-item>
       <div class="teams-row">
         <!-- Home Team Column -->
@@ -686,19 +689,24 @@ function onLeagueArchived() {
 
 .team-col-title {
   font-size: 14px;
-  font-weight: 600;
-  color: #bbb;
+  font-weight: 750;
+  color: var(--text);
   margin-bottom: 10px;
   padding-bottom: 6px;
-  border-bottom: 1px solid #2a2a2a;
+  border-bottom: 1px solid var(--border-soft);
 }
 
 .field-hint {
   font-size: 12px;
-  color: #666;
+  color: var(--text-muted);
   margin: 0;
   line-height: 1.5;
 }
+
+.schedule-timezone-hint {
+  margin-top: 4px;
+}
+
 .edit-hint {
   margin-bottom: 16px;
 }
@@ -714,7 +722,7 @@ function onLeagueArchived() {
 
 .matches-page :deep(.el-table__expanded-cell) {
   padding: 0 !important;
-  background: #0a0a0a;
+  background: #fbfaf7;
 }
 
 .list-panel :deep(.row-expandable) {
@@ -734,7 +742,7 @@ function onLeagueArchived() {
   font-weight: 600;
 }
 .bet-stat-zero {
-  color: #555;
+  color: #aaa49a;
 }
 
 .league-cell {
@@ -751,13 +759,13 @@ function onLeagueArchived() {
 }
 
 .league-en {
-  color: #aaa;
+  color: var(--text-muted);
   font-size: 13px;
 }
 
 .league-readonly {
-  color: var(--green-text);
-  font-weight: 500;
+  color: var(--success-text);
+  font-weight: 700;
 }
 
 .actions-col-header {
@@ -773,8 +781,8 @@ function onLeagueArchived() {
 
 .actions-col-header__label {
   font-size: 12px;
-  font-weight: 600;
-  color: #aaa;
+  font-weight: 700;
+  color: var(--text-muted);
   line-height: 1;
 }
 
@@ -811,8 +819,8 @@ function onLeagueArchived() {
   gap: 4px;
   padding: 2px 4px;
   border-radius: 8px;
-  background: rgba(255, 255, 255, 0.02);
-  border: 1px solid rgba(255, 255, 255, 0.05);
+  background: #fbfaf7;
+  border: 1px solid var(--border-soft);
 }
 
 .league-row-actions :deep(.el-button) {
@@ -836,4 +844,50 @@ function onLeagueArchived() {
   width: 100%;
 }
 
+.list-chrome__actions {
+  display: flex;
+  align-items: center;
+  justify-content: flex-end;
+  gap: 8px;
+  flex-shrink: 0;
+}
+
+.team-col {
+  padding: 12px;
+  border: 1px solid var(--border-soft);
+  border-radius: 8px;
+  background: #fbfaf7;
+}
+
+.matchup-link,
+.bet-stat-active {
+  color: var(--primary-link);
+}
+
+.league-row-actions :deep(.el-button) {
+  min-height: 26px;
+  font-weight: 700;
+}
+
+@media (max-width: 760px) {
+  .list-chrome__actions {
+    width: 100%;
+    justify-content: flex-start;
+  }
+
+  .teams-row {
+    grid-template-columns: 1fr;
+    gap: 12px;
+  }
+
+  .actions-col-header {
+    flex-wrap: wrap;
+    justify-content: flex-start;
+  }
+
+  .league-row-actions {
+    justify-content: flex-start;
+  }
+}
+
 </style>