返回配方目录
Vertical Timeline

垂直时间线布局组件配方

font-medium inline-flex items-center gap-2 transition-colors duration-200 bg-blue-500 text-white rounded-lg hover:bg-blue-600 active:bg-blue-700
button

按钮

Subtle inline button for timeline node actions

基础骨架
font-medium inline-flex items-center gap-2 transition-colors duration-200
变体
主要、次要、轮廓
状态
hover、active、disabled
card

卡片

Timeline node card with complete border and connector-ready positioning

基础骨架
bg-white rounded-xl border border-zinc-100 transition-shadow duration-200
变体
默认、高亮、柔和
状态
hover
input

输入框

Clean bordered input for timeline date filtering

基础骨架
w-full bg-white border border-zinc-200 rounded-lg text-slate-900 placeholder:text-zinc-400 focus:outline-none transition-all duration-200
变体
默认、填充
状态
focus、disabled