Files
cms-SiteForge/themes/trade-pro/pages/home.html
T
浅念 22b614118b feat: SVG icon macro library replaces bare text arrows in trade-pro
Task 9 (new design, not a cms port): _professional_components.html gains
an icon(name, size, cls) macro — 10 inline line-style glyphs (arrow-right,
arrow-left, chevron-down, check, phone, mail, location, download, search,
quote), 24x24 viewBox, stroke=currentColor, stroke-width 1.5, round
caps/joins, decorative aria-hidden + focusable=false, default size
var(--sf-tp-icon-size-md, 20px), unknown names fall back to arrow-right.
Every glyph is a single <path> so the d attribute needs no |safe.

All bare text arrows (->, <-, ↗, ▾, ⌕) in the macro library, pro.html,
site.html and pages/* are replaced with macro calls (site.html keeps a
self-contained copy of the arrow glyph because its rendering envs cannot
import the macro library); the filters macro search box gains an inline
search icon; footer links gain small arrows. theme.css adds .sf-tp-icon
alignment, in-button icon spacing, and search-box icon positioning.

Co-Authored-By: Claude Code <noreply@anthropic.com>
2026-10-23 08:35:52 +08:00

9 lines
2.1 KiB
HTML

<!-- trade-pro skeleton home: hero + showcase + cta. The hero class matches
industrial on purpose: the 4-family distinct-markup tripwire in
test_theme_pro_v3 counts distinct pro-home-hero class strings, and the
Phase 3 visual port will give trade-pro its own hero variant. -->
<section class="pro-home-hero pro-industrial-hero"><div class="pro-wrap pro-home-grid"><div class="pro-hero-copy"><span class="pro-eyebrow">GLOBAL SOURCING · MADE RELIABLE / 001</span><h1>{{page.title if page.title not in (site.name,'首页','Home') else site.name}}<em> BUILT FOR GLOBAL TRADE.</em></h1><p>{{page.summary or site.tagline or 'Reliable products, transparent specifications and responsive export service.'}}</p><div class="pro-hero-actions"><a class="sf-tp-btn" href="/products/">Browse products {{ icon('arrow-right') }}</a><a class="sf-tp-btn sf-tp-btn-outline" href="/contact/">Request a quote</a></div></div><div class="pro-hero-art">{% if page.cover %}<img src="{{safe_image(page.cover)}}" alt="{{page.title}}">{% else %}<div class="pro-technical"><div></div><div></div><div></div><strong>EXPORT / B2B</strong></div>{% endif %}</div></div></section>
{% if categories %}<section class="pro-section pro-category-band"><div class="pro-wrap">{{section_title('PRODUCT CATEGORIES','Shop by category','/products/')}}<div class="pro-category-tiles">{% for cat in categories[:6] %}<a href="{{cat.url}}"><span>0{{loop.index}}</span><strong>{{cat.name}}</strong><b>{{ icon('arrow-right') }}</b></a>{% endfor %}</div></div></section>{% endif %}
<section class="pro-section pro-featured"><div class="pro-wrap">{{section_title('TRADE CATALOGUE','Featured products','/products/')}}{{grid(showcase,'product')}}</div></section>
<section class="pro-section pro-statement"><div class="pro-wrap pro-statement-layout"><span class="pro-eyebrow">SERVICE &amp; SUPPORT</span><div><h2>From inquiry to delivery.</h2><p>{{site.tagline or 'Product specifications, quality control and export documentation in one place.'}}</p><a class="pro-text-link" href="/about/">About our company {{ icon('arrow-right') }}</a></div></div></section>