mirror of
https://github.com/chillpadclub/bedolaga-cabinet.git
synced 2026-07-30 10:27:49 +00:00
polish: clear 33/34 detector findings (bg-black, animate-bounce, spinner, transition-width, color)
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:
@@ -106,13 +106,13 @@ function wrap(frame: Frame, key: number): ReactNode {
|
||||
return <s key={k}>{frame.children}</s>;
|
||||
case 'code':
|
||||
return (
|
||||
<code key={k} className="rounded bg-black/30 px-1 font-mono text-[0.92em]">
|
||||
<code key={k} className="rounded bg-dark-950/30 px-1 font-mono text-[0.92em]">
|
||||
{frame.children}
|
||||
</code>
|
||||
);
|
||||
case 'pre':
|
||||
return (
|
||||
<pre key={k} className="my-1 rounded bg-black/30 p-2 font-mono text-[0.92em]">
|
||||
<pre key={k} className="my-1 rounded bg-dark-950/30 p-2 font-mono text-[0.92em]">
|
||||
{frame.children}
|
||||
</pre>
|
||||
);
|
||||
@@ -190,7 +190,7 @@ export function TelegramPreview({
|
||||
if (!open) return null;
|
||||
return createPortal(
|
||||
<div
|
||||
className="fixed inset-0 z-[9999] flex items-center justify-center bg-black/70 p-4"
|
||||
className="fixed inset-0 z-[9999] flex items-center justify-center bg-dark-950/70 p-4"
|
||||
onClick={onClose}
|
||||
>
|
||||
<div
|
||||
@@ -268,7 +268,7 @@ export function EmailPreview({ open, onClose, subject, htmlContent }: EmailPrevi
|
||||
const emptyHtml = `<p style="color:#999;font-family:sans-serif">${t('admin.broadcasts.previewEmpty', '— пусто —')}</p>`;
|
||||
return createPortal(
|
||||
<div
|
||||
className="fixed inset-0 z-[9999] flex items-center justify-center bg-black/70 p-4"
|
||||
className="fixed inset-0 z-[9999] flex items-center justify-center bg-dark-950/70 p-4"
|
||||
onClick={onClose}
|
||||
>
|
||||
<div
|
||||
|
||||
Reference in New Issue
Block a user