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>
This commit is contained in:
@@ -177,6 +177,37 @@ def test_theme_color_map_covers_trade_pro():
|
||||
{'title': 'Home', 'route': '/'}, [], mode='home')
|
||||
assert '<meta name="theme-color" content="#0b3d91"' in html
|
||||
|
||||
def test_trade_pro_icon_macro_library():
|
||||
# Task 9:_professional_components.html 提供 icon(name, size, cls) 内联 SVG 宏。
|
||||
# 纯服务端输出:无 JS 依赖,装饰性图标 aria-hidden + focusable=false,
|
||||
# stroke=currentColor 随文字颜色走。
|
||||
from app import theme_pro
|
||||
env = theme_pro.env_for('trade-pro')
|
||||
tpl = env.from_string("{% from '_professional_components.html' import icon %}{{ icon('arrow-right') }}")
|
||||
out = tpl.render()
|
||||
assert '<svg' in out and 'aria-hidden="true"' in out and 'currentColor' in out
|
||||
# 未知图标名回退 arrow-right(不抛错),且回退输出与显式 arrow-right 一致
|
||||
tpl2 = env.from_string("{% from '_professional_components.html' import icon %}{{ icon('no-such') }}")
|
||||
fallback = tpl2.render()
|
||||
assert '<svg' in fallback
|
||||
assert fallback == tpl.render()
|
||||
|
||||
def test_trade_pro_templates_have_no_bare_text_arrows():
|
||||
# Task 9:交互元素的箭头必须是 SVG 图标,不得残留裸文本 → / ›。
|
||||
# 判定逻辑:先剔除 Jinja 注释 {# #} 内的说明文字;› 的豁免通道是
|
||||
# 'chevron' 同现(下拉指示语义)——非图标用途(如版权分隔符)可走该
|
||||
# 白名单,当前主题模板应一个裸箭头都没有。
|
||||
from pathlib import Path
|
||||
import re
|
||||
root = Path(__file__).resolve().parent.parent / 'themes' / 'trade-pro'
|
||||
offenders = []
|
||||
for f in root.rglob('*.html'):
|
||||
t = f.read_text(encoding='utf-8')
|
||||
body = re.sub(r'\{#.*?#\}', '', t, flags=re.S)
|
||||
if '→' in body or ('›' in body and 'chevron' not in body):
|
||||
offenders.append(str(f.relative_to(root)))
|
||||
assert offenders == []
|
||||
|
||||
def test_theme_blocks_css_overrides_platform(tmp_path):
|
||||
from app import builder
|
||||
dist = tmp_path / 'assets'; dist.mkdir()
|
||||
|
||||
Reference in New Issue
Block a user