Implement user hero design: real HTML copy, cropped visual, app icon in header

Ariver

2026-06-06 19832fd5cf823a45b29e5dc8ec8370c8c9e9c292

 docs/index.html

@@ -4,8 +4,8 @@
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <title>TagLauncher — 标签化 Mac 应用启动器</title>
  <meta name="description" content="TagLauncher：用标签管理 Mac 应用，可滚动网格、多标签归类、应用备忘、布局备份。比 Launchpad 更适合应用很多的用户。">
  <meta property="og:image" content="https://shanghai3168.github.io/taglauncher/assets/hero-shot-grid.jpg">
  <meta name="description" content="在全球，这可能是Mac最好用的应用启动台。不用怀念 macOS 26 Tahoe 上消失的 Launchpad，TagLauncher 用标签管理 Mac 应用。">
  <meta property="og:image" content="https://shanghai3168.github.io/taglauncher/assets/hero-visual.jpg">
  <link rel="stylesheet" href="styles.css">
  <link rel="alternate" hreflang="en" href="index-en.html">
  <link rel="alternate" hreflang="zh-Hans" href="index.html">
@@ -34,32 +34,18 @@
    <div class="layout hero__split">
      <div class="hero__copy">
        <h1 class="hero__headline">在全球，这可能是Mac最好用的应用启动台</h1>
        <p class="hero__lead">不用怀念 macOS 26 Tahoe 上消失的 Launchpad（启动台），因为它一直都不好用，从来就没好用过</p>
        <p class="hero__lead">不用怀念 macOS 26 Tahoe 上消失的 Launchpad（启动台），因为他从来都没真的好用过，他从来就勉强可以用</p>
      </div>

      <div class="hero__visual">
        <div class="hero__stack">
          <div class="hero-stack-layer hero-stack-layer--far" aria-hidden="true">
            <div class="hero-stack-layer__chrome"><span></span><span></span><span></span></div>
            <div class="hero-stack-layer__body"></div>
          </div>
          <div class="hero-stack-layer hero-stack-layer--near" aria-hidden="true">
            <div class="hero-stack-layer__chrome"><span></span><span></span><span></span></div>
            <div class="hero-stack-layer__body"></div>
          </div>
          <figure class="hero-window">
            <div class="hero-window__chrome">
              <span></span><span></span><span></span>
            </div>
            <div class="hero-window__screen">
              <img src="assets/hero-shot-grid.jpg" alt="TagLauncher 应用网格界面" width="1600" height="1040" fetchpriority="high" decoding="async">
            </div>
            <div class="hero-window__reflection" aria-hidden="true">
              <img src="assets/hero-shot-grid.jpg" alt="" width="1600" height="1040">
            </div>
          </figure>
        </div>
      </div>
      <figure class="hero__visual">
        <img
          src="assets/hero-visual.jpg"
          alt="TagLauncher 应用网格界面：彩色标签分类与可滚动应用图标"
          width="553"
          height="619"
          fetchpriority="high"
          decoding="async">
      </figure>
    </div>
  </section>