feat: 前端样式调整

web/src/views/Keys.vue

@@ -55,7 +55,7 @@ function handleGroupRefresh() {
       <!-- 右侧主内容区域，占80% -->
       <div class="main-content">
         <!-- 分组信息卡片，更紧凑 -->
-        <div v-if="selectedGroup" class="group-info">
+        <div class="group-info">
           <group-info-card :group="selectedGroup" @refresh="handleGroupRefresh" />
         </div>
 
@@ -69,15 +69,6 @@ function handleGroupRefresh() {
 </template>
 
 <style scoped>
-.keys-container {
-  /* padding: 12px 0; */
-  /* max-width: 1600px; */
-  /* margin: 0 auto; */
-  height: 100%;
-  display: flex;
-  flex-direction: column;
-}
-
 .page-header {
   margin-bottom: 12px;
   padding-bottom: 6px;
@@ -101,6 +92,7 @@ function handleGroupRefresh() {
 .sidebar {
   width: 240px;
   flex-shrink: 0;
+  height: calc(100vh - 88px);
 }
 
 .main-content {

web/src/views/Settings.vue

@@ -43,14 +43,14 @@ async function handleSubmit() {
 
 <template>
   <div class="settings-container">
-    <!-- <div class="settings-header">
-      <h2 class="settings-title">系统设置</h2>
-      <p class="settings-subtitle">配置系统参数和选项</p>
-    </div> -->
-
     <div class="settings-content">
       <n-form ref="formRef" :model="form" label-placement="top" class="settings-form">
-        <div v-for="(category, cIndex) in settingList" :key="cIndex" class="settings-category">
+        <div
+          v-for="(category, cIndex) in settingList"
+          :key="cIndex"
+          class="settings-category"
+          :style="{ animationDelay: `${cIndex * 0.05}s` }"
+        >
           <n-card class="category-card modern-card" :bordered="false" size="small">
             <template #header>
               <div class="category-header">
@@ -134,11 +134,6 @@ async function handleSubmit() {
 </template>
 
 <style scoped>
-/* .settings-container {
-  max-width: 1000px;
-  margin: 0 auto;
-} */
-
 .settings-header {
   margin-bottom: 32px;
   text-align: center;
@@ -173,18 +168,6 @@ async function handleSubmit() {
   margin-bottom: 12px;
 }
 
-.settings-category:nth-child(2) {
-  animation-delay: 0.07s;
-}
-
-.settings-category:nth-child(3) {
-  animation-delay: 0.14s;
-}
-
-.settings-category:nth-child(4) {
-  animation-delay: 0.21s;
-}
-
 .category-card {
   background: rgba(255, 255, 255, 0.98);
 }