UI更新

src/components/CreateRoom.vue

@@ -69,13 +69,19 @@ const setClipboardData = () => {
       >
         <text>乱斗模式（3-10人）</text>
       </view>
-      <view class="battle-btn battle-close">
+      <view
+        :class="{ 'battle-btn': true, 'battle-choosen': battleMode === 3 }"
+        @click="() => (battleMode = 3)"
+      >
         <text>对抗模式（2V2）</text>
-        <text>敬请期待</text>
+        <!-- <text>敬请期待</text> -->
       </view>
-      <view class="battle-btn battle-close">
+      <view
+        :class="{ 'battle-btn': true, 'battle-choosen': battleMode === 4 }"
+        @click="() => (battleMode = 4)"
+      >
         <text>对抗模式（3V3）</text>
-        <text>敬请期待</text>
+        <!-- <text>敬请期待</text> -->
       </view>
     </view>
     <SButton v-if="step === 1" :onClick="createRoom">下一步</SButton>
@@ -132,13 +138,13 @@ const setClipboardData = () => {
   border: 4rpx solid #fff3;
   border-color: #fed847;
 }
-.battle-close {
+/* .battle-close {
   background-color: #8889;
   color: #b3b3b3;
 }
 .battle-close > text:last-child {
   font-size: 12px;
-}
+} */
 .room-info {
   display: flex;
   flex-direction: column;
@@ -151,9 +157,6 @@ const setClipboardData = () => {
   color: #fff;
   margin-bottom: 20px;
 }
-.room-info > view:first-child > text:last-child {
-  /* color: #fed847; */
-}
 .room-info > text {
   color: #888686;
   font-size: 14px;