添加 账户验证的页面 (#14)

* Add files via upload

* Add files via upload

* Add files via upload

* Add files via upload

* 添加忘记密码/修改密码 Faq

* 为 验证邮箱 的页面添加 QQ邮箱 界面的Webp

* 添加 验证邮箱 页面

* Update verify-account.md

* 添加 验证邮箱 页面

* 为侧边栏添加 验证账户

* 添加 验证账户 的页面

* Delete docs/newbee/assets/mailverify directory

* 添加 验证账户 的 QQ邮箱网页版 的Webp

* 上传 验证账户 的页面

* 将fork仓库的site.md还原

* 将 验证邮件问题 改写成跳转卡片

最后一个卡片元素已根据PR #12改成#reset-password

* 这下是真的把排版处理好了

~~参考了HMCL那边的MD才知道1.2.3.4.后面要空格~~

* Update docs/newbee/verify-account.md

Co-authored-by: SerinaNya <[email protected]>

* Update docs/newbee/verify-account.md

Co-authored-by: SerinaNya <[email protected]>

* Update docs/newbee/verify-account.md

Co-authored-by: SerinaNya <[email protected]>

* Update docs/newbee/verify-account.md

Co-authored-by: SerinaNya <[email protected]>

* Update docs/newbee/verify-account.md

Co-authored-by: SerinaNya <[email protected]>

* Update docs/newbee/verify-account.md

Co-authored-by: SerinaNya <[email protected]>

* Update docs/newbee/verify-account.md

Co-authored-by: SerinaNya <[email protected]>

* Update docs/newbee/verify-account.md

Co-authored-by: SerinaNya <[email protected]>

* Update docs/newbee/verify-account.md

Co-authored-by: SerinaNya <[email protected]>

* Update docs/newbee/verify-account.md

Co-authored-by: XieXiLin <[email protected]>

* 修改QQ邮箱图片标示细节

* 与Webp配合修改第一步的文本

* 增加细节

* 认准邮件发件人

* Update docs/newbee/verify-account.md

Co-authored-by: XieXiLin <[email protected]>

* Update docs/newbee/verify-account.md

Co-authored-by: XieXiLin <[email protected]>

* Update docs/newbee/verify-account.md

Co-authored-by: XieXiLin <[email protected]>

* Update docs/newbee/verify-account.md

Co-authored-by: Steven Qiu <[email protected]>

* Update docs/newbee/verify-account.md

Co-authored-by: XieXiLin <[email protected]>

* Update docs/.vitepress/config.mts

Co-authored-by: XieXiLin <[email protected]>

* Update docs/newbee/verify-account.md

Co-authored-by: XieXiLin <[email protected]>

* Update docs/newbee/verify-account.md

Co-authored-by: Steven Qiu <[email protected]>

* Update docs/newbee/verify-account.md

Co-authored-by: XieXiLin <[email protected]>

* verify-account 修改为 verify-email

* .virepress/config.mts 更新验证邮箱的文件名

* Revert "Update docs/newbee/verify-account.md"

This reverts commit 1fa7255.

* 🎨 style: improve doc style

* ⚡️ perf(newbee/verify-email): use `NCard` instead of text link

* Reapply "Update docs/newbee/verify-account.md"

This reverts commit e4d5ab2.

* revert: commit

DONT ADD <> BESIDES EMAIL ADDRESS

---------

Co-authored-by: SerinaNya <[email protected]>
Co-authored-by: XieXiLin <[email protected]>
Co-authored-by: Steven Qiu <[email protected]>

docs/.vitepress/config.mts

@@ -142,6 +142,7 @@ export default defineConfig({
               text: '新手指引',
               link: '/newbee/',
               items: [
+                { text: '验证邮箱', link: '/newbee/verify-email' },
                 { text: '创建角色', link: '/newbee/player' },
                 { text: '设定材质', link: '/newbee/textures' },
                 { text: '配置 CustomSkinLoader', link: '/newbee/csl' },

docs/newbee/verify-email.md

@@ -0,0 +1,44 @@
+# 验证邮箱
+
+欢迎加入 LittleSkin 大家庭 🎉
+
+看到此处，你应该已经成功注册了 LittleSkin 账号！🎉🎉
+
+但你离创建角色到进入游戏的过程还差最后一步：验证你的邮箱。
+
+## 以 QQ 邮箱为例
+
+1. 打开 [QQ 邮箱官网](https://mail.qq.com) 页面并登录你的 QQ 账号，打开 **收件箱** 后查看发件人为 **LittleSkin** 的邮件
+   ![QQ 邮箱主页面](./assets/verify-account/QQMail-MainPage-New.webp)
+
+   <NCard title="😢 收不到验证邮件？" link="/faq/site#no-email" >
+   前去查看关于验证邮件无法收到的解决办法
+   </NCard>
+
+2. 点击以 **LittleSkin** 为发件人的邮件，然后点击邮件里的链接进入 LittleSkin 的邮箱验证页面
+
+   > [!IMPORTANT] 注意
+   >
+   > - 请始终使用浏览器访问邮件中的链接。
+   > - 从手机 QQ 或 QQ 邮箱 APP 内置的浏览器中直接访问链接可能会产生错误。
+   > - 请认准 **发件人** 为 **LittleSkin ([email protected])** 的邮件，谨防诈骗邮件。
+
+3. 输入你注册 LittleSkin 时提供的邮箱，然后点击 <BSSection>提交</BSSection> 按钮
+
+4. 大功告成 🎉
+
+至此，你已成功完成了邮箱验证！
+
+<NCard title="➕ 创建角色" link="/newbee/player" >
+你现在可以进行 <BSSection><FA :icon="faUsers" /> 创建角色</BSSection> 的步骤啦！
+</NCard>
+
+## 其他邮件网页版/客户端
+
+与上述操作相似，请在各自邮箱提供商的网页或 APP 的 **收件箱** 和 **垃圾箱** 寻找由 **LittleSkin** 发出的验证邮件。
+
+---
+
+<NCard title="😢 忘记密码了怎么办？" link="/faq/site#reset-password" >
+前去了解如何重置自己的密码
+</NCard>