style: 统一了导入组件和默认view的样式

Author: FreecellRaid

src/assets/styles/style.css

@@ -90,6 +90,17 @@ body,
     stroke-width: 1.9;
 }
 
+/* 背景icon样式 */
+.bg-icon {
+    width: 64px;
+    height: 64px;
+    display: block;
+    color: var(--icon-color);
+    opacity: 0.6;
+    flex-shrink: 0;
+    stroke-width: 1.9;
+}
+
 .icon-interactive {
     color: var(--icon-color);
     background: transparent;

src/components/common/FileImporter.vue

@@ -1,21 +1,17 @@
 <template>
     <div
         class="file-importer"
+        @click="triggerFileInput"
         @dragover.prevent="isDragging = true"
         @dragleave.prevent="isDragging = false"
         @drop.prevent="handleDrop"
         :class="{ 'is-dragging': isDragging }"
     >
         <div class="drop-zone">
-            <div class="icon-container">
-                <FolderOpen class="ui-icon icon" />
-            </div>
+            <FolderOpen class="bg-icon" />
             <h2 class="title">导入跑团 Log</h2>
-            <p class="subtitle">将文件拖拽到此处，或点击</p>
+            <p class="subtitle">将文件拖拽到此处， 或点击任意处导入文件</p>
 
-            <button class="browse-btn" @click="triggerFileInput">
-                导入文件
-            </button>
             <input
                 type="file"
                 ref="fileInput"
@@ -86,13 +82,10 @@ async function processFiles(files: File[]) {
 
 <style scoped>
 .file-importer {
-    height: 100%;
+    flex: 1;
     display: flex;
     align-items: center;
     justify-content: center;
-    background-color: var(--bg-workspace);
-    color: var(--text-primary);
-    transition: all 0.2s ease;
 }
 
 .file-importer.is-dragging {
@@ -101,45 +94,29 @@ async function processFiles(files: File[]) {
 }
 
 .drop-zone {
+    display: flex;
+    flex-direction: column;
+    align-items: center;
     text-align: center;
     max-width: 400px;
 }
 
-.icon-container .icon {
-    width: 64px;
-    height: 64px;
-    opacity: 0.6;
-    color: var(--icon-color);
-}
-
 .title {
-    font-size: 20px;
-    margin: 16px 0 8px;
-    color: var(--text-primary);
+    font-size: 24px;
+    font-weight: 600;
+    color: var(--active-accent);
+    opacity: 0.8;
 }
 
 .subtitle {
     font-size: 14px;
     color: var(--text-muted);
-    margin-bottom: 24px;
-}
-
-.browse-btn {
-    background-color: var(--active-accent);
-    color: var(--bg-workspace);
-    border: none;
-    padding: 8px 24px;
-    border-radius: 4px;
-    cursor: pointer;
-}
-
-.browse-btn:hover {
-    opacity: 0.9;
 }
 
 .shortcuts-hint {
-    margin-top: 32px;
+    margin-top: 24px;
     font-size: 12px;
+    min-width: 200px;
     color: var(--text-muted);
 }
 

src/components/workspace/DefaultView.vue

@@ -14,22 +14,20 @@
 
         <div class="welcome-content">
             <div class="welcome-container">
-                <div class="icon-container">
-                    <Dices class="ui-icon icon" />
-                </div>
-
-                <p class="kaomoji-egg">
+                <Dices class="bg-icon" />
+                <p class="kaomoji">
                     {{ currentKaomoji.text }}
                 </p>
+                <p class="subtitle">从左侧场景列表中选择一个以开始编辑</p>
 
                 <div class="foot-hint">
                     <div class="foot-hint-item">
-                        <span>Ctrl + K 查看帮助文档</span>
+                        <span>切换侧边栏</span>
+                        <span>Ctrl + B</span>
                     </div>
                     <div class="foot-hint-item">
-                        当前没有处于活跃状态的场景。
-                        <br />
-                        从左侧场景列表中选择一个以开始编辑。
+                        <span>打开帮助文档</span>
+                        <span>Ctrl + K</span>
                     </div>
                 </div>
             </div>
@@ -81,33 +79,32 @@ onMounted(() => {
     display: flex;
     flex-direction: column;
     align-items: center;
-    max-width: 400px;
     text-align: center;
+    max-width: 400px;
 }
 
-.icon-container .icon {
-    width: 64px;
-    height: 64px;
-    opacity: 0.6;
-    color: var(--icon-color);
-}
-
-.kaomoji-egg {
+.kaomoji {
     font-size: 24px;
-    font-weight: normal;
+    font-weight: 600;
     color: var(--active-accent);
     opacity: 0.8;
 }
 
+.subtitle {
+    font-size: 14px;
+    color: var(--text-muted);
+}
+
 .foot-hint {
     margin-top: 24px;
     font-size: 12px;
+    min-width: 200px;
     color: var(--text-muted);
 }
 
 .foot-hint-item {
     display: flex;
-    justify-content: center;
+    justify-content: space-between;
     margin: 4px 0;
     padding: 4px 8px;
     background-color: var(--bg-secondary);