From d6cb582ffe0c736aa068787118a1bbb423aaa940 Mon Sep 17 00:00:00 2001 From: Blizzard Date: Mon, 5 Oct 2026 11:43:10 +0800 Subject: [PATCH] Rename home tab to daily and add calendar sunshine icon --- pets-fe/components/tab-bar/index.js | 2 +- pets-fe/components/tab-bar/index.wxml | 10 ++-- pets-fe/components/tab-bar/index.wxss | 69 ++++++++++++++++----------- 3 files changed, 48 insertions(+), 33 deletions(-) diff --git a/pets-fe/components/tab-bar/index.js b/pets-fe/components/tab-bar/index.js index ffbb88a..a4676fc 100644 --- a/pets-fe/components/tab-bar/index.js +++ b/pets-fe/components/tab-bar/index.js @@ -1,5 +1,5 @@ const tabs = [ - { path: "/pages/home/home", label: "首页", key: "home" }, + { path: "/pages/home/home", label: "日常", key: "daily" }, { path: "/pages/meetups/meetups", label: "约遛", key: "meetups" }, { path: "/pages/walk/walk", label: "遛狗", key: "walk" }, { path: "/pages/tasks/tasks", label: "任务", key: "tasks" }, diff --git a/pets-fe/components/tab-bar/index.wxml b/pets-fe/components/tab-bar/index.wxml index c2a82f7..01b1ab7 100644 --- a/pets-fe/components/tab-bar/index.wxml +++ b/pets-fe/components/tab-bar/index.wxml @@ -18,10 +18,12 @@ - - - - + + + + + + diff --git a/pets-fe/components/tab-bar/index.wxss b/pets-fe/components/tab-bar/index.wxss index a0b1664..d439fa1 100644 --- a/pets-fe/components/tab-bar/index.wxss +++ b/pets-fe/components/tab-bar/index.wxss @@ -50,44 +50,57 @@ border-radius: 50%; background: #df936a; } -.home-icon { +.daily-icon { position: relative; - width: 42rpx; - height: 42rpx; + width: 39rpx; + height: 37rpx; + margin-top: 5rpx; + border: 3rpx solid currentColor; + border-radius: 9rpx; } -.home-roof { +.calendar-ring { position: absolute; - top: 3rpx; - left: 10rpx; - width: 25rpx; - height: 25rpx; - border-left: 4rpx solid currentColor; - border-top: 4rpx solid currentColor; + top: -8rpx; + width: 3rpx; + height: 11rpx; border-radius: 3rpx; - transform: rotate(45deg); + background: currentColor; } -.home-body { +.ring-left { left: 7rpx; } +.ring-right { right: 7rpx; } +.calendar-divider { + position: absolute; + top: 7rpx; + left: 0; + right: 0; + border-top: 3rpx solid currentColor; +} +.daily-rays { position: absolute; left: 6rpx; - right: 6rpx; - bottom: 1rpx; - height: 24rpx; - border-left: 4rpx solid currentColor; - border-right: 4rpx solid currentColor; - border-bottom: 4rpx solid currentColor; - border-radius: 0 0 5rpx 5rpx; + top: 12rpx; + width: 21rpx; + height: 21rpx; } -.home-door { +.daily-rays::before, .daily-rays::after { + content: ""; position: absolute; - left: 18rpx; - bottom: 2rpx; - width: 10rpx; - height: 15rpx; - border-left: 3rpx solid currentColor; - border-right: 3rpx solid currentColor; - border-top: 3rpx solid currentColor; - border-radius: 5rpx 5rpx 0 0; + border-radius: 2rpx; + background: currentColor; } +.daily-rays::before { left: 9rpx; top: 0; width: 3rpx; height: 21rpx; } +.daily-rays::after { left: 0; top: 9rpx; width: 21rpx; height: 3rpx; } +.daily-sun { + position: absolute; + left: 10rpx; + top: 16rpx; + width: 13rpx; + height: 13rpx; + border: 3rpx solid currentColor; + border-radius: 50%; + background: #fff; +} +.active .daily-sun { background: #fff0e2; } .friends-icon { position: relative; width: 48rpx;