admin/danyang-match
1
0
Fork 0
Code Issues Pull Requests Actions 1 Packages Projects Releases Wiki Activity

feat: redesign miniapp tabbar icons

Browse Source
This commit is contained in:
admin
2026-09-10 22:00:17 +08:00
parent d6f5f25c35
commit 4dd93db137
44 changed files with 174 additions and 307 deletions
Download Patch File Download Diff File Expand all files Collapse all files
miniapp/assets/tabbar/svg/activity-active.svg
+3 -10
View File
@@ -1,12 +1,5 @@
<!-- 活动 - 日历图标 (选中状态) -->
<svg width="81" height="81" viewBox="0 0 81 81" fill="none" xmlns="http://www.w3.org/2000/svg">
<circle cx="25" cy="18" r="5" stroke="#E96B6B" stroke-width="2"/>
<circle cx="56" cy="18" r="5" stroke="#E96B6B" stroke-width="2"/>
<rect x="12" y="26" width="57" height="40" rx="8" stroke="#E96B6B" stroke-width="2"/>
<line x1="16" y1="36" x2="65" y2="36" stroke="#E96B6B" stroke-width="2"/>
<circle cx="25" cy="46" r="3" fill="#E96B6B"/>
<circle cx="40.5" cy="46" r="3" fill="#E96B6B"/>
<circle cx="56" cy="46" r="3" fill="#E96B6B"/>
<circle cx="33" cy="56" r="3" fill="#E96B6B"/>
<circle cx="48" cy="56" r="3" fill="#E96B6B"/>
<title>公益日历</title>
<g stroke="#E96B6B" stroke-width="4" stroke-linecap="round" stroke-linejoin="round"><rect x="17" y="20" width="47" height="44" rx="8"/><path d="M17 33h47M28 15v10M53 15v10"/><path class="heart" d="M40.5 57c-6.5-4.3-9.5-7.2-9.5-10.7 0-2.9 2.3-5.1 5.1-5.1 1.9 0 3.5.9 4.4 2.4.9-1.5 2.5-2.4 4.5-2.4 2.8 0 5.1 2.2 5.1 5.1 0 3.5-3.1 6.4-9.6 10.7Z"/></g>
<style>.heart{fill:#E96B6B;stroke:#E96B6B}.badge{fill:white}</style>
</svg>
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 696 B

After

Width:  |  Height:  |  Size: 555 B

miniapp/assets/tabbar/svg/activity.svg
+3 -14
View File
@@ -1,16 +1,5 @@
<!-- 活动 - 日历图标 -->
<svg width="81" height="81" viewBox="0 0 81 81" fill="none" xmlns="http://www.w3.org/2000/svg">
<!-- 挂环 -->
<circle cx="25" cy="18" r="5" stroke="#999999" stroke-width="2"/>
<circle cx="56" cy="18" r="5" stroke="#999999" stroke-width="2"/>
<!-- 日历主体 -->
<rect x="12" y="26" width="57" height="40" rx="8" stroke="#999999" stroke-width="2"/>
<!-- 分隔线 -->
<line x1="16" y1="36" x2="65" y2="36" stroke="#999999" stroke-width="2"/>
<!-- 日期点 -->
<circle cx="25" cy="46" r="3" fill="#999999"/>
<circle cx="40.5" cy="46" r="3" fill="#999999"/>
<circle cx="56" cy="46" r="3" fill="#999999"/>
<circle cx="33" cy="56" r="3" fill="#999999"/>
<circle cx="48" cy="56" r="3" fill="#999999"/>
<title>公益日历</title>
<g stroke="#999999" stroke-width="4" stroke-linecap="round" stroke-linejoin="round"><rect x="17" y="20" width="47" height="44" rx="8"/><path d="M17 33h47M28 15v10M53 15v10"/><path class="heart" d="M40.5 57c-6.5-4.3-9.5-7.2-9.5-10.7 0-2.9 2.3-5.1 5.1-5.1 1.9 0 3.5.9 4.4 2.4.9-1.5 2.5-2.4 4.5-2.4 2.8 0 5.1 2.2 5.1 5.1 0 3.5-3.1 6.4-9.6 10.7Z"/></g>
<style>.heart{fill:none;stroke:#999999}.badge{fill:white}</style>
</svg>
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 765 B

After

Width:  |  Height:  |  Size: 552 B

miniapp/assets/tabbar/svg/discover-active.svg
+3 -3
View File
@@ -1,5 +1,5 @@
<!-- 找对象 - 双心图标 (选中状态) -->
<svg width="81" height="81" viewBox="0 0 81 81" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M28 32C28 26 32 22 36 22C38 22 40 23 41 25C42 23 44 22 46 22C50 22 54 26 54 32C54 38 48 44 41 50C34 44 28 38 28 32Z" stroke="#E96B6B" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
<path d="M42 36C42 30 46 26 50 26C52 26 54 27 55 29C56 27 58 26 60 26C64 26 68 30 68 36C68 42 62 48 55 54C48 48 42 42 42 36Z" stroke="#E96B6B" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
<title>双人缘分</title>
<g stroke="#E96B6B" stroke-width="4" stroke-linecap="round" stroke-linejoin="round"><circle cx="26" cy="29" r="7"/><circle cx="55" cy="29" r="7"/><path d="M14 55c1-10 6-15 15-15 4 0 7 1 9 3M67 55c-1-10-6-15-15-15-4 0-7 1-9 3"/><path class="heart" d="M40.5 58c-6.8-4.5-10-7.6-10-11.2 0-3 2.3-5.3 5.3-5.3 2 0 3.7 1 4.7 2.5 1-1.5 2.7-2.5 4.7-2.5 3 0 5.3 2.3 5.3 5.3 0 3.6-3.2 6.7-10 11.2Z"/></g>
<style>.heart{fill:#E96B6B;stroke:#E96B6B}.badge{fill:white}</style>
</svg>
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 574 B

After

Width:  |  Height:  |  Size: 599 B

miniapp/assets/tabbar/svg/discover.svg
+3 -5
View File
@@ -1,7 +1,5 @@
<!-- 找对象 - 双心图标 -->
<svg width="81" height="81" viewBox="0 0 81 81" fill="none" xmlns="http://www.w3.org/2000/svg">
<!-- 左心 -->
<path d="M28 32C28 26 32 22 36 22C38 22 40 23 41 25C42 23 44 22 46 22C50 22 54 26 54 32C54 38 48 44 41 50C34 44 28 38 28 32Z" stroke="#999999" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
<!-- 右心 -->
<path d="M42 36C42 30 46 26 50 26C52 26 54 27 55 29C56 27 58 26 60 26C64 26 68 30 68 36C68 42 62 48 55 54C48 48 42 42 42 36Z" stroke="#999999" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
<title>双人缘分</title>
<g stroke="#999999" stroke-width="4" stroke-linecap="round" stroke-linejoin="round"><circle cx="26" cy="29" r="7"/><circle cx="55" cy="29" r="7"/><path d="M14 55c1-10 6-15 15-15 4 0 7 1 9 3M67 55c-1-10-6-15-15-15-4 0-7 1-9 3"/><path class="heart" d="M40.5 58c-6.8-4.5-10-7.6-10-11.2 0-3 2.3-5.3 5.3-5.3 2 0 3.7 1 4.7 2.5 1-1.5 2.7-2.5 4.7-2.5 3 0 5.3 2.3 5.3 5.3 0 3.6-3.2 6.7-10 11.2Z"/></g>
<style>.heart{fill:none;stroke:#999999}.badge{fill:white}</style>
</svg>
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 595 B

After

Width:  |  Height:  |  Size: 596 B

miniapp/assets/tabbar/svg/home-active.svg
+3 -5
View File
@@ -1,7 +1,5 @@
<!-- 首页 - 房子图标 (选中状态) -->
<svg width="81" height="81" viewBox="0 0 81 81" fill="none" xmlns="http://www.w3.org/2000/svg">
<rect x="58" y="18" width="8" height="14" rx="2" stroke="#E96B6B" stroke-width="2"/>
<path d="M40.5 16L22 34H59L40.5 16Z" stroke="#E96B6B" stroke-width="2" stroke-linejoin="round"/>
<rect x="24" y="34" width="33" height="22" rx="4" stroke="#E96B6B" stroke-width="2"/>
<rect x="35" y="46" width="11" height="10" rx="2" stroke="#E96B6B" stroke-width="2"/>
<title>爱心小屋</title>
<g stroke="#E96B6B" stroke-width="4" stroke-linecap="round" stroke-linejoin="round"><path d="M18 38 40.5 19 63 38"/><rect x="22" y="35" width="37" height="28" rx="7"/><path d="M31 63V49h19v14"/><path class="heart" d="M40.5 54c-5-3.4-7-5.4-7-8.2 0-2.3 1.8-4.1 4.1-4.1 1.3 0 2.4.6 2.9 1.6.6-1 1.7-1.6 3-1.6 2.3 0 4.1 1.8 4.1 4.1 0 2.8-2.1 4.8-7.1 8.2Z"/></g>
<style>.heart{fill:#E96B6B;stroke:#E96B6B}.badge{fill:white}</style>
</svg>
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 511 B

After

Width:  |  Height:  |  Size: 563 B

miniapp/assets/tabbar/svg/home.svg
+3 -9
View File
@@ -1,11 +1,5 @@
<!-- 首页 - 房子图标 -->
<svg width="81" height="81" viewBox="0 0 81 81" fill="none" xmlns="http://www.w3.org/2000/svg">
<!-- 烟囱 -->
<rect x="58" y="18" width="8" height="14" rx="2" stroke="#999999" stroke-width="2"/>
<!-- 屋顶 -->
<path d="M40.5 16L22 34H59L40.5 16Z" stroke="#999999" stroke-width="2" stroke-linejoin="round"/>
<!-- 房屋主体 -->
<rect x="24" y="34" width="33" height="22" rx="4" stroke="#999999" stroke-width="2"/>
<!-- 门 -->
<rect x="35" y="46" width="11" height="10" rx="2" stroke="#999999" stroke-width="2"/>
<title>爱心小屋</title>
<g stroke="#999999" stroke-width="4" stroke-linecap="round" stroke-linejoin="round"><path d="M18 38 40.5 19 63 38"/><rect x="22" y="35" width="37" height="28" rx="7"/><path d="M31 63V49h19v14"/><path class="heart" d="M40.5 54c-5-3.4-7-5.4-7-8.2 0-2.3 1.8-4.1 4.1-4.1 1.3 0 2.4.6 2.9 1.6.6-1 1.7-1.6 3-1.6 2.3 0 4.1 1.8 4.1 4.1 0 2.8-2.1 4.8-7.1 8.2Z"/></g>
<style>.heart{fill:none;stroke:#999999}.badge{fill:white}</style>
</svg>
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 571 B

After

Width:  |  Height:  |  Size: 560 B

miniapp/assets/tabbar/svg/message-active.svg
+3 -6
View File
@@ -1,8 +1,5 @@
<!-- 消息 - 对话气泡图标 (选中状态) -->
<svg width="81" height="81" viewBox="0 0 81 81" fill="none" xmlns="http://www.w3.org/2000/svg">
<rect x="12" y="18" width="57" height="36" rx="10" stroke="#E96B6B" stroke-width="2"/>
<path d="M22 54L16 64L28 54" stroke="#E96B6B" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
<line x1="20" y1="28" x2="61" y2="28" stroke="#E96B6B" stroke-width="2" stroke-linecap="round"/>
<line x1="20" y1="36" x2="53" y2="36" stroke="#E96B6B" stroke-width="2" stroke-linecap="round"/>
<line x1="20" y1="44" x2="45" y2="44" stroke="#E96B6B" stroke-width="2" stroke-linecap="round"/>
<title>爱心对话</title>
<g stroke="#E96B6B" stroke-width="4" stroke-linecap="round" stroke-linejoin="round"><path d="M23 60 15 66l2.4-11.2A12 12 0 0 1 14 46V29a12 12 0 0 1 12-12h29a12 12 0 0 1 12 12v17a12 12 0 0 1-12 12H27c-1.4 0-2.7.7-4 2Z"/><path class="heart" d="M40.5 48c-7.5-5-11-8.4-11-12.4 0-3.3 2.6-5.9 5.9-5.9 2.2 0 4.1 1.1 5.1 2.8 1.1-1.7 3-2.8 5.2-2.8 3.3 0 5.9 2.6 5.9 5.9 0 4-3.6 7.4-11.1 12.4Z"/></g>
<style>.heart{fill:#E96B6B;stroke:#E96B6B}.badge{fill:white}</style>
</svg>
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 655 B

After

Width:  |  Height:  |  Size: 597 B

miniapp/assets/tabbar/svg/message.svg
+3 -9
View File
@@ -1,11 +1,5 @@
<!-- 消息 - 对话气泡图标 -->
<svg width="81" height="81" viewBox="0 0 81 81" fill="none" xmlns="http://www.w3.org/2000/svg">
<!-- 气泡主体 -->
<rect x="12" y="18" width="57" height="36" rx="10" stroke="#999999" stroke-width="2"/>
<!-- 小三角 -->
<path d="M22 54L16 64L28 54" stroke="#999999" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
<!-- 文字线条 -->
<line x1="20" y1="28" x2="61" y2="28" stroke="#999999" stroke-width="2" stroke-linecap="round"/>
<line x1="20" y1="36" x2="53" y2="36" stroke="#999999" stroke-width="2" stroke-linecap="round"/>
<line x1="20" y1="44" x2="45" y2="44" stroke="#999999" stroke-width="2" stroke-linecap="round"/>
<title>爱心对话</title>
<g stroke="#999999" stroke-width="4" stroke-linecap="round" stroke-linejoin="round"><path d="M23 60 15 66l2.4-11.2A12 12 0 0 1 14 46V29a12 12 0 0 1 12-12h29a12 12 0 0 1 12 12v17a12 12 0 0 1-12 12H27c-1.4 0-2.7.7-4 2Z"/><path class="heart" d="M40.5 48c-7.5-5-11-8.4-11-12.4 0-3.3 2.6-5.9 5.9-5.9 2.2 0 4.1 1.1 5.1 2.8 1.1-1.7 3-2.8 5.2-2.8 3.3 0 5.9 2.6 5.9 5.9 0 4-3.6 7.4-11.1 12.4Z"/></g>
<style>.heart{fill:none;stroke:#999999}.badge{fill:white}</style>
</svg>
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 709 B

After

Width:  |  Height:  |  Size: 594 B

miniapp/assets/tabbar/svg/mine-active.svg
+3 -5
View File
@@ -1,7 +1,5 @@
<!-- 我的 - 用户图标 (选中状态) -->
<svg width="81" height="81" viewBox="0 0 81 81" fill="none" xmlns="http://www.w3.org/2000/svg">
<circle cx="40.5" cy="28" r="14" stroke="#E96B6B" stroke-width="2"/>
<path d="M22 62C22 50 30 44 40.5 44C51 44 59 50 59 62" stroke="#E96B6B" stroke-width="2" stroke-linecap="round"/>
<line x1="22" y1="52" x2="22" y2="62" stroke="#E96B6B" stroke-width="2" stroke-linecap="round"/>
<line x1="59" y1="52" x2="59" y2="62" stroke="#E96B6B" stroke-width="2" stroke-linecap="round"/>
<title>个人守护</title>
<g stroke="#E96B6B" stroke-width="4" stroke-linecap="round" stroke-linejoin="round"><circle cx="40.5" cy="27" r="8"/><path d="M20 64c.7-14 8-21 20.5-21S60.3 50 61 64"/><path class="heart" d="M40.5 59c-5.2-3.5-7.7-5.8-7.7-8.6 0-2.3 1.9-4.2 4.2-4.2 1.6 0 2.8.8 3.5 2 .8-1.2 2-2 3.6-2 2.3 0 4.2 1.9 4.2 4.2 0 2.8-2.5 5.1-7.8 8.6Z"/></g>
<style>.heart{fill:#E96B6B;stroke:#E96B6B}.badge{fill:white}</style>
</svg>
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 534 B

After

Width:  |  Height:  |  Size: 540 B

miniapp/assets/tabbar/svg/mine.svg
+3 -8
View File
@@ -1,10 +1,5 @@
<!-- 我的 - 用户图标 -->
<svg width="81" height="81" viewBox="0 0 81 81" fill="none" xmlns="http://www.w3.org/2000/svg">
<!-- 头部 -->
<circle cx="40.5" cy="28" r="14" stroke="#999999" stroke-width="2"/>
<!-- 身体 -->
<path d="M22 62C22 50 30 44 40.5 44C51 44 59 50 59 62" stroke="#999999" stroke-width="2" stroke-linecap="round"/>
<!-- 身体两侧 -->
<line x1="22" y1="52" x2="22" y2="62" stroke="#999999" stroke-width="2" stroke-linecap="round"/>
<line x1="59" y1="52" x2="59" y2="62" stroke="#999999" stroke-width="2" stroke-linecap="round"/>
<title>个人守护</title>
<g stroke="#999999" stroke-width="4" stroke-linecap="round" stroke-linejoin="round"><circle cx="40.5" cy="27" r="8"/><path d="M20 64c.7-14 8-21 20.5-21S60.3 50 61 64"/><path class="heart" d="M40.5 59c-5.2-3.5-7.7-5.8-7.7-8.6 0-2.3 1.9-4.2 4.2-4.2 1.6 0 2.8.8 3.5 2 .8-1.2 2-2 3.6-2 2.3 0 4.2 1.9 4.2 4.2 0 2.8-2.5 5.1-7.8 8.6Z"/></g>
<style>.heart{fill:none;stroke:#999999}.badge{fill:white}</style>
</svg>
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 579 B

After

Width:  |  Height:  |  Size: 537 B