refactor(web): 重构App.vue为纯路由出口

apps/web/src/App.vue

@@ -1,60 +1,12 @@
 <template>
   <div id="app">
-    <el-container style="height: 100vh">
+    <router-view />
-      <el-header class="header">
-        <div class="header-content">
-          <h1 class="title">🎯 视频模型检测平台</h1>
-          <div class="header-info">
-            <el-tag type="success">运行中</el-tag>
-          </div>
-        </div>
-      </el-header>
-      
-      <el-container>
-        <router-view />
-      </el-container>
-    </el-container>
   </div>
 </template>
 
 <script setup>
 </script>
 
-<style scoped>
-.header {
-  background: linear-gradient(135deg, #0F172A 0%, #1E293B 100%);
-  color: #F8FAFC;
-  padding: 0 20px;
-  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.3);
-  border-bottom: 1px solid rgba(255, 255, 255, 0.1);
-}
-
-.header-content {
-  display: flex;
-  justify-content: space-between;
-  align-items: center;
-  height: 60px;
-}
-
-.title {
-  font-size: 24px;
-  margin: 0;
-  font-weight: 600;
-  font-family: 'Fira Code', monospace;
-  letter-spacing: -0.5px;
-  background: linear-gradient(135deg, #22C55E 0%, #16A34A 100%);
-  -webkit-background-clip: text;
-  -webkit-text-fill-color: transparent;
-  background-clip: text;
-}
-
-.header-info {
-  display: flex;
-  gap: 12px;
-  align-items: center;
-}
-</style>
-
 <style>
 @import url('https://fonts.googleapis.com/css2?family=Fira+Code:wght@400;500;600;700&family=Fira+Sans:wght@300;400;500;600;700&display=swap');
 
@@ -66,18 +18,18 @@
 
 body {
   font-family: 'Fira Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
-  background: #0F172A;
+  background: #020617;
   color: #F8FAFC;
 }
 
 #app {
   width: 100%;
-  height: 100%;
+  height: 100vh;
 }
 
 .el-main {
-  background: #0F172A;
+  background: #020617;
-  padding: 20px;
+  padding: 0;
 }
 
 ::selection {
@@ -97,9 +49,28 @@ body {
 ::-webkit-scrollbar-thumb {
   background: #334155;
   border-radius: 5px;
+  transition: background 200ms ease;
 }
 
 ::-webkit-scrollbar-thumb:hover {
   background: #475569;
 }
-</style>
+
+/* 全局 cursor pointer */
+button,
+[role="button"],
+.el-button,
+.el-menu-item,
+.el-tag,
+.el-pagination li {
+  cursor: pointer;
+}
+
+/* Reduced motion */
+@media (prefers-reduced-motion: reduce) {
+  *, *::before, *::after {
+    animation-duration: 0.01ms !important;
+    transition-duration: 0.01ms !important;
+  }
+}
+</style>