2026-10-23 17:25:21 +08:00
|
|
|
|
{# trade-pro standard — cms 通用内容页设计移植（Task 10h，最后一个常规布局）。
|
|
|
|
|
|
standard 是所有非专属 kind 页面的兜底模板（应用/支持/隐私政策/自定义页等），
|
|
|
|
|
|
设计源 = cms 的两个通用内容页 D:/project/cms/runtimes/astro-site-runtime/
|
|
|
|
|
|
src/pages/[locale]/applications.astro 与 support.astro（像素基准
|
|
|
|
|
|
dist/hesupipe/en/applications/ 与 /en/support/）。
|
|
|
|
|
|
两页共性模板形态（standard 的设计本质）：
|
|
|
|
|
|
PageHero（眉题 + h1 + 导语 + 页内锚点按钮 + 封面底图）→ 内容区。
|
|
|
|
|
|
与 cms 的结构决策：
|
|
|
|
|
|
1. 内容区的「布局 vs 内容」判定：applications 的应用卡网格（cols-3）、
|
|
|
|
|
|
FeatureGrid 优势带、projects 卡带，与 support 的锚点导航条 / 文档卡
|
|
|
|
|
|
（含 PDF 体积等假数据位）/ FAQ 折叠，全是 HESU 词典驱动的站点内容
|
|
|
|
|
|
而非布局——跨站即假数据，不移植。平台 standard 页内容 = 单一富文本
|
|
|
|
|
|
body：小节结构由正文自身的 h2/h3/图片/表格承担（10g 案例详情同
|
|
|
|
|
|
决策），排版层双挂 sf-tp-article-body（10d；cms about-body 与全站
|
|
|
|
|
|
rich-body 同构）。正文区块头沿用 cms about-body 的 SectionHead
|
|
|
|
|
|
title={heroTitle} 形态（眉题 + 页题 h2 复述，10e 同款）。
|
|
|
|
|
|
2. body 为空 → 正文区块整段隐藏（cms isRichAbout ? ... : null 同款），
|
|
|
|
|
|
hero 锚点按钮随之隐藏（无正文即无锚点目标，不留死锚点）；封面/摘要
|
|
|
|
|
|
为空则底图/导语各自隐藏，页面退化为纯 hero 最小形态。
|
|
|
|
|
|
3. 两页 PageHero 均无面包屑（crumbs 仅 cms 详情页经 slot 传入），但平台
|
|
|
|
|
|
页面级模板约定补面包屑 Home › 标题（10e/10f 同款平台化决策；cms
|
|
|
|
|
|
landing 页的锚点导航条不移植——sanitize 剥离正文 id，无锚点目标）。
|
|
|
|
|
|
4. hero 按钮是 cms PageHero 的固有形态（applications「Explore Products
|
|
|
|
|
|
→ #main」/ support「Contact Technical Support → #technical」），
|
|
|
|
|
|
平台锚到正文区块 #tp-standard-body（构建器豁免 # 锚点链接），
|
|
|
|
|
|
文案取通用词（页面专属词典文案不移植）。
|
|
|
|
|
|
5. support 页尾的 Cta 横幅由 pro.html 的 .pro-end-cta 全局承担
|
|
|
|
|
|
（10b/10d/10g 同决策）。applications.astro 本身零 scoped CSS——
|
|
|
|
|
|
全部由共享组件构成，本模板同构复用（10c hero / 10b 面包屑 / 10a
|
|
|
|
|
|
section-head / 10d 排版层），无新增样式规则。 #}
|
|
|
|
|
|
<section class="sf-tp-page-hero sf-tp-standard-hero">
|
|
|
|
|
|
{% if safe_image(page.cover) %}<img class="sf-tp-page-hero-bg" src="{{ safe_image(page.cover) }}" alt="" width="1600" height="900" fetchpriority="high" decoding="async">{% endif %}
|
|
|
|
|
|
<div class="sf-tp-page-hero-overlay" aria-hidden="true"></div>
|
|
|
|
|
|
<div class="wrap">
|
|
|
|
|
|
<nav class="sf-tp-breadcrumb" aria-label="Breadcrumb" data-reveal>
|
|
|
|
|
|
<a href="/">Home</a><span class="sf-tp-breadcrumb-current">{{ page.title }}</span>
|
|
|
|
|
|
</nav>
|
|
|
|
|
|
<div class="sf-tp-page-hero-copy" data-reveal style="--reveal-i: 1">
|
|
|
|
|
|
<span class="eyebrow">OVERVIEW</span>
|
|
|
|
|
|
<h1>{{ page.title }}</h1>
|
|
|
|
|
|
{% if page.summary %}<p class="sf-tp-page-hero-lead">{{ page.summary }}</p>{% endif %}
|
|
|
|
|
|
{% if content %}<a class="sf-tp-btn" href="#tp-standard-body">Explore this page {{ icon('arrow-right') }}</a>{% endif %}
|
|
|
|
|
|
</div>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
</section>
|
|
|
|
|
|
{% if content %}
|
|
|
|
|
|
<section class="section sf-tp-standard-body-section" id="tp-standard-body">
|
|
|
|
|
|
<div class="wrap">
|
|
|
|
|
|
<div class="sf-tp-section-head" data-reveal>
|
|
|
|
|
|
<div>
|
|
|
|
|
|
<span class="eyebrow">OVERVIEW</span>
|
|
|
|
|
|
<h2>{{ page.title }}</h2>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
<div class="sf-tp-standard-body sf-tp-article-body" data-reveal style="--reveal-i: 1">{{ body_copy(content, page) }}</div>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
</section>
|
|
|
|
|
|
{% endif %}
|
