Переглянути джерело

style: 退出登录改为与菜单行同构样式

skyline 3 тижнів тому
батько
коміт
d9f71a4637
1 змінених файлів з 22 додано та 5 видалено
  1. 22 5
      charge-front/src/pages/user/user.vue

+ 22 - 5
charge-front/src/pages/user/user.vue

@@ -75,7 +75,17 @@
         hover-stay-time="80"
         @click="logout"
       >
-        <view class="fs-28">退出登录</view>
+        <view class="menu-icon">
+          <uni-icons type="redo" size="26" color="#f43636"></uni-icons>
+        </view>
+        <view class="fs-28" style="color: #f43636">退出登录</view>
+        <view class="ml-auto">
+          <uni-icons
+            type="right"
+            size="12"
+            color="rgba(28,43,41,0.3)"
+          ></uni-icons>
+        </view>
       </view>
 
       <view style="height: 40rpx"></view>
@@ -360,17 +370,24 @@ page {
   }
 }
 
+/* 退出登录:与菜单行同构,红色区分语义 */
 .logout-card {
   margin-top: 20rpx;
   background: #ffffff;
   border-radius: 20rpx;
-  height: 104rpx;
+  height: 112rpx;
+  padding: 0 30rpx;
   display: flex;
   align-items: center;
-  justify-content: center;
 
-  view {
-    color: #f43636;
+  .menu-icon {
+    width: 52rpx;
+    height: 52rpx;
+    margin-right: 24rpx;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    flex-shrink: 0;
   }
 }