tianya-shentie/index.html

67 lines
2.6 KiB
HTML
Raw Permalink Normal View History

<!DOCTYPE html>
<html lang="zh-CN">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>天涯神贴 · 经典合集</title>
<meta name="description" content="天涯社区经典神贴合集:KK大神房价预言、缠中说禅教你炒股票、莲蓬鬼话、煮酒论史等,一个静态怀旧收藏站。" />
<link rel="preconnect" href="https://fonts.googleapis.com" />
<link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Noto+Serif+SC:wght@400;600;700;900&display=swap" />
<link rel="stylesheet" href="style.css" />
</head>
<body>
<!-- ====== 顶栏 ====== -->
<header class="topbar">
<div class="brand">
<span class="seal"></span>
<span>天涯神贴 <small>· 经典合集</small></span>
</div>
<div class="search-wrap">
<span class="icon">🔍</span>
<input id="search" type="search" placeholder="搜索标题 / 作者 / 标签…" autocomplete="off" />
</div>
<div class="topbar-actions">
<select id="sort" class="sort-select" title="排序方式">
<option value="hot">热度优先</option>
<option value="year-desc">年代新→旧</option>
<option value="year-asc">年代旧→新</option>
</select>
<button id="onlyFav" class="fav-toggle" title="只看收藏">★ 收藏 <span id="favCount">0</span></button>
</div>
</header>
<!-- ====== Hero ====== -->
<section class="hero">
<h1>天涯 · 神贴</h1>
<p class="sub">那些年,我们在天涯论坛熬夜追过的帖子。<br />金融、缠论、鬼话、煮酒——这里收藏着中文互联网的旧时光。</p>
<p class="meta">共收录 32 篇 · 致敬天涯社区(1999—2023)</p>
</section>
<!-- ====== 工具栏 ====== -->
<div class="toolbar">
<span class="label">板块:</span>
<div id="sections" class="sections" style="display:contents"></div>
<span class="count-line" id="count">— 篇</span>
</div>
<!-- ====== 卡片列表 ====== -->
<main class="grid" id="cards"></main>
<!-- ====== 页脚 ====== -->
<footer class="footer">
<p>本站为静态怀旧收藏页,内容整理自公开网络资料,仅供学习交流。</p>
<p class="dim">天涯社区已于 2023 年关停,愿这些文字得以留存。 © 天涯神贴收藏站</p>
</footer>
<!-- ====== 返回顶部 ====== -->
<button id="backTop" class="back-top" title="回到顶部" aria-label="回到顶部"></button>
<!-- ====== 脚本 ====== -->
<script src="data.js"></script>
<script src="app.js"></script>
</body>
</html>