feat: refactor Product page to match prototype design
Redesigned ProductCard and Product page based on original prototype: ProductCard Component: - Added gradient background matching prototype style - Copied all SVG icons from prototype (US flags, HK flag, etc.) - Implemented proper icon display with white background container - Added category color variants (blue, green, purple) - Risk level indicators with accurate colors - Styled progress bar matching prototype - Proper spacing and typography from CSS Visual Elements: - Radial gradient backgrounds on cards - Glass-morphism effect with transparency - Shadow and border effects from prototype - Icon container with white background and shadow ring - Category badges with colored backgrounds Assets Added: - frame-9230.svg, frame-9231.svg (US flag icons) - hk0.svg (HK flag icon) - chart-square1.svg - All component SVG files from prototype - View toggle icons Styling: - Followed prototype's style.css specifications - Maintained exact color values and gradients - Proper border radius and spacing - Typography matching prototype Co-Authored-By: Claude Sonnet 4.5 <noreply@anthropic.com>
This commit is contained in:
5
public/vuesax-linear-favorite-chart1.svg
Normal file
5
public/vuesax-linear-favorite-chart1.svg
Normal file
@@ -0,0 +1,5 @@
|
||||
<svg width="22" height="22" viewBox="0 0 22 22" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M20.1668 11.9168V8.25016C20.1668 3.66683 18.3335 1.8335 13.7502 1.8335H8.25016C3.66683 1.8335 1.8335 3.66683 1.8335 8.25016V13.7502C1.8335 18.3335 3.66683 20.1668 8.25016 20.1668H11.9168" stroke="#9CA1AF" stroke-width="1.83" stroke-linecap="round" stroke-linejoin="round"/>
|
||||
<path d="M6.71924 13.2823L8.90091 10.4498C9.21258 10.0465 9.79008 9.97312 10.1934 10.2848L11.8709 11.6048C12.2743 11.9165 12.8517 11.8431 13.1634 11.449L15.2809 8.71729" stroke="#9CA1AF" stroke-width="1.83" stroke-linecap="round" stroke-linejoin="round"/>
|
||||
<path d="M18.1131 15.0243C18.2415 15.281 18.5623 15.5193 18.8464 15.5743L19.1948 15.6293C20.2398 15.8035 20.4873 16.5735 19.7356 17.3343L19.4148 17.6551C19.2039 17.8751 19.0848 18.2968 19.149 18.5901L19.1948 18.7826C19.479 20.0476 18.8098 20.5335 17.7098 19.8735L17.4714 19.736C17.1873 19.571 16.729 19.571 16.4448 19.736L16.2064 19.8735C15.0973 20.5426 14.4281 20.0476 14.7214 18.7826L14.7673 18.5901C14.8314 18.2968 14.7123 17.8751 14.5015 17.6551L14.1806 17.3343C13.429 16.5735 13.6764 15.8035 14.7214 15.6293L15.0698 15.5743C15.3448 15.5285 15.6748 15.281 15.8031 15.0243L16.0598 14.5018C16.5548 13.5026 17.3615 13.5026 17.8565 14.5018L18.1131 15.0243Z" stroke="#9CA1AF" stroke-width="1.83" stroke-linecap="round" stroke-linejoin="round"/>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 1.4 KiB |
Reference in New Issue
Block a user