james/vmall
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat(mall): classic B2B2C PC storefront with fixed mock API layer

Browse Source 
- Mock adapter implementing @vmall/shared ApiClient (localStorage-persisted
  cart/orders/invoices), runtime switch via mockApi flag (default on)
- Fixed bilingual mock catalog: 3-level categories, 24 products w/ SKUs,
  stores, brands, banners, floors, seckill/collective/integral, comments,
  coupons, addresses, seeded orders/shipments/invoices
- B2B2C mall shell: top bar, logo/search/cart header, dark nav + category
  mega-menu, value-prop footer, back-to-top; 1200px grid, #ca151e theme
- UI primitives replacing element-plus: carousel, pagination, breadcrumb,
  qty stepper, rating stars, modal, tabs, step bar, product card
- Pages: home floors, search (filters/sort/paging), goods detail (SKU
  picker, store rail, review tabs), cart -> checkout -> pay -> success,
  auth pages, user center (dashboard/orders/addresses/favorites/coupons/
  invoices), stores, seckill, collective, integral
- i18n split into per-domain locale modules (en+zh)
- OpenSpec change mall-pc-storefront-replica archived; all specs green
This commit is contained in:
Chengdong Zhang
2026-09-17 19:13:29 +08:00
parent 997c312cda
commit 21e99bb52b
111 changed files with 9458 additions and 1035 deletions
Download Patch File Download Diff File Expand all files Collapse all files
apps/mall/public/mock/avatar.svg
+7
View File
@@ -0,0 +1,7 @@
<svg xmlns="http://www.w3.org/2000/svg" width="120" height="120" viewBox="0 0 120 120">
<defs><linearGradient id="g" x1="0" y1="0" x2="1" y2="1">
<stop offset="0" stop-color="#909399"/><stop offset="1" stop-color="#c0c4cc"/>
</linearGradient></defs>
<rect width="120" height="120" fill="url(#g)"/>
<text x="60" y="60" font-family="system-ui,sans-serif" font-size="15" fill="rgba(255,255,255,.9)" text-anchor="middle" dominant-baseline="middle">U</text>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 471 B

apps/mall/public/mock/banner-1.svg
+7
View File
@@ -0,0 +1,7 @@
<svg xmlns="http://www.w3.org/2000/svg" width="1200" height="450" viewBox="0 0 1200 450">
<defs><linearGradient id="g" x1="0" y1="0" x2="1" y2="1">
<stop offset="0" stop-color="#ca151e"/><stop offset="1" stop-color="#f0643a"/>
</linearGradient></defs>
<rect width="1200" height="450" fill="url(#g)"/>
<text x="600" y="225" font-family="system-ui,sans-serif" font-size="48" fill="rgba(255,255,255,.9)" text-anchor="middle" dominant-baseline="middle">Banner 1</text>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 483 B

apps/mall/public/mock/banner-2.svg
+7
View File
@@ -0,0 +1,7 @@
<svg xmlns="http://www.w3.org/2000/svg" width="1200" height="450" viewBox="0 0 1200 450">
<defs><linearGradient id="g" x1="0" y1="0" x2="1" y2="1">
<stop offset="0" stop-color="#333333"/><stop offset="1" stop-color="#666666"/>
</linearGradient></defs>
<rect width="1200" height="450" fill="url(#g)"/>
<text x="600" y="225" font-family="system-ui,sans-serif" font-size="48" fill="rgba(255,255,255,.9)" text-anchor="middle" dominant-baseline="middle">Banner 2</text>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 483 B

apps/mall/public/mock/banner-3.svg
+7
View File
@@ -0,0 +1,7 @@
<svg xmlns="http://www.w3.org/2000/svg" width="1200" height="450" viewBox="0 0 1200 450">
<defs><linearGradient id="g" x1="0" y1="0" x2="1" y2="1">
<stop offset="0" stop-color="#1a5fb4"/><stop offset="1" stop-color="#3b82c4"/>
</linearGradient></defs>
<rect width="1200" height="450" fill="url(#g)"/>
<text x="600" y="225" font-family="system-ui,sans-serif" font-size="48" fill="rgba(255,255,255,.9)" text-anchor="middle" dominant-baseline="middle">Banner 3</text>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 483 B

