16 lines
2.0 KiB
HTML
16 lines
2.0 KiB
HTML
|
<article class="card portrait particle-ring" data-card="particle-ring" data-motion="auto">
|
||
|
|
<h2 class="card-heading" data-text="title">从一句想法，<br>到一件心仪好物</h2>
|
||
|
|
|
||
|
|
<div class="card-stage">
|
||
|
|
<div class="ring-mist"></div><canvas class="ring-canvas" aria-hidden="true"></canvas>
|
||
|
|
<div class="shop-conversation">
|
||
|
|
<p class="shop-message customer" data-text="prompt">周末去海边，想穿得舒服一点。<br>有什么适合我的推荐？</p>
|
||
|
|
<p class="shop-message assistant" data-text="reply">轻盈、好搭，也能应对海风。<br>这两件刚刚好。</p>
|
||
|
|
<div class="shop-products">
|
||
|
|
<div class="shop-product"><div class="garment"><svg viewBox="0 0 100 100" aria-label="海蓝棉质T恤"><path d="M34 15 21 20 8 41 23 50 29 41 29 86Q50 91 71 86L71 41 77 50 92 41 79 20 66 15Q50 26 34 15Z" fill="#096bc7"/><path d="M34 15Q50 35 66 15L63 17Q50 28 37 17Z" fill="#0357a8"/><path d="M30 43 35 39 37 84 30 86Z" fill="#0056aa" opacity=".6"/></svg></div><strong data-text="items.0.name">海岸棉质短袖</strong><span data-text="items.0.detail">海蓝 · M</span><b data-text="items.0.value">¥ 129</b></div>
|
||
|
|
<div class="shop-product"><div class="garment"><svg viewBox="0 0 100 100" aria-label="藏青连帽衫"><path d="M34 15Q50 4 66 15L69 27 81 32 90 82 76 87 69 51 70 90Q50 94 30 90L31 51 24 87 10 82 19 32 31 27Z" fill="#142746"/><path d="M34 15Q28 40 50 43Q72 40 66 15L61 18Q50 12 39 18Z" fill="#0a172d"/><path d="M37 19Q50 34 63 19M50 43v13" fill="none" stroke="#354b6c" stroke-width="2"/><path d="M34 48 37 87 45 88 41 48Z" fill="#2e4261" opacity=".8"/><path d="M36 68Q50 62 64 68L61 80H39Z" fill="#102039"/></svg></div><strong data-text="items.1.name">轻风连帽外套</strong><span data-text="items.1.detail">藏青 · M</span><b data-text="items.1.value">¥ 249</b></div>
|
||
|
|
<div class="shop-cta"><span data-text="action">一起带去海边</span> <span>↗</span></div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</article>
|