mirror of
https://github.com/hanzoai/billing.git
synced 2026-10-30 18:46:54 +00:00
The Tailwind strip left the colour *values* behind: markup still named literal whites and dark-theme hexes, so `html.light` moved the tokens and nothing followed. Light mode rendered near-black text on a near-black page. Same four facts, each with one home now: ground bg-[#09090b] · bg-[#141419] · bg-[#0d0d10] · bg-[#16161c] -> bg-bg · bg-bg-card · bg-bg-elevated ink the whole `*-white/α` family is really "foreground at α%", so it says so: `-ink/α`, mixed from var(--color-text) brand bg-white + text-black pills -> bg-brand + text-brand-foreground (+ .bg-brand-foreground, which the switch knob needed — it was painting white on the white ON-track and vanishing) selection one rule for both themes; the light override painted white text on a pale tint /commerce styled itself entirely with inline dark literals and ignored the flip wholesale — 82 unreadable elements. Its hexes and rgba(255,255,255,α) now read the same tokens, and the H-mark inherits currentColor instead of being permanently white. Also: every self-navigation goes through BASE_PATH. /plans, /transactions, /payment-methods and the auth callback jumped to a bare '/', which walks the browser out of the app whenever the SPA is mounted at /admin/billing inside the commerce binary. billing-shell already did this for /topup — now it is the only way. Verified: next build green; Playwright over the static export in both themes — light /commerce 82 unreadable -> 0, /plans -> /admin/billing/#pricing (was the server root); dark render byte-identical in intent (same alphas, now expressed in oklab). Co-authored-by: Hanzo Dev <[email protected]>
24 lines
663 B
TypeScript
24 lines
663 B
TypeScript
'use client'
|
|
|
|
import { useEffect } from 'react'
|
|
|
|
import { BASE_PATH } from '@/lib/config'
|
|
|
|
/**
|
|
* /payment-methods — thin redirect to the billing shell's payment section.
|
|
*
|
|
* The app uses a static export with hash-based routing inside BillingShell.
|
|
* This page simply redirects to /#payment so deep-links work correctly.
|
|
*/
|
|
export default function PaymentMethodsPage() {
|
|
useEffect(() => {
|
|
window.location.replace(`${BASE_PATH}/#payment`)
|
|
}, [])
|
|
|
|
return (
|
|
<main className="flex min-h-screen items-center justify-center bg-bg">
|
|
<div className="h-5 w-5 animate-spin rounded-full border-2 border-ink/10 border-t-ink/50" />
|
|
</main>
|
|
)
|
|
}
|