Spaces:
Sleeping
Sleeping
File size: 2,068 Bytes
292de4b |
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 |
export function updateBackground(): void {
const hour = new Date().getHours();
const background = document.getElementById('bg') as HTMLElement | null;
if (!background) {
console.warn("Background element not found, will retry later.");
setTimeout(updateBackground, 500); // Retry after a delay
return;
}
let color1, color2, color3; // Colors for the radial gradients and background
if (hour >= 6 && hour < 8) {
// Early morning
color1 = 'rgba(173, 216, 230, 0.3)';
color2 = 'rgba(135, 206, 250, 0.3)';
color3 = '#B0E0E6'; // Powder blue
} else if (hour >= 8 && hour < 10) {
// Mid-morning
color1 = 'rgba(240, 230, 140, 0.3)';
color2 = 'rgba(238, 232, 170, 0.3)';
color3 = '#F0E68C'; // Khaki
} else if (hour >= 10 && hour < 12) {
// Late morning
color1 = 'rgba(250, 250, 210, 0.3)';
color2 = 'rgba(255, 255, 224, 0.3)';
color3 = '#FFFACD'; // Lemon chiffon
} else if (hour >= 12 && hour < 14) {
// Early afternoon
color1 = 'rgba(255, 182, 193, 0.3)';
color2 = 'rgba(255, 192, 203, 0.3)';
color3 = '#FFB6C1'; // Light pink
} else if (hour >= 14 && hour < 16) {
// Mid-afternoon
color1 = 'rgba(255, 160, 122, 0.3)';
color2 = 'rgba(255, 127, 80, 0.3)';
color3 = '#FFA07A'; // Light salmon
} else if (hour >= 16 && hour < 18) {
// Late afternoon to early evening
color1 = 'rgba(255, 99, 71, 0.3)';
color2 = 'rgba(255, 69, 0, 0.3)';
color3 = '#FF4500'; // Orange red
} else {
// Night
color1 = 'black';
color2 = 'black';
color3 = '#000080'; // Navy blue for a slightly softer night effect
}
// Set the background image and color
background.style.backgroundImage =
`radial-gradient(circle at 20% 20%, ${color1}, transparent 70%),
radial-gradient(circle at 80% 80%, ${color2}, transparent 70%)`;
background.style.backgroundColor = color3;
}
|