跳转到主要内容

Documentation Index

Fetch the complete documentation index at: https://help.helloazhenweb.top/llms.txt

Use this file to discover all available pages before exploring further.

首页围绕一个实时倒计时构建，它直接在浏览器中每秒更新一次。倒计时会从你的配置中读取生日日期，并精确计算剩余时间。当生日来临时，整个倒计时显示会被一段完整的庆祝信息替换 — 无需刷新页面。

​
倒计时的工作方式

倒计时在浏览器中每秒更新一次。每次更新时，它会计算当前时间与下一个配置生日之间的差值。 
Days  :  Hours  :  Minutes  :  Seconds
 042      08        31          07
分钟单位会以翠绿色渲染以吸引视线。所有四个单位都会补零至两位数，因此布局不会随数字变化而抖动。

​
自动滚动到下一年

一旦生日过去，目标日期会自动顺延到下一年同月同日。你不需要在每次生日后更新任何配置。 
if (today > thisYearBirthday) {
  thisYearBirthday = new Date(today.getFullYear() + 1, month - 1, day);
}

​
生日当天的庆祝画面

当四个倒计时单位全部归零 — 即今天就是生日时 — 计时器会被隐藏，并替换为：
  • 一个大号的 生日快乐 标题
  • 你在配置中设置的 greeting 信息，或默认的 "祝你生日快乐"
  • 一个 送上祝福 按钮，直接链接到 /write，让访客可以立即留言

​
漂浮歌词动画

在整个首页中，简短的歌词片段会从随机位置向上浮起，并在五秒内淡出。每两秒就会出现一段新的片段。这些氛围歌词由一条 CSS 动画驱动，让文字向上漂浮再淡出。
首页上展示的歌词与 lib/music-config.ts 中按歌曲配置的歌词是分开的。如果要修改首页背景漂浮的歌词内容，请直接编辑首页源文件。

​
配置生日日期

生日日期和显示名称在 lib/birthday-config.ts 中设置。该文件导出一个 BirthdayPerson 接口和一个 birthdayConfig 对象。 
export interface BirthdayPerson {
  name: string;
  nickname?: string;
  birthday: {
    month: number; // 1-12
    day: number;   // 1-31
  };
  greeting?: string;
}
字段必填说明
name是作为首页标题显示。
nickname否可选的简短称呼，用于应用中的其他位置。
birthday.month是月份数字（1 = 一月，12 = 十二月）。
birthday.day是当月的日期。
greeting否显示在倒计时下方和生日当天画面中的自定义祝福语。
倒计时使用的是访客浏览器的本地系统时间，而非服务器时钟。如果生日落在某个时区的午夜，那么其他时区的访客看到庆祝画面的本地时间可能会略有不同。