| <!doctype html> |
| <html lang="zh-CN"> |
| <head> |
| <meta charset="utf-8"/> |
| <meta name="viewport" content="width=device-width, initial-scale=1"/> |
| <title>小镇角落小店 · Quiet Town Corner Shop</title> |
| <style> |
| :root { |
| --bg: #f4efe8; |
| --ink: #3b2f2a; |
| --muted: #6b5a52; |
| --card: #fffdf9; |
| --accent: #c48b6a; |
| --line: #e2d4c6; |
| } |
| * { box-sizing: border-box; } |
| body { |
| margin: 0; |
| font-family: "Segoe UI", system-ui, -apple-system, sans-serif; |
| background: |
| radial-gradient(circle at 10% 0%, #f9e7d4 0%, transparent 40%), |
| radial-gradient(circle at 90% 20%, #e8f0e6 0%, transparent 35%), |
| var(--bg); |
| color: var(--ink); |
| line-height: 1.6; |
| min-height: 100vh; |
| } |
| main { |
| max-width: 880px; |
| margin: 0 auto; |
| padding: 3rem 1.25rem 4rem; |
| } |
| .badge { |
| display: inline-block; |
| font-size: .78rem; |
| letter-spacing: .04em; |
| text-transform: uppercase; |
| color: var(--accent); |
| border: 1px solid var(--line); |
| background: var(--card); |
| border-radius: 999px; |
| padding: .25rem .7rem; |
| margin-bottom: 1rem; |
| } |
| h1 { |
| font-weight: 650; |
| font-size: clamp(1.8rem, 4vw, 2.4rem); |
| margin: 0 0 .5rem; |
| letter-spacing: -.02em; |
| } |
| .sub { |
| color: var(--muted); |
| font-size: 1.05rem; |
| margin: 0 0 1.75rem; |
| max-width: 40rem; |
| } |
| .hero-card { |
| background: var(--card); |
| border: 1px solid var(--line); |
| border-radius: 18px; |
| padding: 1.35rem 1.4rem; |
| box-shadow: 0 10px 30px #0000000d; |
| margin-bottom: 1.5rem; |
| } |
| .actions { |
| display: flex; |
| flex-wrap: wrap; |
| gap: .7rem; |
| margin-top: 1.1rem; |
| } |
| a.btn { |
| display: inline-flex; |
| align-items: center; |
| gap: .4rem; |
| text-decoration: none; |
| border-radius: 999px; |
| padding: .55rem 1.05rem; |
| font-weight: 600; |
| border: 1px solid var(--line); |
| color: var(--ink); |
| background: #fff; |
| transition: transform .12s ease, box-shadow .12s ease; |
| } |
| a.btn:hover { |
| transform: translateY(-1px); |
| box-shadow: 0 6px 16px #00000012; |
| } |
| a.btn.primary { |
| background: linear-gradient(135deg, #d6a488, #c48b6a); |
| border-color: transparent; |
| color: #fff; |
| } |
| .grid { |
| display: grid; |
| grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); |
| gap: .9rem; |
| margin-top: 1.5rem; |
| } |
| .tile { |
| background: var(--card); |
| border: 1px solid var(--line); |
| border-radius: 14px; |
| padding: 1rem 1.05rem; |
| } |
| .tile h2 { |
| margin: 0 0 .35rem; |
| font-size: 1rem; |
| } |
| .tile p { |
| margin: 0; |
| color: var(--muted); |
| font-size: .92rem; |
| } |
| code, kbd { |
| font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; |
| font-size: .86em; |
| background: #efe6dc; |
| padding: .1rem .35rem; |
| border-radius: 5px; |
| } |
| footer { |
| margin-top: 2.5rem; |
| color: var(--muted); |
| font-size: .88rem; |
| } |
| footer a { color: var(--accent); } |
| </style> |
| </head> |
| <body> |
| <main> |
| <span class="badge">毕业设计 · Graduation Project</span> |
| <h1>小镇角落小店</h1> |
| <p class="sub"> |
| 温柔的花店经营模拟。本站由 GitHub Actions 部署到 GitHub Pages， |
| 也可前往 Hugging Face 在线试玩完整前端。 |
| </p> |
|
|
| <section class="hero-card"> |
| <strong>演示入口</strong> |
| <p style="margin:.4rem 0 0;color:var(--muted)"> |
| 运行时为 Python 3 纯逻辑模拟（本环境无 Godot 可执行文件）。网页端提供静态美术画廊与项目导航。 |
| </p> |
| <div class="actions"> |
| <a class="btn primary" href="https://seachen-docker000.hf.space/">在线游玩 Demo</a> |
| <a class="btn" href="web/gallery.html">打开美术画廊</a> |
| <a class="btn" href="https://github.com/xiaoqianran/web005">GitHub 仓库</a> |
| </div> |
| </section> |
|
|
| <div class="grid"> |
| <article class="tile"> |
| <h2>模拟核心</h2> |
| <p>日循环、招客、经营、氛围、熟客关系等逻辑在 <code>game/sim/</code>。</p> |
| </article> |
| <article class="tile"> |
| <h2>内容驱动</h2> |
| <p>商品、NPC、对话与规则位于 <code>content/</code> JSON 内容库。</p> |
| </article> |
| <article class="tile"> |
| <h2>美术资源</h2> |
| <p>Imagine 生成的店铺 / 商品 / 家具 / 角色 / UI，见画廊页。</p> |
| </article> |
| <article class="tile"> |
| <h2>本地运行</h2> |
| <p><code>python3 -m game</code> · 完整一天：<code>python3 -m game.cli day</code></p> |
| </article> |
| </div> |
|
|
| <footer> |
| 由 GitHub Actions 自动部署 · |
| <a href="web/gallery.html">gallery</a> · |
| 源码 <a href="https://github.com/xiaoqianran/web005">xiaoqianran/web005</a> |
| </footer> |
| </main> |
| </body> |
| </html> |
|
|