apps/mall/public/mock/collective-banner.svg
+7
View File
@@ -0,0 +1,7 @@
<svg xmlns="http://www.w3.org/2000/svg" width="1200" height="350" viewBox="0 0 1200 350">
<defs><linearGradient id="g" x1="0" y1="0" x2="1" y2="1">
<stop offset="0" stop-color="#ad1457"/><stop offset="1" stop-color="#f06292"/>
</linearGradient></defs>
<rect width="1200" height="350" fill="url(#g)"/>
<text x="600" y="175" font-family="system-ui,sans-serif" font-size="40" fill="rgba(255,255,255,.9)" text-anchor="middle" dominant-baseline="middle">Group Buy</text>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 484 B

apps/mall/public/mock/floor-adv-1.svg
+7
View File
@@ -0,0 +1,7 @@
<svg xmlns="http://www.w3.org/2000/svg" width="234" height="614" viewBox="0 0 234 614">
<defs><linearGradient id="g" x1="0" y1="0" x2="1" y2="1">
<stop offset="0" stop-color="#1a5fb4"/><stop offset="1" stop-color="#3b82c4"/>
</linearGradient></defs>
<rect width="234" height="614" fill="url(#g)"/>
<text x="117" y="307" font-family="system-ui,sans-serif" font-size="29" fill="rgba(255,255,255,.9)" text-anchor="middle" dominant-baseline="middle">Floor 1</text>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 479 B

apps/mall/public/mock/floor-adv-2.svg
+7
View File
@@ -0,0 +1,7 @@
<svg xmlns="http://www.w3.org/2000/svg" width="234" height="614" viewBox="0 0 234 614">
<defs><linearGradient id="g" x1="0" y1="0" x2="1" y2="1">
<stop offset="0" stop-color="#2e7d32"/><stop offset="1" stop-color="#66bb6a"/>
</linearGradient></defs>
<rect width="234" height="614" fill="url(#g)"/>
<text x="117" y="307" font-family="system-ui,sans-serif" font-size="29" fill="rgba(255,255,255,.9)" text-anchor="middle" dominant-baseline="middle">Floor 2</text>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 479 B

apps/mall/public/mock/floor-adv-3.svg
+7
View File
@@ -0,0 +1,7 @@
<svg xmlns="http://www.w3.org/2000/svg" width="234" height="614" viewBox="0 0 234 614">
<defs><linearGradient id="g" x1="0" y1="0" x2="1" y2="1">
<stop offset="0" stop-color="#6a1b9a"/><stop offset="1" stop-color="#ab47bc"/>
</linearGradient></defs>
<rect width="234" height="614" fill="url(#g)"/>
<text x="117" y="307" font-family="system-ui,sans-serif" font-size="29" fill="rgba(255,255,255,.9)" text-anchor="middle" dominant-baseline="middle">Floor 3</text>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 479 B

apps/mall/public/mock/floor-adv-4.svg
+7
View File
@@ -0,0 +1,7 @@
<svg xmlns="http://www.w3.org/2000/svg" width="234" height="614" viewBox="0 0 234 614">
<defs><linearGradient id="g" x1="0" y1="0" x2="1" y2="1">
<stop offset="0" stop-color="#c77800"/><stop offset="1" stop-color="#ffb300"/>
</linearGradient></defs>
<rect width="234" height="614" fill="url(#g)"/>
<text x="117" y="307" font-family="system-ui,sans-serif" font-size="29" fill="rgba(255,255,255,.9)" text-anchor="middle" dominant-baseline="middle">Floor 4</text>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 479 B

