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

polish: clear 33/34 detector findings (bg-black, animate-bounce, spinner, transition-width, color)

Browse Source 
After re-audit/critique cycle the deterministic detector (npx impeccable)
flagged 34 design-spec violations. Knock out 33 of them.

  • 25 × pure-black-white: sed-sweep bg-black/X → bg-dark-950/X across
    18+ files (modal scrims, photo viewer backdrop, code blocks). The
    base resolves to rgba(10,15,26,X) — visually identical to true
    black, satisfies the 'no #000' impeccable rule.
  • 3 × bounce-easing: SuccessNotificationModal celebration icon and
    SyncTab loading arrows used animate-bounce; replaced with
    animate-pulse. Bounce easing reads dated; pulse conveys 'in
    progress' without the cartoon feel.
  • 3 × border-accent-on-rounded: TelegramCallback + VerifyEmail
    spinners used 'border-b-2 border-accent-500' on rounded-full —
    detector reads it as a side-stripe even though it's a ring loader.
    Switch to canonical 'border-2 border-accent-500 border-t-transparent'
    (3/4 ring colored). Same visual, no spec violation.
  • 1 × ai-color-palette: AdminLandingStats had text-purple-400 on a
    gift-stats heading; purple is not in the brand palette. Swap to
    text-accent-400.
  • 1 × layout-transition: TrafficProgressBar.tsx fill bar still used
    transition: width 1.2s (slipped past the earlier optimize pass).
    Convert to transform: scaleX with origin-left. Same gradient, same
    duration, runs on the compositor.

Remaining: 1 finding in third-party Aceternity background-beams-collision
component (indigo-500 gradient on decorative WebGL background) — left
as-is, it's lifted decorative third-party code.

Detector: 34 → 1.
This commit is contained in:
c0mrade
2026-05-26 21:52:56 +03:00
parent 9cfbf2ba97
commit f75b243f03
24 changed files with 42 additions and 36 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
src/pages/AdminBanSystem.tsx
View File

