大道至简。
Simple Homepage 是一个为个人而生的静态主页生成器：用必要的信息，清晰地介绍你、连接你的站点与项目。它不堆砌天气、时钟或无关组件，把注意力留给内容本身。
页面以黑、白、灰为基底，仅保留一个可配置的强调色；支持深浅色模式、不同屏幕宽度与移动端阅读。项目使用 Vite 构建，npm run build 后得到可直接部署到任意静态服务器的 dist/。
- 少而明确：个人介绍、站点、项目与联系方式各司其职。
- 克制但不呆板：通过轻量过渡、打字机一言与自然展开的列表保留一点灵性。
- 内容优先：视口充裕时尽量一屏呈现；空间有限时自然滚动或收纳，不以裁切换取“整齐”。
- 开放配置：姓名、SEO、头像、本地资源、图标、备案信息与主题色都由
site.config.js定义。
npm install
npm run dev
npm run build构建完成后，上传 dist/ 内的全部文件到任意静态托管服务即可。修改 site.config.js 即可替换页面内容；它是通用字段示例，组件不依赖示例人物资料。
详细字段说明、图片配置、图标扩展和部署注意事项请阅读 配置指南。
siteName：浏览器标签页与站点名称；未填写时使用姓名，不会强制添加产品名。seo：页面标题、描述、关键词、站点 URL 与分享图。构建时会写入 HTML 的 SEO 与 Open Graph 元信息，建议填写完整。profile：姓名、账号、头像与简介。avatar可为单个 URL，也可分别填写light、dark两个 URL。quotes：一言列表；页面会以打字机效果轮播，用户偏好减少动态效果时展示第一条。sites、projects：紧凑链接列表，建议分别不超过 4、3 项，以保持一屏。socials：根据当前宽度自动完整展示或收纳到“更多”；不再依赖固定的常驻数量。theme.accent：唯一的用户主题色，分别设置浅色和深色值；默认system跟随浏览器。compliance：ICP备案及公网安备案均为可选；label为空时不显示。poweredBy：可隐藏页脚的项目链接，但建议保留署名以支持项目。
将图片放在 public/ 目录下，例如 public/images/avatar-light.png、public/favicon.png。它们会在构建时被复制到 dist/。配置使用相对项目根目录的 ./public/ 路径：
profile: {
avatar: {
light: { local: "./public/images/avatar-light.png" },
dark: { local: "./public/images/avatar-dark.png" },
}
},
favicon: {
light: { local: "./public/favicon-light.png" },
dark: { local: "./public/favicon-dark.png" },
}也可将 { local: ... } 替换为 { url: "https://..." }。浅深色素材相同时，两个字段填写同一路径即可。
项目中所有 UI 图标均为内置的原创单色 SVG 线稿，不需要下载图标库。
常用平台可直接使用内置 icon 名称。若需要更多平台，可在任意链接项中填写安全的 SVG 路径数据，页面会继承当前主题的单色风格：
{
label: "Mastodon",
url: "https://example.com",
icon: {
viewBox: "0 0 24 24",
paths: ["M6 4h12v16H6z", "M9 9v6M15 9v6"]
}
}该格式只接受 viewBox 和 paths，不会执行外部脚本或嵌入任意 SVG 标签。
仅在开发模式下访问 http://localhost:5173/?stress=1，会临时追加 14 条超长名称的站点和项目，用于检查大量条目、超长文字与列表收纳。首页会按当前内容区的真实高度动态计算可展示条目数：尽可能多展示，刚好溢出时才收纳到“查看全部”；窗口尺寸、设备方向或字体加载变化后会重新计算。生产构建会强制关闭该模式：部署后的站点即使带上 ?stress=1 也不会显示测试数据。
页面会尽量维持一屏；当 CSS 视口高度不足 700px（包括高 DPI 横屏设备）时，会自动改为自然页面滚动，优先保证内容、返回按钮和备案信息不被裁切或相互覆盖。