SuperAPI AI 工具集

studio-css-reset

前端与建站

查看项目

更新于 10-16 06:52

技能介绍

用途:该技能面向 Remotion Studio UI 的修改场景。Studio 会对 UI 元素应用范围较广的 CSS reset,因此每个新增的嵌套元素都应视为已被重置样式,除非所在组件为其显式定义了视觉样式。

主要能力与注意点:修改 Studio UI 时,不要依赖父级按钮或容器来呈现子元素的可见文字样式,应为包裹用的 span 或 div 显式指定 fontFamily、fontSize、lineHeight,以及 color 或 color: 'inherit'。在引入“图标+文本”标记时,需保持紧凑行布局:使用固定图标尺寸、flexShrink: 0,并为标签设置明确的截断样式,如 minWidth、overflow、textOverflow、whiteSpace。新增包裹元素后要重新检查悬停与非悬停状态,标签不应变大、改变行高、丢失省略号或意外变色。若某种行模式反复出现同类 reset 问题,优先一次性修复共享的 Studio 组件。

使用方式(必要命令保持原样):修改 Studio 代码后,至少运行聚焦的 Studio 检查: bunx turbo run make --filter='@remotion/studio' bunx turbo run lint test --filter='@remotion/studio'

适用场景:编辑 packages/studio UI,尤其是在新增包裹元素、图标加标签结构或需要维持紧凑行布局时。

限制:资料未提供其他安装方式、支持平台、版本要求或收费信息。