apps/mall/public/mock/floor-adv-5.svg
+7
View File
@@ -0,0 +1,7 @@
<svg xmlns="http://www.w3.org/2000/svg" width="234" height="614" viewBox="0 0 234 614">
<defs><linearGradient id="g" x1="0" y1="0" x2="1" y2="1">
<stop offset="0" stop-color="#00838f"/><stop offset="1" stop-color="#26c6da"/>
</linearGradient></defs>
<rect width="234" height="614" fill="url(#g)"/>
<text x="117" y="307" font-family="system-ui,sans-serif" font-size="29" fill="rgba(255,255,255,.9)" text-anchor="middle" dominant-baseline="middle">Floor 5</text>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 479 B

apps/mall/public/mock/floor-adv-6.svg
+7
View File
@@ -0,0 +1,7 @@
<svg xmlns="http://www.w3.org/2000/svg" width="234" height="614" viewBox="0 0 234 614">
<defs><linearGradient id="g" x1="0" y1="0" x2="1" y2="1">
<stop offset="0" stop-color="#ad1457"/><stop offset="1" stop-color="#ec407a"/>
</linearGradient></defs>
<rect width="234" height="614" fill="url(#g)"/>
<text x="117" y="307" font-family="system-ui,sans-serif" font-size="29" fill="rgba(255,255,255,.9)" text-anchor="middle" dominant-baseline="middle">Floor 6</text>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 479 B

apps/mall/public/mock/integral-banner.svg
+7
View File
@@ -0,0 +1,7 @@
<svg xmlns="http://www.w3.org/2000/svg" width="1200" height="350" viewBox="0 0 1200 350">
<defs><linearGradient id="g" x1="0" y1="0" x2="1" y2="1">
<stop offset="0" stop-color="#c77800"/><stop offset="1" stop-color="#ffca28"/>
</linearGradient></defs>
<rect width="1200" height="350" fill="url(#g)"/>
<text x="600" y="175" font-family="system-ui,sans-serif" font-size="40" fill="rgba(255,255,255,.9)" text-anchor="middle" dominant-baseline="middle">Points Mall</text>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 486 B

apps/mall/public/mock/login-bg.svg
+7
View File
@@ -0,0 +1,7 @@
<svg xmlns="http://www.w3.org/2000/svg" width="1920" height="600" viewBox="0 0 1920 600">
<defs><linearGradient id="g" x1="0" y1="0" x2="1" y2="1">
<stop offset="0" stop-color="#2b2b2b"/><stop offset="1" stop-color="#ca151e"/>
</linearGradient></defs>
<rect width="1920" height="600" fill="url(#g)"/>
<text x="960" y="300" font-family="system-ui,sans-serif" font-size="64" fill="rgba(255,255,255,.9)" text-anchor="middle" dominant-baseline="middle">VMall</text>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 480 B

apps/mall/public/mock/product-1.svg
+7
View File
@@ -0,0 +1,7 @@
<svg xmlns="http://www.w3.org/2000/svg" width="400" height="400" viewBox="0 0 400 400">
<defs><linearGradient id="g" x1="0" y1="0" x2="1" y2="1">
<stop offset="0" stop-color="#333333"/><stop offset="1" stop-color="#666666"/>
</linearGradient></defs>
<rect width="400" height="400" fill="url(#g)"/>
<text x="200" y="200" font-family="system-ui,sans-serif" font-size="50" fill="rgba(255,255,255,.9)" text-anchor="middle" dominant-baseline="middle">P1</text>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 474 B

apps/mall/public/mock/product-10.svg
+7
View File
@@ -0,0 +1,7 @@
<svg xmlns="http://www.w3.org/2000/svg" width="400" height="400" viewBox="0 0 400 400">
<defs><linearGradient id="g" x1="0" y1="0" x2="1" y2="1">
<stop offset="0" stop-color="#1a5fb4"/><stop offset="1" stop-color="#3b82c4"/>
</linearGradient></defs>
<rect width="400" height="400" fill="url(#g)"/>
<text x="200" y="200" font-family="system-ui,sans-serif" font-size="50" fill="rgba(255,255,255,.9)" text-anchor="middle" dominant-baseline="middle">P10</text>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 475 B

