etkr4k/bedolaga-cabinet
1
0
Fork 0
mirror of https://github.com/chillpadclub/bedolaga-cabinet.git synced 2026-07-28 17:43:47 +00:00
Code Issues Packages Projects Releases Wiki Activity

fix(theming): replace off-token TelegramCallback/VerifyEmail with design tokens

Browse Source 
Both pages were rendering with raw Tailwind gray-* + a non-existent border-primary-600
class (invisible spinner). Map: bg-gray-50 → bg-dark-950, text-gray-900 → text-dark-50,
text-gray-500 → text-dark-400, border-primary-600 → border-accent-500. Pages now match
the dark theme and the spinner is visible.
This commit is contained in:
c0mrade
2026-05-26 11:14:58 +03:00
parent bd8a4fad6e
commit feee9f9c05
2 changed files with 16 additions and 16 deletions
Download Patch File Download Diff File Expand all files Collapse all files

14
src/pages/TelegramCallback.tsx
View File

@@ -64,11 +64,11 @@ export default function TelegramCallback() {
if (error) {
return (
<div className="min-h-viewport flex items-center justify-center bg-gray-50 px-4 py-8">
<div className="min-h-viewport flex items-center justify-center bg-dark-950 px-4 py-8">
<div className="w-full max-w-md text-center">
<div className="mb-4 text-5xl text-error-500">✗</div>
<h2 className="mb-2 text-lg font-semibold text-gray-900">{t('auth.loginFailed')}</h2>
<p className="mb-6 text-sm text-gray-500">{error}</p>
<h2 className="mb-2 text-lg font-semibold text-dark-50">{t('auth.loginFailed')}</h2>
<p className="mb-6 text-sm text-dark-400">{error}</p>
<button onClick={() => navigate('/login')} className="btn-primary">
{t('auth.tryAgain')}
</button>
@@ -78,11 +78,11 @@ export default function TelegramCallback() {
}
return (
<div className="min-h-viewport flex items-center justify-center bg-gray-50">
<div className="min-h-viewport flex items-center justify-center bg-dark-950">
<div className="text-center">
<div className="border-primary-600 mx-auto mb-4 h-12 w-12 animate-spin rounded-full border-b-2"></div>
<h2 className="text-lg font-semibold text-gray-900">{t('auth.authenticating')}</h2>
<p className="mt-2 text-sm text-gray-500">{t('common.loading')}</p>
<div className="mx-auto mb-4 h-12 w-12 animate-spin rounded-full border-b-2 border-accent-500"></div>
<h2 className="text-lg font-semibold text-dark-50">{t('auth.authenticating')}</h2>
<p className="mt-2 text-sm text-dark-400">{t('common.loading')}</p>
</div>
</div>
);

18
src/pages/VerifyEmail.tsx
View File

@@ -66,7 +66,7 @@ export default function VerifyEmail() {
}, [searchParams, t, navigate, setTokens, setUser, checkAdminStatus]);
return (
<div className="min-h-viewport flex items-center justify-center bg-gray-50 px-4 py-8 sm:py-12">
<div className="min-h-viewport flex items-center justify-center bg-dark-950 px-4 py-8 sm:py-12">
{/* Language switcher in corner */}
<div className="fixed right-4 top-4 z-50">
<LanguageSwitcher />
@@ -75,11 +75,11 @@ export default function VerifyEmail() {
<div className="w-full max-w-md text-center">
{status === 'loading' && (
<div>
<div className="border-primary-600 mx-auto mb-4 h-12 w-12 animate-spin rounded-full border-b-2"></div>
<h2 className="text-lg font-semibold text-gray-900 sm:text-xl">
<div className="mx-auto mb-4 h-12 w-12 animate-spin rounded-full border-b-2 border-accent-500"></div>
<h2 className="text-lg font-semibold text-dark-50 sm:text-xl">
{t('emailVerification.verifying')}
</h2>
<p className="mt-2 text-sm text-gray-500 sm:text-base">
<p className="mt-2 text-sm text-dark-400 sm:text-base">
{t('emailVerification.pleaseWait')}
</p>
</div>
@@ -88,14 +88,14 @@ export default function VerifyEmail() {
{status === 'success' && (
<div>
<div className="mb-4 text-5xl text-success-500 sm:text-6xl">✓</div>
<h2 className="text-lg font-semibold text-gray-900 sm:text-xl">
<h2 className="text-lg font-semibold text-dark-50 sm:text-xl">
{t('emailVerification.success')}
</h2>
<p className="mt-2 text-sm text-gray-500 sm:text-base">
<p className="mt-2 text-sm text-dark-400 sm:text-base">
{t('emailVerification.redirecting', 'Redirecting to dashboard...')}
</p>
<div className="mt-4">
<div className="border-primary-600 mx-auto h-6 w-6 animate-spin rounded-full border-b-2"></div>
<div className="mx-auto h-6 w-6 animate-spin rounded-full border-b-2 border-accent-500"></div>
</div>
</div>
)}
@@ -103,10 +103,10 @@ export default function VerifyEmail() {
{status === 'error' && (
<div>
<div className="mb-4 text-5xl text-error-500 sm:text-6xl">✗</div>
<h2 className="text-lg font-semibold text-gray-900 sm:text-xl">
<h2 className="text-lg font-semibold text-dark-50 sm:text-xl">
{t('emailVerification.failed')}
</h2>
<p className="mt-2 text-sm text-gray-500 sm:text-base">{error}</p>
<p className="mt-2 text-sm text-dark-400 sm:text-base">{error}</p>
<div className="mt-6">
<Link to="/login" className="btn-secondary">
{t('emailVerification.goToLogin')}