mirror of
https://github.com/chillpadclub/bedolaga-cabinet.git
synced 2026-07-28 09:33:46 +00:00
refactor(theming): replace gray-* with dark-* tokens on blocking screens
Map text/bg/border-gray-N → dark-N across the four blocking screens (Maintenance, Blacklisted, ChannelSubscription, AccountDeleted) so muted text + decorative surfaces follow the design tokens. BroadcastPreview's email mockup and MessageMediaGrid's fullscreen overlay intentionally keep their literal gray/white (mock chrome).
This commit is contained in:
@@ -76,7 +76,7 @@ export default function AccountDeletedScreen() {
|
||||
{t('blocking.accountDeleted.title')}
|
||||
</h1>
|
||||
|
||||
<p className="mb-6 text-lg text-gray-400">{t('blocking.accountDeleted.description')}</p>
|
||||
<p className="mb-6 text-lg text-dark-400">{t('blocking.accountDeleted.description')}</p>
|
||||
|
||||
<div className="space-y-3">
|
||||
{deepLink && (
|
||||
@@ -91,13 +91,13 @@ export default function AccountDeletedScreen() {
|
||||
<button
|
||||
type="button"
|
||||
onClick={handleRetry}
|
||||
className="block w-full rounded-xl bg-dark-800 px-6 py-3 text-base font-medium text-gray-200 transition-colors hover:bg-dark-700 focus:outline-none focus:ring-2 focus:ring-gray-400 focus:ring-offset-2 focus:ring-offset-dark-950"
|
||||
className="block w-full rounded-xl bg-dark-800 px-6 py-3 text-base font-medium text-dark-200 transition-colors hover:bg-dark-700 focus:outline-none focus:ring-2 focus:ring-dark-400 focus:ring-offset-2 focus:ring-offset-dark-950"
|
||||
>
|
||||
{t('blocking.accountDeleted.retry')}
|
||||
</button>
|
||||
</div>
|
||||
|
||||
<p className="mt-8 text-sm text-gray-500">{t('blocking.accountDeleted.hint')}</p>
|
||||
<p className="mt-8 text-sm text-dark-500">{t('blocking.accountDeleted.hint')}</p>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
|
||||
@@ -42,17 +42,17 @@ export default function BlacklistedScreen() {
|
||||
</h1>
|
||||
|
||||
{/* Message */}
|
||||
<p className="mb-6 text-lg text-gray-400">{t('blocking.blacklisted.defaultMessage')}</p>
|
||||
<p className="mb-6 text-lg text-dark-400">{t('blocking.blacklisted.defaultMessage')}</p>
|
||||
|
||||
{/* Reason */}
|
||||
{blacklistedInfo?.message && (
|
||||
<div className="mb-6 rounded-xl bg-dark-800/50 p-4">
|
||||
<p className="mb-1 text-sm text-gray-500">{t('blocking.blacklisted.reason')}:</p>
|
||||
<p className="text-gray-300">{blacklistedInfo.message}</p>
|
||||
<p className="mb-1 text-sm text-dark-500">{t('blocking.blacklisted.reason')}:</p>
|
||||
<p className="text-dark-300">{blacklistedInfo.message}</p>
|
||||
</div>
|
||||
)}
|
||||
|
||||
<p className="mt-8 text-sm text-gray-500">{t('blocking.blacklisted.contactSupport')}</p>
|
||||
<p className="mt-8 text-sm text-dark-500">{t('blocking.blacklisted.contactSupport')}</p>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
|
||||
@@ -108,7 +108,7 @@ export default function ChannelSubscriptionScreen() {
|
||||
</h1>
|
||||
|
||||
{/* Message */}
|
||||
<p className="mb-6 text-lg text-gray-400">
|
||||
<p className="mb-6 text-lg text-dark-400">
|
||||
{channelInfo?.message || t('blocking.channel.defaultMessage')}
|
||||
</p>
|
||||
|
||||
@@ -184,7 +184,7 @@ export default function ChannelSubscriptionScreen() {
|
||||
) : cooldown > 0 ? (
|
||||
<>
|
||||
<svg
|
||||
className="h-5 w-5 text-gray-500"
|
||||
className="h-5 w-5 text-dark-500"
|
||||
fill="none"
|
||||
viewBox="0 0 24 24"
|
||||
stroke="currentColor"
|
||||
@@ -214,7 +214,7 @@ export default function ChannelSubscriptionScreen() {
|
||||
</button>
|
||||
|
||||
{/* Hint */}
|
||||
<p className="mt-4 text-sm text-gray-500">{t('blocking.channel.hint')}</p>
|
||||
<p className="mt-4 text-sm text-dark-500">{t('blocking.channel.hint')}</p>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
|
||||
@@ -42,15 +42,15 @@ export default function MaintenanceScreen() {
|
||||
</h1>
|
||||
|
||||
{/* Message */}
|
||||
<p className="mb-6 text-lg text-gray-400">
|
||||
<p className="mb-6 text-lg text-dark-400">
|
||||
{maintenanceInfo?.message || t('blocking.maintenance.defaultMessage')}
|
||||
</p>
|
||||
|
||||
{/* Reason */}
|
||||
{maintenanceInfo?.reason && (
|
||||
<div className="mb-6 rounded-xl bg-dark-800/50 p-4">
|
||||
<p className="mb-1 text-sm text-gray-500">{t('blocking.maintenance.reason')}:</p>
|
||||
<p className="text-gray-300">{maintenanceInfo.reason}</p>
|
||||
<p className="mb-1 text-sm text-dark-500">{t('blocking.maintenance.reason')}:</p>
|
||||
<p className="text-dark-300">{maintenanceInfo.reason}</p>
|
||||
</div>
|
||||
)}
|
||||
|
||||
@@ -70,7 +70,7 @@ export default function MaintenanceScreen() {
|
||||
/>
|
||||
</div>
|
||||
|
||||
<p className="mt-4 text-sm text-gray-500">{t('blocking.maintenance.waitMessage')}</p>
|
||||
<p className="mt-4 text-sm text-dark-500">{t('blocking.maintenance.waitMessage')}</p>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
|
||||
Reference in New Issue
Block a user