Expand chronicle to 300 entries with world data

Add a generator script that produces the entries dataset, dedupe
entries sharing coordinates, and ship world city and country
GeoJSON assets for the globe view.

Make the timeline card spacing derive from entry count, move the
view switcher into the bottom bar, and align card and label fonts
with the timeline titles.
This commit is contained in:
2026-09-19 01:07:41 +08:00
parent 9a1a3685ce
commit 71750e5dad
13 changed files with 2716 additions and 216 deletions
+6 -11
View File
@@ -28,13 +28,6 @@
<p class="subtitle">活页编年史 · The Loose-leaf Chronicle of Civilisation</p>
</header>
<!-- 视图切换 -->
<nav class="hud view-switch" aria-label="视图切换">
<button class="view-btn active" data-view="binder">活页本</button>
<button class="view-btn" data-view="timeline">时间轴</button>
<button class="view-btn" data-view="globe">地理</button>
</nav>
<!-- 底部:导航 -->
<footer class="hud bottom-bar">
<button class="nav-btn" id="btn-prev" title="上一页 (←)">◀</button>
@@ -43,24 +36,26 @@
<span class="page-name" id="page-name">露西 · 南方古猿</span>
</div>
<button class="nav-btn" id="btn-next" title="下一页 (→)">▶</button>
<button class="nav-btn flip-hint" id="btn-flip" title="翻面查看素描">翻面</button>
<div class="view-switch" aria-label="视图切换">
<button class="view-btn active" data-view="binder">活页本</button>
<button class="view-btn" data-view="timeline">时间轴</button>
<button class="view-btn" data-view="globe">地理</button>
</div>
</footer>
<!-- 右侧:登记卡详情 -->
<aside class="hud detail-card" id="detail-card">
<div class="detail-head">
<span class="detail-no" id="detail-no">No.001</span>
<span class="detail-cat" id="detail-cat">人</span>
</div>
<h2 class="detail-name" id="detail-name">露西 · 南方古猿</h2>
<dl class="detail-fields">
<div class="field"><dt>时间</dt><dd id="detail-time">约公元前320万年</dd></div>
<div class="field"><dt>地区</dt><dd id="detail-region">东非 · 埃塞俄比亚</dd></div>
<div class="field"><dt>名称</dt><dd id="detail-name2">露西 · 南方古猿</dd></div>
</dl>
<p class="detail-desc" id="detail-desc"></p>
<div class="detail-sketch">
<canvas id="detail-sketch-canvas" width="560" height="320"></canvas>
<canvas id="detail-sketch-canvas" width="360" height="200"></canvas>
</div>
</aside>