feat(shop): 使用白色购物车图标替换文本图标
- 引入了 base64 格式的白色购物车 SVG 图标常量 - 将购物车按钮内的文本符号替换为可自适应大小的 Image 组件 - 保持图标外观和布局一致,增强视觉统一性 - 提升图标加载性能,适配绿色浮动按钮主题
This commit is contained in:
1
src/assets/icons/cart.svg
Normal file
1
src/assets/icons/cart.svg
Normal file
@@ -0,0 +1 @@
|
|||||||
|
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="white" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><circle cx="9" cy="21" r="1"></circle><circle cx="20" cy="21" r="1"></circle><path d="M1 1h4l2.68 13.39a2 2 0 0 0 2 1.61h9.72a2 2 0 0 0 2-1.61L23 6H6"></path></svg>
|
||||||
|
After Width: | Height: | Size: 316 B |
3
src/assets/icons/index.ts
Normal file
3
src/assets/icons/index.ts
Normal file
@@ -0,0 +1,3 @@
|
|||||||
|
// 白色购物车 SVG 图标(base64,用于绿色浮动按钮)
|
||||||
|
export const CART_ICON_WHITE =
|
||||||
|
'data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0ibm9uZSIgc3Ryb2tlPSJ3aGl0ZSIgc3Ryb2tlLXdpZHRoPSIyIiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiPjxjaXJjbGUgY3g9IjkiIGN5PSIyMSIgcj0iMSI+PC9jaXJjbGU+PGNpcmNsZSBjeD0iMjAiIGN5PSIyMSIgcj0iMSI+PC9jaXJjbGU+PHBhdGggZD0iTTEgMWg0bDIuNjggMTMuMzlhMiAyIDAgMCAwIDIgMS42MWg5LjcyYTIgMiAwIDAgMCAyLTEuNjFMMjMgNkg2Ij48L3BhdGg+PC9zdmc+'
|
||||||
@@ -14,6 +14,7 @@ import { useShare } from '@/hooks/useShare'
|
|||||||
import EmptyState from '@/components/common/EmptyState'
|
import EmptyState from '@/components/common/EmptyState'
|
||||||
import LoadMore from '@/components/common/LoadMore'
|
import LoadMore from '@/components/common/LoadMore'
|
||||||
import Price from '@/components/common/Price'
|
import Price from '@/components/common/Price'
|
||||||
|
import { CART_ICON_WHITE } from '@/assets/icons'
|
||||||
|
|
||||||
definePageConfig({
|
definePageConfig({
|
||||||
navigationBarTitleText: '商品分类',
|
navigationBarTitleText: '商品分类',
|
||||||
@@ -360,7 +361,11 @@ const ShopPage: React.FC = () => {
|
|||||||
}}
|
}}
|
||||||
onClick={() => Taro.navigateTo({ url: '/pages/shop/cart' })}
|
onClick={() => Taro.navigateTo({ url: '/pages/shop/cart' })}
|
||||||
>
|
>
|
||||||
<Text className='text-white text-xl'>🛒</Text>
|
<Image
|
||||||
|
className='w-7 h-7'
|
||||||
|
src={CART_ICON_WHITE}
|
||||||
|
mode='aspectFit'
|
||||||
|
/>
|
||||||
{totalCount > 0 && (
|
{totalCount > 0 && (
|
||||||
<View
|
<View
|
||||||
className='flex items-center justify-center'
|
className='flex items-center justify-center'
|
||||||
|
|||||||
Reference in New Issue
Block a user