# Footer 实现备份（2026-06-10）

新版 Footer UI 上线前，对当前公共布局方案的完整快照。

## 架构

```
页面 HTML
  └── <div id="footer-container"></div>
  └── <script src="/js/layout.js"></script>
           │
           └── fetch /components/footer.html → 注入 + #current-year 年份
```

- **组件**：`components/footer.html`
- **加载器**：`js/layout.js`（Nav + Footer，`updateCopyrightYear`）
- **样式**：`assets/css/theme.css`（`.footer` 主样式）、`assets/css/index.css`（订阅表单、移动端）
- **背景图**：`assets/images/backgrounds/footer_bg.png`
- **社交图标**：`assets/css/index.css` → `.icon-media-box.*`
- **支付图**：`assets/images/backgrounds/icon/media/payout_logos.png`

## 本目录文件

| 文件 | 说明 |
|------|------|
| `footer.html` | 当前 Footer 组件副本 |
| `layout.js` | 当前 layout 加载器副本（含 Footer 逻辑） |
| `footer-styles-excerpt.css` | 从 theme.css / index.css 摘录的 Footer 相关样式 |
| `page-integration-snippet.html` | 页面接入示例（footer-container + script） |

## 恢复方式

1. 将 `footer.html` 复制回 `components/footer.html`
2. 若 layout 逻辑有变，将 `layout.js` 复制回 `js/layout.js`
3. 样式以线上 `theme.css` / `index.css` 为准；本目录 `footer-styles-excerpt.css` 仅作对照

## 已接入页面（`#footer-container` + `/js/layout.js`）

见 `docs/layout-migration-report.md`。主要包括：`index.html`、`pages/payout.html`、`pages/faq.html` 等 22 个标准布局页。

## 新版更新建议

1. 在 Figma/参考稿确认新结构后，优先改 `components/footer.html`
2. 新样式可写入 `theme.css` / `index.css`，或独立 `assets/css/footer.css` 再在页面引入
3. 若加载方式不变，**无需改**各页面的 `#footer-container` 与 `layout.js` 引用
4. 更新完成后可再建 `footer-backup-YYYYMMDD` 留存本版