apps/mall/public/mock/product-11.svg
+7
View File
@@ -0,0 +1,7 @@
<svg xmlns="http://www.w3.org/2000/svg" width="400" height="400" viewBox="0 0 400 400">
<defs><linearGradient id="g" x1="0" y1="0" x2="1" y2="1">
<stop offset="0" stop-color="#2e7d32"/><stop offset="1" stop-color="#66bb6a"/>
</linearGradient></defs>
<rect width="400" height="400" fill="url(#g)"/>
<text x="200" y="200" font-family="system-ui,sans-serif" font-size="50" fill="rgba(255,255,255,.9)" text-anchor="middle" dominant-baseline="middle">P11</text>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 475 B

apps/mall/public/mock/product-12.svg
+7
View File
@@ -0,0 +1,7 @@
<svg xmlns="http://www.w3.org/2000/svg" width="400" height="400" viewBox="0 0 400 400">
<defs><linearGradient id="g" x1="0" y1="0" x2="1" y2="1">
<stop offset="0" stop-color="#6a1b9a"/><stop offset="1" stop-color="#ab47bc"/>
</linearGradient></defs>
<rect width="400" height="400" fill="url(#g)"/>
<text x="200" y="200" font-family="system-ui,sans-serif" font-size="50" fill="rgba(255,255,255,.9)" text-anchor="middle" dominant-baseline="middle">P12</text>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 475 B

apps/mall/public/mock/product-13.svg
+7
View File
@@ -0,0 +1,7 @@
<svg xmlns="http://www.w3.org/2000/svg" width="400" height="400" viewBox="0 0 400 400">
<defs><linearGradient id="g" x1="0" y1="0" x2="1" y2="1">
<stop offset="0" stop-color="#c77800"/><stop offset="1" stop-color="#ffb300"/>
</linearGradient></defs>
<rect width="400" height="400" fill="url(#g)"/>
<text x="200" y="200" font-family="system-ui,sans-serif" font-size="50" fill="rgba(255,255,255,.9)" text-anchor="middle" dominant-baseline="middle">P13</text>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 475 B

apps/mall/public/mock/product-14.svg
+7
View File
@@ -0,0 +1,7 @@
<svg xmlns="http://www.w3.org/2000/svg" width="400" height="400" viewBox="0 0 400 400">
<defs><linearGradient id="g" x1="0" y1="0" x2="1" y2="1">
<stop offset="0" stop-color="#00838f"/><stop offset="1" stop-color="#26c6da"/>
</linearGradient></defs>
<rect width="400" height="400" fill="url(#g)"/>
<text x="200" y="200" font-family="system-ui,sans-serif" font-size="50" fill="rgba(255,255,255,.9)" text-anchor="middle" dominant-baseline="middle">P14</text>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 475 B

apps/mall/public/mock/product-15.svg
+7
View File
@@ -0,0 +1,7 @@
<svg xmlns="http://www.w3.org/2000/svg" width="400" height="400" viewBox="0 0 400 400">
<defs><linearGradient id="g" x1="0" y1="0" x2="1" y2="1">
<stop offset="0" stop-color="#ad1457"/><stop offset="1" stop-color="#ec407a"/>
</linearGradient></defs>
<rect width="400" height="400" fill="url(#g)"/>
<text x="200" y="200" font-family="system-ui,sans-serif" font-size="50" fill="rgba(255,255,255,.9)" text-anchor="middle" dominant-baseline="middle">P15</text>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 475 B

apps/mall/public/mock/product-16.svg
+7
View File
@@ -0,0 +1,7 @@
<svg xmlns="http://www.w3.org/2000/svg" width="400" height="400" viewBox="0 0 400 400">
<defs><linearGradient id="g" x1="0" y1="0" x2="1" y2="1">
<stop offset="0" stop-color="#ca151e"/><stop offset="1" stop-color="#f0643a"/>
</linearGradient></defs>
<rect width="400" height="400" fill="url(#g)"/>
<text x="200" y="200" font-family="system-ui,sans-serif" font-size="50" fill="rgba(255,255,255,.9)" text-anchor="middle" dominant-baseline="middle">P16</text>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 475 B

