样式调整

Web/src/views/ClassificationEdit.vue

@@ -52,18 +52,18 @@
           </template>
         </van-swipe-cell>
       </van-cell-group>
+    </div>
 
+    <div class="action-bar">
       <!-- 新增分类按钮 -->
-      <div class="add-button-container">
-        <van-button 
-          type="primary" 
-          size="large" 
-          block 
-          @click="handleAddCategory"
-        >
-          新增分类
-        </van-button>
-      </div>
+      <van-button 
+        type="primary" 
+        size="large" 
+        block 
+        @click="handleAddCategory"
+      >
+        新增分类
+      </van-button>
     </div>
 
     <!-- 新增分类对话框 -->
@@ -307,12 +307,11 @@ onMounted(() => {
 
 <style scoped>
 .level-container {
-  padding-top: 16px;
   min-height: calc(100vh - 50px);
+  margin-top: 16px;
 }
 
 .breadcrumb {
-  margin-bottom: 16px;
   padding: 8px 0;
 }
 
@@ -320,15 +319,6 @@ onMounted(() => {
   cursor: pointer;
 }
 
-/* 新增按钮 */
-.add-button-container {
-  position: fixed;
-  bottom: calc(60px + env(safe-area-inset-bottom, 0px));
-  left: 16px;
-  right: 16px;
-  z-index: 10;
-}
-
 /* 深色模式 */
 @media (prefers-color-scheme: dark) {
   .level-container {
@@ -336,6 +326,27 @@ onMounted(() => {
   }
 }
 
+/* 底部操作栏 */
+.action-bar {
+  position: fixed;
+  bottom: 0;
+  left: 0;
+  right: 0;
+  display: flex;
+  gap: 12px;
+  padding: 12px;
+  background-color: var(--van-background-2, #fff);
+  box-shadow: 0 -2px 8px rgba(0, 0, 0, 0.08);
+  z-index: 100;
+}
+
+@media (prefers-color-scheme: dark) {
+  .action-bar {
+    background-color: var(--van-background-2, #2c2c2c);
+    box-shadow: 0 -2px 8px rgba(0, 0, 0, 0.3);
+  }
+}
+
 /* 设置页面容器背景色 */
 :deep(.van-nav-bar) {
   background: transparent !important;