From daa8c1fb4ac02580cdc80d4969d0dea4b7b5eee7 Mon Sep 17 00:00:00 2001
From: liaoxinyu <liaoxinyu@xingtongworld.com>
Date: Tue, 23 Apr 2024 16:42:27 +0800
Subject: [PATCH] =?UTF-8?q?=E4=BF=AE=E6=94=B9=E6=8E=A8=E8=8D=90=E6=A0=B7?=
 =?UTF-8?q?=E5=BC=8F?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 pages/recommend/index.vue | 83 ++++++++++++++++++++++++++++++---------
 1 file changed, 64 insertions(+), 19 deletions(-)

diff --git a/pages/recommend/index.vue b/pages/recommend/index.vue
index 60ce7e6..b0a1d37 100644
--- a/pages/recommend/index.vue
+++ b/pages/recommend/index.vue
@@ -13,8 +13,11 @@
         <scroll-view class="cate-left" scroll-y="true">
           <view class="type-nav" :class="{ selected: curIndex == index }" v-for="(item, index) in menus" :key="index"
                 @click="handleSelectNav(index)">
-            <image class="cate-left-image" :src="'./static/tabbar/'+item.image"></image>
-            <text class="cate-left-text" :class="curIndex == index ? item.class : ''">{{ item.name }}</text>
+			<view>
+				<image class="cate-left-image" :src="'./static/tabbar/'+item.image"></image>
+				<view class="cate-left-text" :class="curIndex == index ? item.class : ''">{{ item.name }}</view>
+			</view>
+            <!-- <text class="cate-left-text" :class="curIndex == index ? item.class : ''">{{ item.name }}</text> -->
           </view>
         </scroll-view>
         <!-- 右侧 二级分类 -->
@@ -289,17 +292,59 @@ export default {
     }
   }
 
+  // 左侧一级分类
+  // .type-nav {
+  //   position: relative;
+  //   height: 180rpx;
+  //   z-index: 10;
+  //   font-size: 26rpx;
+  //   display: flex;
+  //   justify-content: center;
+  //   align-items: center;
+  //   font-weight: bold;
+
+  //   &.selected {
+  //     background: #fff;
+  //     color: #cec7bf;
+  //     border-right: none;
+  //     font-size: 28rpx;
+  //     font-weight: bold;
+  //   }
+
+  //   .cate-left-image{
+  //     position: absolute;
+  //     width: 50rpx;
+  //     height: 50rpx;
+  //     border-radius: 10rpx;
+  //     margin-bottom: 20rpx;
+  //   }
+  //   .cate-left-text{
+  //     position: absolute;
+  //     margin-top: 80rpx;
+  //   }
+  //   .selected-0 {
+  //     color: #d81e06;
+  //   }
+  //   .selected-1 {
+  //     color: #d4237a;
+  //   }
+  //   .selected-2 {
+  //     color: #13227a;
+  //   }
+  // }
+  
   // 左侧一级分类
   .type-nav {
-    position: relative;
+    // position: relative;
     height: 180rpx;
-    z-index: 10;
+    // z-index: 10;
     font-size: 26rpx;
     display: flex;
     justify-content: center;
+  	text-align: center;
     align-items: center;
     font-weight: bold;
-
+  
     &.selected {
       background: #fff;
       color: #cec7bf;
@@ -307,27 +352,27 @@ export default {
       font-size: 28rpx;
       font-weight: bold;
     }
-
+  
     .cate-left-image{
-      position: absolute;
+      // position: absolute;
       width: 50rpx;
       height: 50rpx;
       border-radius: 10rpx;
-      margin-bottom: 20rpx;
+      margin-bottom: 10px;
     }
     .cate-left-text{
-      position: absolute;
-      margin-top: 80rpx;
-    }
-    .selected-0 {
-      color: #d81e06;
-    }
-    .selected-1 {
-      color: #d4237a;
-    }
-    .selected-2 {
-      color: #13227a;
+      // position: absolute;
+      // margin-top: 5px;
     }
+	.selected-0 {
+	  color: #d81e06;
+	}
+	.selected-1 {
+	  color: #d4237a;
+	}
+	.selected-2 {
+	  color: #13227a;
+	}
   }
 
   // 右侧二级分类