apps/mall/public/mock/product-17.svg
+7
View File
@@ -0,0 +1,7 @@
<svg xmlns="http://www.w3.org/2000/svg" width="400" height="400" viewBox="0 0 400 400">
<defs><linearGradient id="g" x1="0" y1="0" x2="1" y2="1">
<stop offset="0" stop-color="#333333"/><stop offset="1" stop-color="#666666"/>
</linearGradient></defs>
<rect width="400" height="400" fill="url(#g)"/>
<text x="200" y="200" font-family="system-ui,sans-serif" font-size="50" fill="rgba(255,255,255,.9)" text-anchor="middle" dominant-baseline="middle">P17</text>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 475 B

apps/mall/public/mock/product-18.svg
+7
View File
@@ -0,0 +1,7 @@
<svg xmlns="http://www.w3.org/2000/svg" width="400" height="400" viewBox="0 0 400 400">
<defs><linearGradient id="g" x1="0" y1="0" x2="1" y2="1">
<stop offset="0" stop-color="#1a5fb4"/><stop offset="1" stop-color="#3b82c4"/>
</linearGradient></defs>
<rect width="400" height="400" fill="url(#g)"/>
<text x="200" y="200" font-family="system-ui,sans-serif" font-size="50" fill="rgba(255,255,255,.9)" text-anchor="middle" dominant-baseline="middle">P18</text>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 475 B

apps/mall/public/mock/product-19.svg
+7
View File
@@ -0,0 +1,7 @@
<svg xmlns="http://www.w3.org/2000/svg" width="400" height="400" viewBox="0 0 400 400">
<defs><linearGradient id="g" x1="0" y1="0" x2="1" y2="1">
<stop offset="0" stop-color="#2e7d32"/><stop offset="1" stop-color="#66bb6a"/>
</linearGradient></defs>
<rect width="400" height="400" fill="url(#g)"/>
<text x="200" y="200" font-family="system-ui,sans-serif" font-size="50" fill="rgba(255,255,255,.9)" text-anchor="middle" dominant-baseline="middle">P19</text>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 475 B

apps/mall/public/mock/product-2.svg
+7
View File
@@ -0,0 +1,7 @@
<svg xmlns="http://www.w3.org/2000/svg" width="400" height="400" viewBox="0 0 400 400">
<defs><linearGradient id="g" x1="0" y1="0" x2="1" y2="1">
<stop offset="0" stop-color="#1a5fb4"/><stop offset="1" stop-color="#3b82c4"/>
</linearGradient></defs>
<rect width="400" height="400" fill="url(#g)"/>
<text x="200" y="200" font-family="system-ui,sans-serif" font-size="50" fill="rgba(255,255,255,.9)" text-anchor="middle" dominant-baseline="middle">P2</text>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 474 B

apps/mall/public/mock/product-20.svg
+7
View File
@@ -0,0 +1,7 @@
<svg xmlns="http://www.w3.org/2000/svg" width="400" height="400" viewBox="0 0 400 400">
<defs><linearGradient id="g" x1="0" y1="0" x2="1" y2="1">
<stop offset="0" stop-color="#6a1b9a"/><stop offset="1" stop-color="#ab47bc"/>
</linearGradient></defs>
<rect width="400" height="400" fill="url(#g)"/>
<text x="200" y="200" font-family="system-ui,sans-serif" font-size="50" fill="rgba(255,255,255,.9)" text-anchor="middle" dominant-baseline="middle">P20</text>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 475 B

apps/mall/public/mock/product-21.svg
+7
View File
@@ -0,0 +1,7 @@
<svg xmlns="http://www.w3.org/2000/svg" width="400" height="400" viewBox="0 0 400 400">
<defs><linearGradient id="g" x1="0" y1="0" x2="1" y2="1">
<stop offset="0" stop-color="#c77800"/><stop offset="1" stop-color="#ffb300"/>
</linearGradient></defs>
<rect width="400" height="400" fill="url(#g)"/>
<text x="200" y="200" font-family="system-ui,sans-serif" font-size="50" fill="rgba(255,255,255,.9)" text-anchor="middle" dominant-baseline="middle">P21</text>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 475 B

