feat ui设计稿

src/views/profile/cpns/HotlinePanel.vue

@@ -22,42 +22,65 @@ const WORK_TIME = '工作日 8:00-12:00 14:00-18:00'
 </template>
 
 <style lang="less" scoped>
+// 设计 14（专属客服热线）：面板内整行浅蓝卡（#D6E4FB）、蓝色圆形图标、
+// 标题 19 设计px w700、号码 24 设计px 蓝色 w700、时间 12 设计px 灰
 .hotline-panel {
-  .flex(row, center);
-  padding: @spacing-xxl 0;
+  .flex(row, flex-start);
+  padding: 0;
 
   &__card {
-    .flex(column, center);
-    gap: @spacing-base;
-    width: 480px;
+    display: grid;
+    grid-template-columns: auto 1fr;
+    grid-template-areas:
+      'icon title'
+      'icon number'
+      'icon time';
+    column-gap: @spacing-base;
+    align-content: center;
+    width: 100%;
     max-width: 100%;
-    padding: @spacing-xxl @spacing-xl;
-    border-radius: @radius-lg;
-    background: @white;
-    box-shadow: @shadow-lg;
-    text-align: center;
+    padding: @spacing-lg;
+    border-radius: @radius-base;
+    background: @profile-hotline-bg;
+    text-align: left;
+    align-items: center;
   }
 
+  // 设计 14 实取：#024FFF 蓝色圆底（直径约 64 设计px）
   &__icon {
-    font-size: @font-size-xxl * 2;
+    .flex(row, center);
+    grid-area: icon;
+    flex-shrink: 0;
+    width: 49px;
+    height: 49px;
+    margin: 0;
+    border-radius: @radius-round;
+    background: @primary-strong;
+    font-size: @font-size-lg;
     line-height: 1;
   }
 
   &__title {
-    font-size: @font-size-xl;
-    font-weight: 600;
+    grid-area: title;
+    align-self: end;
+    font-size: 15px; // 设计 19 → 15
+    font-weight: 700;
     color: @heading-color;
   }
 
   &__number {
-    font-size: @font-size-xxl + @spacing-sm;
+    grid-area: number;
+    font-size: 18px; // 设计 24 → 18
     font-weight: 700;
-    color: @primary-color;
-    line-height: 1.2;
+    color: @primary-strong;
+    line-height: 1.3;
   }
 
   &__time {
-    font-size: @font-size-base;
+    grid-area: time;
+    align-self: start;
+    color: @text-color-secondary;
+    font-size: 11px; // 设计 12 → 11
   }
 }
 </style>