Showing
1 changed file
with
24 additions
and
22 deletions
| 1 | <!-- | 1 | <!-- |
| 2 | * @Date: 2025-03-20 19:55:21 | 2 | * @Date: 2025-03-20 19:55:21 |
| 3 | * @LastEditors: hookehuyr hookehuyr@gmail.com | 3 | * @LastEditors: hookehuyr hookehuyr@gmail.com |
| 4 | - * @LastEditTime: 2025-03-25 15:57:15 | 4 | + * @LastEditTime: 2025-03-25 16:44:51 |
| 5 | * @FilePath: /mlaj/src/views/HomePage.vue | 5 | * @FilePath: /mlaj/src/views/HomePage.vue |
| 6 | * @Description: 亲子学院首页组件 | 6 | * @Description: 亲子学院首页组件 |
| 7 | * | 7 | * |
| ... | @@ -254,28 +254,30 @@ | ... | @@ -254,28 +254,30 @@ |
| 254 | </div> | 254 | </div> |
| 255 | </div> | 255 | </div> |
| 256 | 256 | ||
| 257 | - <!-- Tab Navigation --> | 257 | + <!-- Custom Tab Navigation --> |
| 258 | - <div class="px-4 border-b border-gray-200"> | 258 | + <div class="sticky top-0 bg-white/70 backdrop-blur-lg" style="z-index: 999;"> |
| 259 | - <div class="flex space-x-6"> | 259 | + <div class="px-4 border-b border-gray-200"> |
| 260 | - <button | 260 | + <div class="flex space-x-6"> |
| 261 | - v-for="tab in ['推荐', '直播', '精选']" | 261 | + <button |
| 262 | - :key="tab" | 262 | + v-for="tab in ['推荐', '直播', '精选']" |
| 263 | - @click="activeTab = tab" | 263 | + :key="tab" |
| 264 | - :class="[ | 264 | + @click="activeTab = tab" |
| 265 | - 'pb-3 px-1 font-medium', | 265 | + :class="[ |
| 266 | - activeTab === tab | 266 | + 'pb-3 pt-3 px-1 font-medium', |
| 267 | - ? 'text-green-600 border-b-2 border-green-600' | 267 | + activeTab === tab |
| 268 | - : 'text-gray-500' | 268 | + ? 'text-green-600 border-b-2 border-green-600' |
| 269 | - ]" | 269 | + : 'text-gray-500' |
| 270 | - > | 270 | + ]" |
| 271 | - {{ tab }} | ||
| 272 | - <span | ||
| 273 | - v-if="tab === '直播'" | ||
| 274 | - class="ml-1 px-1.5 py-0.5 bg-red-500 text-white text-xs rounded-full" | ||
| 275 | > | 271 | > |
| 276 | - 2 | 272 | + {{ tab }} |
| 277 | - </span> | 273 | + <span |
| 278 | - </button> | 274 | + v-if="tab === '直播'" |
| 275 | + class="ml-1 px-1.5 py-0.5 bg-red-500 text-white text-xs rounded-full" | ||
| 276 | + > | ||
| 277 | + 2 | ||
| 278 | + </span> | ||
| 279 | + </button> | ||
| 280 | + </div> | ||
| 279 | </div> | 281 | </div> |
| 280 | </div> | 282 | </div> |
| 281 | 283 | ... | ... |
-
Please register or login to post a comment