apps/mall/public/mock/product-22.svg
+7
View File
@@ -0,0 +1,7 @@
<svg xmlns="http://www.w3.org/2000/svg" width="400" height="400" viewBox="0 0 400 400">
<defs><linearGradient id="g" x1="0" y1="0" x2="1" y2="1">
<stop offset="0" stop-color="#00838f"/><stop offset="1" stop-color="#26c6da"/>
</linearGradient></defs>
<rect width="400" height="400" fill="url(#g)"/>
<text x="200" y="200" font-family="system-ui,sans-serif" font-size="50" fill="rgba(255,255,255,.9)" text-anchor="middle" dominant-baseline="middle">P22</text>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 475 B

apps/mall/public/mock/product-23.svg
+7
View File
@@ -0,0 +1,7 @@
<svg xmlns="http://www.w3.org/2000/svg" width="400" height="400" viewBox="0 0 400 400">
<defs><linearGradient id="g" x1="0" y1="0" x2="1" y2="1">
<stop offset="0" stop-color="#ad1457"/><stop offset="1" stop-color="#ec407a"/>
</linearGradient></defs>
<rect width="400" height="400" fill="url(#g)"/>
<text x="200" y="200" font-family="system-ui,sans-serif" font-size="50" fill="rgba(255,255,255,.9)" text-anchor="middle" dominant-baseline="middle">P23</text>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 475 B

apps/mall/public/mock/product-24.svg
+7
View File
@@ -0,0 +1,7 @@
<svg xmlns="http://www.w3.org/2000/svg" width="400" height="400" viewBox="0 0 400 400">
<defs><linearGradient id="g" x1="0" y1="0" x2="1" y2="1">
<stop offset="0" stop-color="#ca151e"/><stop offset="1" stop-color="#f0643a"/>
</linearGradient></defs>
<rect width="400" height="400" fill="url(#g)"/>
<text x="200" y="200" font-family="system-ui,sans-serif" font-size="50" fill="rgba(255,255,255,.9)" text-anchor="middle" dominant-baseline="middle">P24</text>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 475 B

apps/mall/public/mock/product-3.svg
+7
View File
@@ -0,0 +1,7 @@
<svg xmlns="http://www.w3.org/2000/svg" width="400" height="400" viewBox="0 0 400 400">
<defs><linearGradient id="g" x1="0" y1="0" x2="1" y2="1">
<stop offset="0" stop-color="#2e7d32"/><stop offset="1" stop-color="#66bb6a"/>
</linearGradient></defs>
<rect width="400" height="400" fill="url(#g)"/>
<text x="200" y="200" font-family="system-ui,sans-serif" font-size="50" fill="rgba(255,255,255,.9)" text-anchor="middle" dominant-baseline="middle">P3</text>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 474 B

apps/mall/public/mock/product-4.svg
+7
View File
@@ -0,0 +1,7 @@
<svg xmlns="http://www.w3.org/2000/svg" width="400" height="400" viewBox="0 0 400 400">
<defs><linearGradient id="g" x1="0" y1="0" x2="1" y2="1">
<stop offset="0" stop-color="#6a1b9a"/><stop offset="1" stop-color="#ab47bc"/>
</linearGradient></defs>
<rect width="400" height="400" fill="url(#g)"/>
<text x="200" y="200" font-family="system-ui,sans-serif" font-size="50" fill="rgba(255,255,255,.9)" text-anchor="middle" dominant-baseline="middle">P4</text>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 474 B

