💻 代码预览 · 小草待办清单

1<!DOCTYPE html><html lang="zh-CN"><head><meta charset="UTF-8"><meta name="viewport" content="width=device-width,initial-scale=1,maximum-scale=1,user-scalable=no"><title>小草待办清单</title><link rel="stylesheet" href="style.css"></head><body>
2<div class="topbar">
3  <div class="tb-date">8月12日 星期三 · 17:20</div>
4  <div class="tb-greet">下午好，小凡 ☀️</div>
5</div>
6<div class="today-hero">
7  <div class="th-ring" id="th-ring"><b>0/0<small>已完成</small></b></div>
8  <div class="th-info" id="th-info"></div>
9</div>
10<div class="quick-add" onclick="toast('快速添加：语音/文本智能识别时间')">
11  <span class="qa-plus">＋</span><span class="qa-text">快速添加待办，智能识别时间…</span>
12</div>
13<div class="quick-grid">
14  <a href="tasks.html"><span class="qicon">📝</span>我的清单</a>
15  <a href="calendar.html"><span class="qicon">📅</span>日历视图</a>
16  <a href="focus.html"><span class="qicon">🍅</span>番茄专注</a>
17  <a href="habits.html"><span class="qicon">✅</span>习惯打卡</a>
18</div>
19<div class="section-title">今日待办 <span>点击完成</span></div>
20<div id="task-list"></div>
21<div class="section-title">四象限 <span>先做重要的事</span></div>
22<div class="quad-grid" id="quad-grid"></div>
23<div style="height:80px"></div>
24<div class="tabbar">
25  <a class="active" href="index.html"><span class="icon">🏠</span>今日</a>
26  <a href="tasks.html"><span class="icon">📝</span>清单</a>
27  <a href="calendar.html"><span class="icon">📅</span>日历</a>
28  <a href="focus.html"><span class="icon">🍅</span>专注</a>
29  <a href="mine.html"><span class="icon">👤</span>我的</a>
30</div>
31<script src="data.js"></script><script src="app.js"></script>
32<script>
33renderHome();
34$('#quad-grid').innerHTML=QUADS.map(q=>`<div class="quad-item" style="background:${q.color};border:1px solid ${q.border}"><b>${q.q}</b>${q.tasks.join(' / ')}<br><small style="color:#8b94ad">${q.n}项待办</small></div>`).join('');
35</script>
36</body></html>