feat ui设计稿

src/views/profile/index.vue

@@ -21,10 +21,9 @@ onMounted(() => {
 <template>
   <div class="profile">
     <div class="profile__container">
-      <ProfileUserCard :profile="profile" @save-nickname="onSaveNickname" />
-
       <div class="profile__body">
         <aside class="profile__aside">
+          <ProfileUserCard :profile="profile" @save-nickname="onSaveNickname" />
           <ProfileSider />
         </aside>
         <main class="profile__main">
@@ -44,30 +43,32 @@ onMounted(() => {
     width: @container-width;
     max-width: calc(100% - @spacing-xl);
     margin: 0 auto;
-    padding-top: @spacing-xl;
+    padding-top: @spacing-lg;
   }
 
   &__body {
     .flex(row, flex-start);
     gap: @spacing-base;
-    margin-top: @spacing-base;
     align-items: flex-start;
   }
 
+  // 左列（设计14）：紫渐变用户卡 + 菜单，直接坐在页面底色上，无外层白卡
   &__aside {
-    width: 220px;
+    width: 114px; // 设计 148 × 0.77
     flex-shrink: 0;
-    border-radius: @radius-lg;
-    background: @white;
-    box-shadow: @shadow-base;
-    overflow: hidden;
-  }
-
-  &__main {
-    flex: 1;
-    min-width: 0;
     .flex(column, flex-start);
     gap: @spacing-base;
   }
+
+  // 右侧内容面板（设计14/28）：整块白卡，内缩 16px 承载各页面
+  &__main {
+    flex: 1;
+    min-width: 0;
+    min-height: 400px;
+    padding: @spacing-base;
+    border-radius: @radius-base;
+    background: @white;
+    box-shadow: @shadow-base;
+  }
 }
 </style>