apps/mall/public/mock/product-5.svg
+7
View File
@@ -0,0 +1,7 @@
<svg xmlns="http://www.w3.org/2000/svg" width="400" height="400" viewBox="0 0 400 400">
<defs><linearGradient id="g" x1="0" y1="0" x2="1" y2="1">
<stop offset="0" stop-color="#c77800"/><stop offset="1" stop-color="#ffb300"/>
</linearGradient></defs>
<rect width="400" height="400" fill="url(#g)"/>
<text x="200" y="200" font-family="system-ui,sans-serif" font-size="50" fill="rgba(255,255,255,.9)" text-anchor="middle" dominant-baseline="middle">P5</text>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 474 B

apps/mall/public/mock/product-6.svg
+7
View File
@@ -0,0 +1,7 @@
<svg xmlns="http://www.w3.org/2000/svg" width="400" height="400" viewBox="0 0 400 400">
<defs><linearGradient id="g" x1="0" y1="0" x2="1" y2="1">
<stop offset="0" stop-color="#00838f"/><stop offset="1" stop-color="#26c6da"/>
</linearGradient></defs>
<rect width="400" height="400" fill="url(#g)"/>
<text x="200" y="200" font-family="system-ui,sans-serif" font-size="50" fill="rgba(255,255,255,.9)" text-anchor="middle" dominant-baseline="middle">P6</text>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 474 B

apps/mall/public/mock/product-7.svg
+7
View File
@@ -0,0 +1,7 @@
<svg xmlns="http://www.w3.org/2000/svg" width="400" height="400" viewBox="0 0 400 400">
<defs><linearGradient id="g" x1="0" y1="0" x2="1" y2="1">
<stop offset="0" stop-color="#ad1457"/><stop offset="1" stop-color="#ec407a"/>
</linearGradient></defs>
<rect width="400" height="400" fill="url(#g)"/>
<text x="200" y="200" font-family="system-ui,sans-serif" font-size="50" fill="rgba(255,255,255,.9)" text-anchor="middle" dominant-baseline="middle">P7</text>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 474 B

apps/mall/public/mock/product-8.svg
+7
View File
@@ -0,0 +1,7 @@
<svg xmlns="http://www.w3.org/2000/svg" width="400" height="400" viewBox="0 0 400 400">
<defs><linearGradient id="g" x1="0" y1="0" x2="1" y2="1">
<stop offset="0" stop-color="#ca151e"/><stop offset="1" stop-color="#f0643a"/>
</linearGradient></defs>
<rect width="400" height="400" fill="url(#g)"/>
<text x="200" y="200" font-family="system-ui,sans-serif" font-size="50" fill="rgba(255,255,255,.9)" text-anchor="middle" dominant-baseline="middle">P8</text>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 474 B

apps/mall/public/mock/product-9.svg
+7
View File
@@ -0,0 +1,7 @@
<svg xmlns="http://www.w3.org/2000/svg" width="400" height="400" viewBox="0 0 400 400">
<defs><linearGradient id="g" x1="0" y1="0" x2="1" y2="1">
<stop offset="0" stop-color="#333333"/><stop offset="1" stop-color="#666666"/>
</linearGradient></defs>
<rect width="400" height="400" fill="url(#g)"/>
<text x="200" y="200" font-family="system-ui,sans-serif" font-size="50" fill="rgba(255,255,255,.9)" text-anchor="middle" dominant-baseline="middle">P9</text>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 474 B

apps/mall/public/mock/promo-1.svg
+7
View File
@@ -0,0 +1,7 @@
<svg xmlns="http://www.w3.org/2000/svg" width="312" height="160" viewBox="0 0 312 160">
<defs><linearGradient id="g" x1="0" y1="0" x2="1" y2="1">
<stop offset="0" stop-color="#2e7d32"/><stop offset="1" stop-color="#66bb6a"/>
</linearGradient></defs>
<rect width="312" height="160" fill="url(#g)"/>
<text x="156" y="80" font-family="system-ui,sans-serif" font-size="20" fill="rgba(255,255,255,.9)" text-anchor="middle" dominant-baseline="middle">Promo 1</text>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 478 B

