Export finished dataset-march.csv · 2 min ago Open
Token rotated All integrations reconnected Open
Prompt archived Moved to the 2025 folder Open
怎么向 AI 描述它 复制 Prompt
基础 修改 进阶
Create a list component.
STYLE
- rows 48px tall, 12px radius on hover, 8px horizontal padding
- primary line 14px #1D1D1F, meta line 12px #6E6E73 below it
- one 1px divider between rows, none after the last
- the trailing action stays hidden until row hover
STATES
- default, hover #F5F5F7, selected #EAF2FE with a 2px accent bar, empty
TECHNICAL
- React
- Tailwind CSS
- shadcn/ui
Make the existing list rows selectable.
Use:
- selected rows take #EAF2FE with a 2px accent bar on the left
- keyboard: up and down move the selection, Enter confirms
- keep row height, dividers and hover unchanged
Only add selection.
Create a list component, replacing the existing one.
Requirements:
- rows 48px, 8px padding, primary 14px and meta 12px text
- a 1px divider between rows, none after the last
- trailing action hidden until hover or keyboard focus
- selected state #EAF2FE with a 2px accent bar on the leading edge
- an empty state with one line of text and one action
Keep the surrounding card layout unchanged.
MOTION
- Row hover: background only, 100ms. No lift, no shadow.
- New rows: stagger ~100ms only when three or more arrive at once.
- Reorder: FLIP at 200ms ease-out so items move instead of jumping.
- prefers-reduced-motion: no stagger.
修改类 Prompt 只动目标，不碰页面其余部分。
列表是什么？ 列表是一组形状一致的行。点名行高、每行放什么，以及行与行如何分隔。
变体 点击属性即可在预览中高亮。
基础 在 Prompt 里写明这个类型。
带元信息 在 Prompt 里写明这个类型。
带操作 在 Prompt 里写明这个类型。
可选中 在 Prompt 里写明这个类型。
行高 给具体值，不要只给感觉词。
前置元素 给具体值，不要只给感觉词。
主行 给具体值，不要只给感觉词。
元信息 给具体值，不要只给感觉词。
分隔线 给具体值，不要只给感觉词。
操作 给具体值，不要只给感觉词。 状态 点击属性即可在预览中高亮。
默认 输入或报错前字段的默认有效状态。
悬停 指针悬停时的反馈：抬起、变色或边框变化。写清楚，别让模型自己猜。
选中 当前选中的值或标签，需与其余项明显区分。
空 无数据时的状态，需给出提示与下一步操作。 结构解剖 这些是 Prompt 里应该点名的部件。
01 行 02 前置元素 03 主文本 04 元信息 05 尾随操作 什么时候别用 每项都有图片和长正文——改用卡片 需要横向对比——改用表格 不足三项 One action per row, revealed on hover — a list with three visible buttons per row has stopped being a list.
复制 Prompt Create a list component.
STYLE
- rows 48px tall, 12px radius on hover, 8px horizontal padding
- primary line 14px #1D1D1F, meta line 12px #6E6E73 below it
- one 1px divider between rows, none after the last
- the trailing action stays hidden until row hover
STATES
- default, hover #F5F5F7, selected #EAF2FE with a 2px accent bar, empty
TECHNICAL
- React
- Tailwind CSS
- shadcn/ui