SuperAPI AI 工具集

hyperframes-slide-work-quote

前端与建站

查看项目

更新于 10-15 20:10

技能介绍

用途:这是 HyperFrames 组合(composition)中专用于 quote 幻灯片(引语页)的技能,用 HTML + GSAP 设计或修改居中排版的大字引语场景,适用于强调核心信息、展示引语/名言/用户反馈,或在演示节奏中停顿制造节奏感。

主要能力:提供引语页的 HTML 结构(scene clip quote 容器,含 eyebrow 类别行、quote-mark 大引号、quote-body 引语正文、quote-attrib 出处)、对应 CSS 要点(场景居中:justify-content: center、align-items: center、text-align: center;大引号 200–240px、weight 900、accent 色、opacity 0.35、line-height 0.7;正文 72–96px、weight 600–700、line-height 1.35、max-width 1500px、word-break: keep-all;em 改为非斜体并用渐变文字裁切或 accent 色;出处 28–36px、weight 500、dim 色、letter-spacing 2–4px、margin-top 40–48px),以及 GSAP 入场动画(eyebrow、quote-mark 用 back.out、quote-body 用 expo.out 上移、quote-attrib 依次淡入),并给出 Markdown 检测规则(以 "" 开头的行视为引语,— 或 -- 开头的行视为出处,可选)。

使用方式:按技能给出的类名与选择器编写场景元素,并在时间轴中以指定的 start 偏移与缓动注册动画;引语保持 1–2 行,可无出处,不混入项目符号或标签,过长时只摘取核心。作为组合最后一个场景时允许 fade-out,作为中间场景则禁止退出动画,由下一场景重叠形成过渡。

限制:资料未说明该技能的安装命令、依赖版本、支持的框架范围、收费方式与效果保证,这些暂未提供。