apps/mall/public/mock/promo-2.svg
+7
View File
@@ -0,0 +1,7 @@
<svg xmlns="http://www.w3.org/2000/svg" width="312" height="160" viewBox="0 0 312 160">
<defs><linearGradient id="g" x1="0" y1="0" x2="1" y2="1">
<stop offset="0" stop-color="#6a1b9a"/><stop offset="1" stop-color="#ab47bc"/>
</linearGradient></defs>
<rect width="312" height="160" fill="url(#g)"/>
<text x="156" y="80" font-family="system-ui,sans-serif" font-size="20" fill="rgba(255,255,255,.9)" text-anchor="middle" dominant-baseline="middle">Promo 2</text>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 478 B

apps/mall/public/mock/promo-3.svg
+7
View File
@@ -0,0 +1,7 @@
<svg xmlns="http://www.w3.org/2000/svg" width="312" height="160" viewBox="0 0 312 160">
<defs><linearGradient id="g" x1="0" y1="0" x2="1" y2="1">
<stop offset="0" stop-color="#c77800"/><stop offset="1" stop-color="#ffb300"/>
</linearGradient></defs>
<rect width="312" height="160" fill="url(#g)"/>
<text x="156" y="80" font-family="system-ui,sans-serif" font-size="20" fill="rgba(255,255,255,.9)" text-anchor="middle" dominant-baseline="middle">Promo 3</text>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 478 B

apps/mall/public/mock/store-1.svg
+7
View File
@@ -0,0 +1,7 @@
<svg xmlns="http://www.w3.org/2000/svg" width="120" height="120" viewBox="0 0 120 120">
<defs><linearGradient id="g" x1="0" y1="0" x2="1" y2="1">
<stop offset="0" stop-color="#6a1b9a"/><stop offset="1" stop-color="#ab47bc"/>
</linearGradient></defs>
<rect width="120" height="120" fill="url(#g)"/>
<text x="60" y="60" font-family="system-ui,sans-serif" font-size="15" fill="rgba(255,255,255,.9)" text-anchor="middle" dominant-baseline="middle">S1</text>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 472 B

apps/mall/public/mock/store-2.svg
+7
View File
@@ -0,0 +1,7 @@
<svg xmlns="http://www.w3.org/2000/svg" width="120" height="120" viewBox="0 0 120 120">
<defs><linearGradient id="g" x1="0" y1="0" x2="1" y2="1">
<stop offset="0" stop-color="#c77800"/><stop offset="1" stop-color="#ffb300"/>
</linearGradient></defs>
<rect width="120" height="120" fill="url(#g)"/>
<text x="60" y="60" font-family="system-ui,sans-serif" font-size="15" fill="rgba(255,255,255,.9)" text-anchor="middle" dominant-baseline="middle">S2</text>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 472 B

apps/mall/public/mock/store-3.svg
+7
View File
@@ -0,0 +1,7 @@
<svg xmlns="http://www.w3.org/2000/svg" width="120" height="120" viewBox="0 0 120 120">
<defs><linearGradient id="g" x1="0" y1="0" x2="1" y2="1">
<stop offset="0" stop-color="#00838f"/><stop offset="1" stop-color="#26c6da"/>
</linearGradient></defs>
<rect width="120" height="120" fill="url(#g)"/>
<text x="60" y="60" font-family="system-ui,sans-serif" font-size="15" fill="rgba(255,255,255,.9)" text-anchor="middle" dominant-baseline="middle">S3</text>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 472 B

apps/mall/public/mock/store-4.svg
+7
View File
@@ -0,0 +1,7 @@
<svg xmlns="http://www.w3.org/2000/svg" width="120" height="120" viewBox="0 0 120 120">
<defs><linearGradient id="g" x1="0" y1="0" x2="1" y2="1">
<stop offset="0" stop-color="#ad1457"/><stop offset="1" stop-color="#ec407a"/>
</linearGradient></defs>
<rect width="120" height="120" fill="url(#g)"/>
<text x="60" y="60" font-family="system-ui,sans-serif" font-size="15" fill="rgba(255,255,255,.9)" text-anchor="middle" dominant-baseline="middle">S4</text>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 472 B