29 lines
2.0 KiB
CSS
29 lines
2.0 KiB
CSS
/* Aurora Admin TimelineList 样式 — 对齐 组件7.txt TimelineList：左侧时间线 + 右侧内容，节点状态 完成/进行中/错误 */
|
|
|
|
.aa-timeline { font-family: var(--font-family, -apple-system, "PingFang SC", "Microsoft YaHei", sans-serif); color: #262626; }
|
|
.aa-timeline-item { position: relative; }
|
|
.aa-timeline-node {
|
|
position: absolute; left: 5px; top: 4px; width: 10px; height: 10px; border-radius: 50%;
|
|
background: #fff; border: 2px solid #E8ECF1; box-sizing: border-box; z-index: 1;
|
|
}
|
|
.aa-timeline-line { position: absolute; left: 9px; top: 16px; bottom: -10px; width: 2px; background: #E8ECF1; }
|
|
.aa-timeline-content { padding: 0 0 20px 28px; }
|
|
.aa-timeline-time { font-size: 12px; color: #8C8C8C; }
|
|
.aa-timeline-title { font-size: 14px; font-weight: 500; color: #1F2329; margin-top: 2px; }
|
|
.aa-timeline-desc { font-size: 13px; color: #8C8C8C; margin-top: 4px; line-height: 1.5; }
|
|
|
|
/* 状态：完成 done / 进行中 active / 错误 error / 待处理 pending */
|
|
.aa-timeline-item.is-done > .aa-timeline-node { background: #2F54EB; border-color: #2F54EB; }
|
|
.aa-timeline-item.is-done > .aa-timeline-line { background: #2F54EB; }
|
|
.aa-timeline-item.is-active > .aa-timeline-node { background: #fff; border-color: #2F54EB; box-shadow: 0 0 0 3px rgba(47,84,235,0.2); }
|
|
.aa-timeline-item.is-error > .aa-timeline-node { background: #F5222D; border-color: #F5222D; }
|
|
.aa-timeline-item.is-error > .aa-timeline-line { background: #F5222D; }
|
|
.aa-timeline-item.is-pending > .aa-timeline-node { background: #fff; border-color: #E8ECF1; }
|
|
|
|
/* 水平模式 */
|
|
.aa-timeline.is-horizontal { display: flex; }
|
|
.aa-timeline.is-horizontal > .aa-timeline-item { flex: 1; padding-right: 8px; }
|
|
.aa-timeline.is-horizontal > .aa-timeline-item > .aa-timeline-node { top: 4px; }
|
|
.aa-timeline.is-horizontal > .aa-timeline-item > .aa-timeline-line { left: 15px; top: 9px; bottom: auto; right: 0; width: auto; height: 2px; }
|
|
.aa-timeline.is-horizontal > .aa-timeline-item > .aa-timeline-content { padding: 22px 12px 0 0; }
|