添加个人联系页面

src/pages/first-try.vue

@@ -23,10 +23,11 @@ import Guide from "@/components/Guide.vue";
 }
 .start-btn {
   margin: 0 10px;
+  padding: 15px 0;
+  font-weight: bold;
   width: calc(100% - 20px);
   background-color: #fed847;
   font-size: 15px;
-  padding: 3px;
   border-radius: 10px;
 }
 </style>

src/pages/friend-battle.vue

@@ -61,10 +61,12 @@ import Guide from "@/components/Guide.vue";
   width: 70%;
   text-align: center;
   font-size: 14px;
+  height: 40px;
 }
 .founded-room > view > button {
   background-color: #fed847;
   width: 30%;
+  line-height: 40px;
   border-radius: 30px;
   font-size: 14px;
   padding: 3px 0;
@@ -84,7 +86,6 @@ import Guide from "@/components/Guide.vue";
   position: relative;
   display: flex;
   flex-direction: column;
-  justify-content: center;
 }
 .create-room > view > image:first-child {
   width: 18vw;
@@ -110,8 +111,10 @@ import Guide from "@/components/Guide.vue";
 .create-room > button {
   background-color: #fed847;
   border-radius: 30px;
+  margin: 0 auto;
   width: 70%;
   font-size: 15px;
   transform: translateY(-110%);
+  padding: 15px 0;
 }
 </style>

src/pages/index.vue

@@ -26,6 +26,12 @@ const toFriendBattlePage = () => {
     url: "/pages/friend-battle",
   });
 };
+
+const toPractisePage = () => {
+  uni.navigateTo({
+    url: "/pages/practise",
+  });
+};
 </script>
 
 <template>
@@ -48,7 +54,7 @@ const toFriendBattlePage = () => {
         </view>
 
         <!-- 个人练习区域 -->
-        <view class="practice-card">
+        <view class="practice-card" @click="toPractisePage">
           <image src="../static/a2@2x(1).png" mode="widthFix" />
         </view>
 

src/pages/practise.vue

@@ -0,0 +1,31 @@
+<script setup>
+import AppBackground from "@/components/AppBackground.vue";
+import Header from "@/components/Header.vue";
+import Guide from "@/components/Guide.vue";
+</script>
+
+<template>
+  <view>
+    <AppBackground />
+    <Header title="个人练习" />
+    <Guide
+      title="师傅领进门，修行靠自身，赶紧练起来吧。坚持练习就能你快速升级，早日加入全国排位赛！"
+    />
+    <button class="practise1">
+      <image src="../static/practise1.png" class="practise1" mode="widthFix" />
+    </button>
+    <button class="practise2">
+      <image src="../static/practise2.png" class="practise2" mode="widthFix" />
+    </button>
+  </view>
+</template>
+
+<style scoped>
+.practise1 {
+  width: 100%;
+  margin: 20px 0;
+}
+.practise2 {
+  width: 100%;
+}
+</style>

src/pages/user.vue

@@ -44,17 +44,6 @@ import UserItem from "@/components/UserItem.vue";
 }
 .my-grow {
   width: 100%;
-  margin: 0;
-  padding: 0;
-  background-color: none;
-  border: none;
-  background: none;
-  line-height: 1;
-  outline: none;
-  box-sizing: border-box;
-}
-.my-grow::after {
-  border: none;
 }
 .my-grow > image {
   width: 100%;