Heyauth - Authentication HTML5 Page Template

# 项目简介 Heyauth 是一套基于 Bootstrap 5 的响应式认证页面模板，包含登录、注册、找回密码、邮箱验证、两步验证、锁屏等多种场景。每种场景提供 3 种视觉变体，可快速用于 SaaS 、Web 应用或营销页面的身份认证模块。 ## 技术栈 - Bootstrap 5.1.3 - Google Fonts（Nunito） - Material Design Icons - Remix Icon - SCSS - 静态 HTML/CSS/JS ## 项目结构 ``` Heyauth_v1.0/ ├── Documentation/ │ ├── index.html # 在线文档入口 │ ├── css/ │ └── ... └── HTML/ ├── signin.html # 登录页主模板 ├── signin-1.html # 登录页变体 1 ├── signin-2.html # 登录页变体 2 ├── signin-3.html # 登录页变体 3 ├── signup.html # 注册页 ├── forgot-pass.html # 忘记密码 ├── email-verification.html # 邮箱验证 ├── two-step.html # 两步验证 ├── lockscreen.html # 锁屏 ├── recover-pass.html # 找回密码 ├── sign-out.html # 登出确认 ├── css/ │ ├── style.css # 主题主样式 │ ├── bootstrap.min.css │ └── materialdesignicons.min.css ├── fonts/ # 图标字体 ├── js/ │ └── app.js # 密码显示切换、两步验证自动聚焦 └── scss/ # SCSS 源码 ``` ## 核心文件说明 - `HTML/css/style.css` — 主题全局样式，含颜色系统、按钮、排版等 - `HTML/js/app.js` — 密码明文切换、验证码输入自动跳转等交互逻辑 - `HTML/signin.html` — 登录页主模板 - `HTML/signup.html` — 注册页模板 - `HTML/forgot-pass.html` — 忘记密码页模板 - `HTML/two-step.html` — 两步验证页模板 ## 快速开始 直接用浏览器打开 `HTML/signin.html`，或启动任意静态文件服务器（如 `npx serve HTML`）访问。 ## 使用建议 每个页面类型均有 `-1`、`-2`、`-3` 三个变体，可根据品牌色和 UI 风格选择对应版本。模板已内置 SCSS 源码，建议通过修改 SCSS 变量文件来统一调整主题色。