UI优化

src/pages/be-vip.vue

@@ -53,6 +53,7 @@ const onPay = async () => {
 
 <template>
   <Container title="会员说明">
+    <view>
       <view v-if="user.id" class="header">
         <view>
           <Avatar :src="user.avatar" :size="35" />
@@ -77,7 +78,10 @@ const onPay = async () => {
               一年的时间，足够您在对战的世界中尽情驰骋，不断挑战自我，创造属于自己的辉煌战绩。</text
             >
             <text
-            >VIP会员还将获得专属的客服支持。当您在游戏中遇到任何问题，无论是技术故障、规则疑问还是其他需要帮助的情况，都可以随时联系我们的VIP专属客服团队、他们将为您提供</text
+              >VIP会员还将获得专属的客服支持。当您在游戏中遇到任何问题，无论是技术故障、规则疑问还是其他需要帮助的情况，都可以随时联系我们的VIP专属客服团队。他们将为您提供24小时不间断的优质服务，以最快的速度为您解决问题，确保您的对战体验不受任何影响。</text
+            >
+            <text
+              >除了这些直接与对战相关的特权，VIP会员还将享受到一系列的福利。我们不定期为VIP会员举办专属的活动，如邀请知名对战选手进行线上交流、举办VIP会员专属的锦标赛等。在这些活动中，您不仅有机会与偶像近距离接触，还能与其他VIP会员交流心得，共同进步。同时，VIP会员在购买游戏内的道具、装备时，还将享受专属的折扣优惠。这些道具和装备能够帮助您在对战中更好地发挥自己的实力，提升您的对战体验。。</text
             >
           </view>
         </view>
@@ -109,6 +113,7 @@ const onPay = async () => {
           <Signin :onClose="() => (showModal = false)" />
         </SModal>
       </view>
+    </view>
   </Container>
 </template>
 
@@ -138,7 +143,7 @@ const onPay = async () => {
 .container {
   width: 100%;
   height: 100%;
-  background-color: #e4e4e4;
+  background-color: #f5f5f5;
   padding-top: 10px;
 }
 .content {
@@ -153,7 +158,6 @@ const onPay = async () => {
   width: 100%;
   display: flex;
   align-items: center;
-  font-weight: bold;
 }
 .title-bar > view:first-child {
   width: 5px;
@@ -169,7 +173,7 @@ const onPay = async () => {
 .content > view:nth-child(2) > text {
   display: block;
   margin-top: 10px;
-  color: #000;
+  color: #333;
 }
 .vip-items {
   width: 100%;

src/pages/friend-battle.vue

@@ -148,7 +148,6 @@ const onCreateRoom = async () => {
 .create-room > image:first-of-type {
   position: absolute;
   width: 100%;
-  border-radius: 50%;
 }
 .create-room > view {
   margin: 0 30px;
@@ -160,6 +159,7 @@ const onCreateRoom = async () => {
 .create-room > view > image:first-child {
   width: 18vw;
   transform: translateX(40%);
+  border-radius: 50%;
 }
 .create-room > view > image:nth-child(2) {
   width: 36vw;