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

fix: remove gemini-effect and noise backgrounds, fix aurora animation

Browse Source 
- Delete google-gemini-effect.tsx and noise-background.tsx
- Remove from types, registry, and backend whitelist
- Rewrite aurora: use animate-aurora directly on element instead of
  invisible pseudo-element with mix-blend-difference
This commit is contained in:
Fringg
2026-02-25 07:43:41 +03:00
parent de97a030d2
commit 79ff7412cb
5 changed files with 8 additions and 223 deletions
Download Patch File Download Diff File Expand all files Collapse all files

24
src/components/ui/backgrounds/aurora-background.tsx
View File

@@ -8,26 +8,18 @@ export default function AuroraBackground({ settings }: Props) {
const showRadialGradient = (settings.showRadialGradient as boolean) ?? true;
return (
<div
className="absolute inset-0 overflow-hidden"
style={
{
'--aurora':
'repeating-linear-gradient(100deg,#3b82f6_10%,#a5b4fc_15%,#93c5fd_20%,#ddd6fe_25%,#60a5fa_30%)',
'--dark-gradient':
'repeating-linear-gradient(100deg,#000_0%,#000_7%,transparent_10%,transparent_12%,#000_16%)',
'--transparent': 'transparent',
} as React.CSSProperties
}
>
<div className="absolute inset-0 overflow-hidden">
<div
className={cn(
`pointer-events-none absolute -inset-[10px] opacity-50 blur-[10px] will-change-transform after:animate-aurora`,
`[background-image:var(--dark-gradient),var(--aurora)] [background-position:50%_50%,50%_50%] [background-size:300%,_200%]`,
`after:absolute after:inset-0 after:mix-blend-difference after:content-[""] after:[background-attachment:fixed] after:[background-image:var(--dark-gradient),var(--aurora)] after:[background-size:200%,_100%]`,
'pointer-events-none absolute -inset-[10px] animate-aurora opacity-50 blur-[10px] will-change-transform',
showRadialGradient &&
`[mask-image:radial-gradient(ellipse_at_100%_0%,black_10%,var(--transparent)_70%)]`,
'[mask-image:radial-gradient(ellipse_at_100%_0%,black_10%,transparent_70%)]',
)}
style={{
backgroundImage:
'repeating-linear-gradient(100deg, #000 0%, #000 7%, transparent 10%, transparent 12%, #000 16%), repeating-linear-gradient(100deg, #3b82f6 10%, #a5b4fc 15%, #93c5fd 20%, #ddd6fe 25%, #60a5fa 30%)',
backgroundSize: '300%, 200%',
}}
/>
</div>
);