style: vant图标px->rem

src/views/login/SignupPage.vue

@@ -1,14 +1,10 @@
 <template>
   <div class="login-page">
-    <!-- 主要内容区域 -->
     <div class="content">
-      <!-- 返回按钮 -->
       <div class="back-button" @click="goBack">
-        <!-- <van-icon name="arrow-left" size="3rem" /> -->
         <img src="@/assets/images/arrow_left.png" class="back-icon" />
       </div>
 
-      <!-- 标题区域 -->
       <div class="header">
         <div class="title">Sign up.</div>
         <p class="subtitle">Redefine the styling experience with AI.</p>
@@ -32,10 +28,8 @@
             />
           </div>
 
-          <!-- 登录按钮 -->
           <button type="button" class="login-button" @click="handleConfirm">Sign Up</button>
 
-          <!-- Google登录按钮 -->
           <div type="button" class="google-button" @click="handleSignupByGoogle">
             <img :src="google" class="google-icon" />
             Sign up with Google

src/views/stylist/customer.vue

@@ -2,7 +2,7 @@
   <div class="customer-container safe-area-top" :class="{ 'form-mode': pageMode === 'form' }">
     <template v-if="pageMode === 'entry'">
       <div class="setting flex flex-between">
-        <van-icon name="arrow-left" color="#fff" size="70" @click="handleBack" />
+        <van-icon name="arrow-left" color="#fff" @click="handleBack" />
         <SvgIcon name="setting" size="70" />
       </div>
       <div class="content flex flex-center flex-column">
@@ -13,7 +13,7 @@
     <template v-else>
       <div class="form-container">
         <div class="back-container flex flex-center" @click="handleChangeMode('entry')">
-          <van-icon name="arrow-left" color="#fff" size="50" />
+          <van-icon name="arrow-left" color="#fff"  />
         </div>
         <div class="text">
           <div class="form-title">Entry ID</div>
@@ -47,7 +47,7 @@
 <script setup lang="ts">
 import { ref, onMounted } from 'vue'
 import { useRouter } from 'vue-router'
-import { useGenerateStore,useUserInfoStore } from '@/stores'
+import { useGenerateStore, useUserInfoStore } from '@/stores'
 import { showToast } from 'vant'
 import { customerCheckin } from '@/api/workshop'
 
@@ -106,6 +106,7 @@ const handleConfirm = async () => {
   .setting {
     z-index: 1;
     padding: 3.17rem 4.9rem 0 8.4rem;
+    font-size: 7rem;
     .c-svg {
       width: initial;
     }
@@ -147,6 +148,7 @@ const handleConfirm = async () => {
       height: 7.3rem;
       border: 2px solid #fff;
       border-radius: 1.8rem;
+      font-size: 4.3rem;
       background: rgba(0, 0, 0, 0.2);
       backdrop-filter: blur(20px);
       -webkit-backdrop-filter: blur(20px);

src/views/stylist/dressfor.vue

@@ -2,7 +2,7 @@
   <div class="dressfor-container flex">
     <div class="content flex-1 flex flex-column">
       <div class="setting flex flex-between">
-        <van-icon name="arrow-left" color="#fff" size="70" @click="handleBack" />
+        <van-icon name="arrow-left" color="#fff" @click="handleBack" />
         <SvgIcon name="setting" size="70" />
       </div>
       <div class="text">What are you dressing for?</div>
@@ -37,6 +37,7 @@ const handleStart = () => {
   .content {
     .setting {
       padding: 0 4.9rem 0 8.4rem;
+      font-size: 7rem;
       .c-svg {
         width: initial;
       }

src/views/stylist/index.vue

@@ -9,7 +9,7 @@
 
       <div class="carousel-container" v-show="!showVideo">
         <div class="nav-arrow left" @click="handleChangeSwiper('prev')">
-          <van-icon name="arrow-left" color="#fff" size="40" />
+          <van-icon name="arrow-left" color="#fff" />
         </div>
 
         <van-swipe touchable ref="swiperRef" @change="handleChangeCurrent">
@@ -27,7 +27,7 @@
         </van-swipe>
 
         <div class="nav-arrow right" @click="handleChangeSwiper('next')">
-          <van-icon name="arrow" color="#fff" size="40" />
+          <van-icon name="arrow" color="#fff" />
         </div>
       </div>
     </div>
@@ -58,7 +58,6 @@ import { useUserInfoStore } from '@/stores'
 import male from '@/assets/images/male.png'
 import female from '@/assets/images/female.png'
 
-
 const router = useRouter()
 const userInfoStore = useUserInfoStore()
 // stylist数据
@@ -179,6 +178,7 @@ watch(showVideo, (newValue) => {
 }
 
 .nav-arrow {
+  font-size: 4rem;
   position: absolute;
   top: 50%;
   transform: translateY(-50%);
@@ -287,7 +287,7 @@ watch(showVideo, (newValue) => {
   font-family: 'satoshiRegular';
 }
 
-:deep(.van-overlay){
+:deep(.van-overlay) {
   background: transparent;
 }
 
@@ -324,14 +324,9 @@ watch(showVideo, (newValue) => {
         inset 0 0.2rem 0.4rem rgba(255, 255, 255, 0.15), inset 0 -0.2rem 0.4rem rgba(0, 0, 0, 0.4);
     }
 
-    &:active {
-      transform: translateY(0.1rem);
-      box-shadow: 0 0.4rem 0.8rem rgba(0, 0, 0, 0.3), inset 0 0.2rem 0.4rem rgba(0, 0, 0, 0.2);
-    }
-
     .close-icon {
       color: white;
-      font-size: 2.4rem;
+      font-size: 3.64rem;
       text-shadow: 0 0.2rem 0.4rem rgba(0, 0, 0, 0.5);
     }
   }