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: make Aurora colors vibrant and increase speed

Browse Source
This commit is contained in:
c0mrade
2026-01-31 23:05:38 +03:00
parent cffef41f63
commit 851e6a353b
1 changed files with 15 additions and 16 deletions
Download Patch File Download Diff File Expand all files Collapse all files

31
src/components/layout/AppShell/Aurora.tsx
View File

@@ -134,27 +134,26 @@ function getAccentColorFromCSS(): string {
function generateColorStops(baseColor: string): string[] { function generateColorStops(baseColor: string): string[] {
const [r, g, b] = hexToRgb(baseColor); const [r, g, b] = hexToRgb(baseColor);
// Create variations: darker, base, lighter (all very dark for background) // Create vibrant color stops for aurora effect
const darkerR = Math.max(0, Math.round(r * 255 * 0.15)); // Color 1: Very dark background
const darkerG = Math.max(0, Math.round(g * 255 * 0.15)); const color1 = '#0a0a0a';
const darkerB = Math.max(0, Math.round(b * 255 * 0.15));
const baseR = Math.round(r * 255 * 0.25); // Color 2: Accent at ~50% intensity (main aurora color)
const baseG = Math.round(g * 255 * 0.25); const midR = Math.round(r * 255 * 0.5);
const baseB = Math.round(b * 255 * 0.25); const midG = Math.round(g * 255 * 0.5);
const midB = Math.round(b * 255 * 0.5);
const color2 = `#${midR.toString(16).padStart(2, '0')}${midG.toString(16).padStart(2, '0')}${midB.toString(16).padStart(2, '0')}`;
const lighterR = Math.round(r * 255 * 0.35); // Color 3: Accent at full intensity (bright aurora edge)
const lighterG = Math.round(g * 255 * 0.35); const brightR = Math.round(r * 255);
const lighterB = Math.round(b * 255 * 0.35); const brightG = Math.round(g * 255);
const brightB = Math.round(b * 255);
const color3 = `#${brightR.toString(16).padStart(2, '0')}${brightG.toString(16).padStart(2, '0')}${brightB.toString(16).padStart(2, '0')}`;
return [ return [color1, color2, color3];
`#${darkerR.toString(16).padStart(2, '0')}${darkerG.toString(16).padStart(2, '0')}${darkerB.toString(16).padStart(2, '0')}`,
`#${baseR.toString(16).padStart(2, '0')}${baseG.toString(16).padStart(2, '0')}${baseB.toString(16).padStart(2, '0')}`,
`#${lighterR.toString(16).padStart(2, '0')}${lighterG.toString(16).padStart(2, '0')}${lighterB.toString(16).padStart(2, '0')}`,
];
} }
export function Aurora({ amplitude = 1.0, blend = 0.5, speed = 0.5 }: AuroraProps) { export function Aurora({ amplitude = 1.0, blend = 1.0, speed = 1.0 }: AuroraProps) {
const containerRef = useRef<HTMLDivElement>(null); const containerRef = useRef<HTMLDivElement>(null);
const animationFrameRef = useRef<number>(0); const animationFrameRef = useRef<number>(0);
const rendererRef = useRef<Renderer | null>(null); const rendererRef = useRef<Renderer | null>(null);