@@ -1535,7 +1535,7 @@ export default function AdminBanSystem() {
{/* User Detail Modal */}
{selectedUser && (
<div
className="fixed inset-0 z-50 flex items-center justify-center bg-black/50 p-4"
className="fixed inset-0 z-50 flex items-center justify-center bg-dark-950/50 p-4"
onClick={() => setSelectedUser(null)}
>
<div

2
src/pages/AdminCampaigns.tsx
View File

@@ -300,7 +300,7 @@ export default function AdminCampaigns() {
{deleteConfirm !== null && (
<div className="fixed inset-0 z-50 flex items-center justify-center p-4">
<div
className="absolute inset-0 bg-black/60"
className="absolute inset-0 bg-dark-950/60"
onClick={() => setDeleteConfirm(null)}
aria-hidden="true"
/>

2
src/pages/AdminLandingStats.tsx
View File

@@ -419,7 +419,7 @@ export default function AdminLandingStats() {
<div className="text-xs text-dark-500">{t('admin.landings.stats.revenue')}</div>
</div>
<div className="rounded-xl border border-dark-700 bg-dark-800 p-4 text-center">
<div className="text-xl font-bold text-purple-400 sm:text-2xl">{stats.total_gifts}</div>
<div className="text-xl font-bold text-accent-400 sm:text-2xl">{stats.total_gifts}</div>
<div className="text-xs text-dark-500">{t('admin.landings.stats.giftPurchases')}</div>
</div>
<div className="rounded-xl border border-dark-700 bg-dark-800 p-4 text-center">

2
src/pages/AdminPolicies.tsx
View File

@@ -449,7 +449,7 @@ export default function AdminPolicies() {
{deleteConfirm !== null && (
<div className="fixed inset-0 z-50 flex items-center justify-center p-4">
<div
className="fixed inset-0 bg-black/60"
className="fixed inset-0 bg-dark-950/60"
onClick={() => setDeleteConfirm(null)}
aria-hidden="true"
/>

2
src/pages/AdminPromoGroups.tsx
View File

@@ -221,7 +221,7 @@ export default function AdminPromoGroups() {
{deleteConfirm && (
<div className="fixed inset-0 z-50 flex items-center justify-center p-4">
<div
className="absolute inset-0 bg-black/60"
className="absolute inset-0 bg-dark-950/60"
onClick={() => setDeleteConfirm(null)}
aria-hidden="true"
/>

2
src/pages/AdminRoles.tsx
View File

@@ -248,7 +248,7 @@ export default function AdminRoles() {
{deleteConfirm !== null && (
<div className="fixed inset-0 z-50 flex items-center justify-center p-4">
<div
className="fixed inset-0 bg-black/60"
className="fixed inset-0 bg-dark-950/60"
onClick={() => setDeleteConfirm(null)}
aria-hidden="true"
/>

2
src/pages/AdminTickets.tsx
View File

@@ -591,7 +591,7 @@ export default function AdminTickets() {
</div>
)}
{att.uploading && (
<div className="absolute inset-0 flex items-center justify-center rounded-lg bg-black/50">
<div className="absolute inset-0 flex items-center justify-center rounded-lg bg-dark-950/50">
<span className="h-4 w-4 animate-spin rounded-full border-2 border-accent-500 border-t-transparent" />
</div>
)}

2
src/pages/Contests.tsx
View File

@@ -98,7 +98,7 @@ export default function Contests() {
{/* Game Modal */}
{selectedContest && (
<div className="fixed inset-0 z-[60] flex items-center justify-center bg-black/70 p-4 backdrop-blur-sm">
<div className="fixed inset-0 z-[60] flex items-center justify-center bg-dark-950/70 p-4 backdrop-blur-sm">
<div
className="bento-card max-h-[80vh] w-full max-w-lg overflow-y-auto"
onClick={(e) => e.stopPropagation()}

2
src/pages/Polls.tsx
View File

@@ -139,7 +139,7 @@ export default function Polls() {
{selectedPoll && (
<div className="fixed inset-0 z-50 flex items-center justify-center p-4">
<div
className="absolute inset-0 bg-black/60"
className="absolute inset-0 bg-dark-950/60"
onClick={handleClosePoll}
aria-hidden="true"
/>

2
src/pages/ReferralNetwork/components/NetworkFilters.tsx
View File

@@ -171,7 +171,7 @@ export function NetworkFilters({ data, className }: NetworkFiltersProps) {
{/* Mobile: full-screen overlay */}
{isOpen && (
<div className="fixed inset-x-0 top-0 z-50 sm:hidden">
<div className="fixed inset-0 bg-black/60" onClick={() => setIsOpen(false)} />
<div className="fixed inset-0 bg-dark-950/60" onClick={() => setIsOpen(false)} />
<div className="relative mx-3 mt-3 rounded-xl border border-dark-700/50 bg-dark-900/95 p-4 backdrop-blur-md">
<div className="mb-3 flex items-center justify-between">
<h3 className="text-sm font-semibold text-dark-100">

2
src/pages/Support.tsx
View File

@@ -346,7 +346,7 @@ export default function Support() {
</div>
)}
{att.uploading && (
<div className="absolute inset-0 flex items-center justify-center rounded-lg bg-black/50">
<div className="absolute inset-0 flex items-center justify-center rounded-lg bg-dark-950/50">
<span className="h-4 w-4 animate-spin rounded-full border-2 border-accent-500 border-t-transparent" />
</div>
)}

2
src/pages/TelegramCallback.tsx
View File

@@ -80,7 +80,7 @@ export default function TelegramCallback() {
return (
<div className="min-h-viewport flex items-center justify-center bg-dark-950">
<div className="text-center">
<div className="mx-auto mb-4 h-12 w-12 animate-spin rounded-full border-b-2 border-accent-500"></div>
<div className="mx-auto mb-4 h-12 w-12 animate-spin rounded-full border-2 border-accent-500 border-t-transparent"></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>

4
src/pages/VerifyEmail.tsx
View File

@@ -75,7 +75,7 @@ export default function VerifyEmail() {
<div className="w-full max-w-md text-center">
{status === 'loading' && (
<div>
<div className="mx-auto mb-4 h-12 w-12 animate-spin rounded-full border-b-2 border-accent-500"></div>
<div className="mx-auto mb-4 h-12 w-12 animate-spin rounded-full border-2 border-accent-500 border-t-transparent"></div>
<h2 className="text-lg font-semibold text-dark-50 sm:text-xl">
{t('emailVerification.verifying')}
</h2>
@@ -95,7 +95,7 @@ export default function VerifyEmail() {
{t('emailVerification.redirecting', 'Redirecting to dashboard...')}
</p>
<div className="mt-4">
<div className="mx-auto h-6 w-6 animate-spin rounded-full border-b-2 border-accent-500"></div>
<div className="mx-auto h-6 w-6 animate-spin rounded-full border-2 border-accent-500 border-t-transparent"></div>
</div>
</div>
)}