- 10단계 변환 프로세스 (PROCESS.md) - 수학 공식 레퍼런스 (MATH.md, gradient_math.py) - CSS 보정 규칙 R1~R16 (RULES.md) - 작업 규율 7개 규칙 (PROCESS-CONTROL.md) - 8개 Figma 프레임 1:1 HTML 변환물 (block-tests/) - 8개 Jinja2 템플릿 staging (templates_staging/) - 변환 완료 도서관 + 디자인 인사이트 (blocks_index.md) - 사용법 가이드 (README.md) Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
65 lines
1.7 KiB
YAML
65 lines
1.7 KiB
YAML
pattern_id: statement-pill-highlight
|
|
category: emphasis
|
|
version: 0.1.0
|
|
provenance:
|
|
source_frame: "51:170 / Frame 1171281207"
|
|
reference_html: ../block-tests/bim-future-statement.html
|
|
reference_render: ../block-tests/_renders/bim-future-statement.png
|
|
|
|
description: |
|
|
단일 line 메시지 banner. pill 모양 (border-radius = height/2). 인라인 highlight span 지원.
|
|
강조 메시지, 결론, 명언, 슬로건에 적합.
|
|
|
|
when:
|
|
relation_type:
|
|
- emphasis-statement
|
|
- conclusion-message
|
|
- slogan
|
|
- quote-emphasis
|
|
content_shape:
|
|
text_length: { min: 5, max: 80 chars }
|
|
has_highlight: optional
|
|
|
|
not_for:
|
|
- multi-line-content
|
|
- list
|
|
- structured-data
|
|
|
|
slots:
|
|
text_segments:
|
|
type: list
|
|
required: true
|
|
min: 1
|
|
item:
|
|
text: { type: string, required: true }
|
|
highlight: { type: boolean, default: false }
|
|
|
|
bg_image: { type: image, required: false, description: "배경 PNG (없으면 bg_color 단색)" }
|
|
bg_color: { type: color, default: "#3a4a2f" }
|
|
text_color: { type: color, default: "#ffffff" }
|
|
highlight_color: { type: color, default: "#fe3" }
|
|
text_shadow_color: { type: color, default: "rgba(0,0,0,0.5)" }
|
|
text_shadow_blur: { type: string, default: "4px" }
|
|
font_size: { type: string, default: "1.6rem" }
|
|
font_weight: { type: number, default: 700 }
|
|
|
|
tokens:
|
|
block_w: { default: 1280, unit: px }
|
|
block_h: { default: 60, unit: px }
|
|
slide_h: { default: 720, unit: px }
|
|
|
|
min_size_px:
|
|
width: 480
|
|
height: 40
|
|
max_size_px:
|
|
width: 1920
|
|
height: 120
|
|
|
|
sub_patterns: []
|
|
priority: 30
|
|
|
|
diff_from_reference:
|
|
- "bg_image optional → bg_color fallback"
|
|
- "text_segments list → 임의 개수의 highlight span 지원"
|
|
- "font/색상/그림자 모두 CSS 변수"
|