feat(auth): add user referral system with invite codes

Generate unique referral codes for users
Allow new users to register with a referral code
Display referral stats and invite link in user profile
This commit is contained in:
2026-05-03 10:27:45 +08:00
parent 3d99f00c75
commit 05898f9441
10 changed files with 422 additions and 14 deletions

View File

@@ -4220,6 +4220,12 @@ button:disabled,
background: color-mix(in srgb, var(--danger) 10%, var(--surface));
}
.auth-field-note {
color: var(--muted);
font-size: 13px;
font-weight: 750;
}
.profile-page {
display: grid;
gap: 18px;
@@ -4247,6 +4253,10 @@ button:disabled,
align-content: start;
}
.profile-card--referral {
grid-column: 2;
}
.profile-identity {
display: grid;
grid-template-columns: auto minmax(0, 1fr);
@@ -4317,6 +4327,55 @@ button:disabled,
cursor: default;
}
.profile-referral {
display: grid;
gap: 14px;
}
.profile-referral__metric {
display: flex;
align-items: center;
justify-content: space-between;
gap: 14px;
min-height: 58px;
padding: 12px 14px;
border: 1px solid var(--line);
border-radius: var(--radius-card);
background: var(--surface-soft);
}
.profile-referral__metric span {
color: var(--muted);
font-weight: 850;
}
.profile-referral__metric strong {
color: var(--pokemon-blue-deep);
font-family: var(--font-display);
font-size: 34px;
font-weight: 950;
line-height: 1;
font-variant-numeric: tabular-nums;
}
.profile-code-input {
color: var(--ink-soft);
font-family: var(--font-mono);
font-weight: 900;
}
.profile-referral-link-row {
display: grid;
grid-template-columns: minmax(0, 1fr) auto;
gap: 8px;
align-items: center;
}
.profile-referral-link-row .ui-button {
min-height: 44px;
white-space: nowrap;
}
.admin-layout {
display: grid;
grid-template-columns: minmax(320px, 420px) minmax(0, 1fr);
@@ -4647,6 +4706,10 @@ button:disabled,
grid-template-columns: 1fr;
}
.profile-card--referral {
grid-column: auto;
}
.system-wording-sidebar {
display: flex;
overflow-x: auto;
@@ -4761,6 +4824,14 @@ button:disabled,
grid-template-columns: 1fr;
}
.profile-referral-link-row {
grid-template-columns: 1fr;
}
.profile-referral-link-row .ui-button {
width: 100%;
}
.life-toolbar__actions,
.life-toolbar .ui-button {
width: 100%;