| 1 | <!DOCTYPE html> |
| 2 | <html lang="zh-CN"><head><meta charset="utf-8"><title>Gantt</title> |
| 3 | <link rel="stylesheet" href="../../assets/fonts.css"> |
| 4 | <link rel="stylesheet" href="../../assets/base.css"> |
| 5 | <link rel="stylesheet" id="theme-link" href="../../assets/themes/minimal-white.css"> |
| 6 | <link rel="stylesheet" href="../../assets/animations/animations.css"> |
| 7 | <style> |
| 8 | .gantt{margin-top:24px;background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);padding:24px} |
| 9 | .gantt .hd{display:grid;grid-template-columns:200px repeat(12,1fr);gap:4px;font-size:12px;color:var(--text-3);text-transform:uppercase;letter-spacing:.08em;margin-bottom:10px;padding-bottom:10px;border-bottom:1px solid var(--border)} |
| 10 | .gantt .row{display:grid;grid-template-columns:200px repeat(12,1fr);gap:4px;align-items:center;height:40px} |
| 11 | .gantt .lbl{font-size:14px;font-weight:500} |
| 12 | .gantt .cells{grid-column:2/-1;position:relative;height:28px;background:linear-gradient(90deg,var(--surface-2) 1px,transparent 1px) 0 0/calc(100%/12) 100%} |
| 13 | .gantt .bar{position:absolute;top:4px;height:20px;border-radius:6px;background:var(--grad);display:flex;align-items:center;padding:0 10px;font-size:11px;color:#fff;font-weight:600;box-shadow:var(--shadow)} |
| 14 | </style> |
| 15 | </head><body class="single"> |
| 16 | <div class="deck"><section class="slide is-active" data-title="Gantt"> |
| 17 | <p class="kicker">Plan · Q2 甘特图</p> |
| 18 | <h2 class="h2">四个月,五条线并行</h2> |
| 19 | <div class="gantt"> |
| 20 | <div class="hd"><div>任务</div><div>W1</div><div>W2</div><div>W3</div><div>W4</div><div>W5</div><div>W6</div><div>W7</div><div>W8</div><div>W9</div><div>W10</div><div>W11</div><div>W12</div></div> |
| 21 | <div class="row"><div class="lbl">主题系统 (tokens)</div><div class="cells"><div class="bar" style="left:0;width:25%">tokens + 24 themes</div></div></div> |
| 22 | <div class="row"><div class="lbl">layouts 目录</div><div class="cells"><div class="bar" style="left:17%;width:33%">30 个单页模板</div></div></div> |
| 23 | <div class="row"><div class="lbl">动画系统</div><div class="cells"><div class="bar" style="left:42%;width:25%">25 个命名动效</div></div></div> |
| 24 | <div class="row"><div class="lbl">渲染 / CI</div><div class="cells"><div class="bar" style="left:58%;width:25%">render.sh</div></div></div> |
| 25 | <div class="row"><div class="lbl">发布 & 文档</div><div class="cells"><div class="bar" style="left:75%;width:25%">v1.0</div></div></div> |
| 26 | </div> |
| 27 | </section></div> |
| 28 | <script src="../../assets/runtime.js"></script> |
| 29 | </body></html> |
| 30 |