refactor: migrate page components to Design System v4
Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
This commit is contained in:
@@ -110,8 +110,8 @@ export function InviteCodesPage() {
|
||||
}
|
||||
|
||||
const selectClass = cn(
|
||||
'w-full rounded-md border border-border bg-card px-3 py-2 text-sm text-foreground',
|
||||
'placeholder:text-muted-foreground focus:outline-hidden focus:border-primary focus:ring-2 focus:ring-primary/20'
|
||||
'w-full rounded-md border border-[#1e2130] bg-[#14161d] px-3 py-2 text-sm text-[#e2e5eb]',
|
||||
'placeholder:text-[#848b9b] focus:outline-hidden focus:border-primary focus:ring-2 focus:ring-primary/20'
|
||||
)
|
||||
|
||||
const columns: Column<InviteCodeResponse>[] = [
|
||||
@@ -119,7 +119,7 @@ export function InviteCodesPage() {
|
||||
key: 'code',
|
||||
header: 'Code',
|
||||
render: (c) => (
|
||||
<code className="rounded bg-accent px-2 py-1 text-sm font-mono text-muted-foreground">{c.code}</code>
|
||||
<code className="rounded bg-accent px-2 py-1 text-sm font-mono text-[#848b9b]">{c.code}</code>
|
||||
),
|
||||
},
|
||||
{
|
||||
@@ -130,12 +130,12 @@ export function InviteCodesPage() {
|
||||
{c.email_sent ? (
|
||||
<MailCheck className="h-3.5 w-3.5 text-emerald-400" />
|
||||
) : (
|
||||
<Mail className="h-3.5 w-3.5 text-muted-foreground" />
|
||||
<Mail className="h-3.5 w-3.5 text-[#848b9b]" />
|
||||
)}
|
||||
<span className="text-sm text-muted-foreground">{c.email}</span>
|
||||
<span className="text-sm text-[#848b9b]">{c.email}</span>
|
||||
</div>
|
||||
) : (
|
||||
<span className="text-sm text-muted-foreground">—</span>
|
||||
<span className="text-sm text-[#848b9b]">—</span>
|
||||
),
|
||||
},
|
||||
{
|
||||
@@ -151,9 +151,9 @@ export function InviteCodesPage() {
|
||||
key: 'trial',
|
||||
header: 'Trial',
|
||||
render: (c) => c.has_trial ? (
|
||||
<span className="text-sm text-muted-foreground">{c.trial_duration_days}d</span>
|
||||
<span className="text-sm text-[#848b9b]">{c.trial_duration_days}d</span>
|
||||
) : (
|
||||
<span className="text-sm text-muted-foreground">—</span>
|
||||
<span className="text-sm text-[#848b9b]">—</span>
|
||||
),
|
||||
},
|
||||
{
|
||||
@@ -170,7 +170,7 @@ export function InviteCodesPage() {
|
||||
key: 'expires_at',
|
||||
header: 'Expires',
|
||||
render: (c) => (
|
||||
<span className="text-sm text-muted-foreground">
|
||||
<span className="text-sm text-[#848b9b]">
|
||||
{c.expires_at ? new Date(c.expires_at).toLocaleDateString() : 'Never'}
|
||||
</span>
|
||||
),
|
||||
@@ -179,7 +179,7 @@ export function InviteCodesPage() {
|
||||
key: 'created_at',
|
||||
header: 'Created',
|
||||
render: (c) => (
|
||||
<span className="text-sm text-muted-foreground">
|
||||
<span className="text-sm text-[#848b9b]">
|
||||
{new Date(c.created_at).toLocaleDateString()}
|
||||
</span>
|
||||
),
|
||||
@@ -254,7 +254,7 @@ export function InviteCodesPage() {
|
||||
>
|
||||
<div className="space-y-4">
|
||||
<div>
|
||||
<label className="mb-1 block text-sm font-medium text-foreground">Recipient Email</label>
|
||||
<label className="mb-1 block text-sm font-medium text-[#e2e5eb]">Recipient Email</label>
|
||||
<Input
|
||||
type="email"
|
||||
value={email}
|
||||
@@ -264,7 +264,7 @@ export function InviteCodesPage() {
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<label className="mb-1 block text-sm font-medium text-foreground">Plan</label>
|
||||
<label className="mb-1 block text-sm font-medium text-[#e2e5eb]">Plan</label>
|
||||
<select
|
||||
aria-label="Plan"
|
||||
value={assignedPlan}
|
||||
@@ -283,7 +283,7 @@ export function InviteCodesPage() {
|
||||
|
||||
{assignedPlan !== 'free' && (
|
||||
<div>
|
||||
<label className="mb-1 block text-sm font-medium text-foreground">Trial Duration (days)</label>
|
||||
<label className="mb-1 block text-sm font-medium text-[#e2e5eb]">Trial Duration (days)</label>
|
||||
<Input
|
||||
type="number"
|
||||
value={trialDays}
|
||||
@@ -292,12 +292,12 @@ export function InviteCodesPage() {
|
||||
min={1}
|
||||
max={90}
|
||||
/>
|
||||
<p className="mt-1 text-xs text-muted-foreground">Leave empty for no trial — account gets full plan immediately.</p>
|
||||
<p className="mt-1 text-xs text-[#848b9b]">Leave empty for no trial — account gets full plan immediately.</p>
|
||||
</div>
|
||||
)}
|
||||
|
||||
<div>
|
||||
<label className="mb-1 block text-sm font-medium text-foreground">Expires in (days)</label>
|
||||
<label className="mb-1 block text-sm font-medium text-[#e2e5eb]">Expires in (days)</label>
|
||||
<Input
|
||||
type="number"
|
||||
value={expiresInDays}
|
||||
@@ -307,7 +307,7 @@ export function InviteCodesPage() {
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<label className="mb-1 block text-sm font-medium text-foreground">Note</label>
|
||||
<label className="mb-1 block text-sm font-medium text-[#e2e5eb]">Note</label>
|
||||
<Input
|
||||
type="text"
|
||||
value={note}
|
||||
|
||||
Reference in New Issue
Block a user