Closed Unklebens closed 1 month ago
@Unklebens - you can use the following code, add it into the custom JS in settings:
// Create a container for the clocks
const clockContainer = document.createElement('div');
clockContainer.id = 'custom-clocks';
clockContainer.style.position = 'fixed';
clockContainer.style.top = '10px';
clockContainer.style.right = '10px';
clockContainer.style.fontSize = '20px';
clockContainer.style.fontFamily = 'Arial, sans-serif';
clockContainer.style.color = '#ffffff'; // Change this to match your theme
clockContainer.style.textAlign = 'right';
clockContainer.style.backgroundColor = 'rgba(0, 0, 0, 0.5)'; // 50% opaque background
clockContainer.style.padding = '10px';
clockContainer.style.borderRadius = '5px';
document.body.appendChild(clockContainer);
// Create elements for Chicago and Rome clocks
const chicagoClock = document.createElement('div');
const romeClock = document.createElement('div');
clockContainer.appendChild(chicagoClock);
clockContainer.appendChild(romeClock);
// Function to update the clocks
function updateClocks() {
const now = new Date();
// Chicago (Central Time)
const chicagoTime = now.toLocaleTimeString('en-US', { timeZone: 'America/Chicago', hour12: false, hour: '2-digit', minute: '2-digit' });
chicagoClock.textContent = `Chicago: ${chicagoTime}`;
// Rome (Central European Time)
const romeTime = now.toLocaleTimeString('it-IT', { timeZone: 'Europe/Rome', hour12: false, hour: '2-digit', minute: '2-digit' });
romeClock.textContent = `Rome: ${romeTime}`;
}
// Update the clocks every minute
setInterval(updateClocks, 60000);
// Initial call to display the clocks immediately
updateClocks();
Looks like this - you can change the style anyway you like
Thanks for your code snippet it helped a lot
I would really like to local and some distant times displayed. Some family is living abroad and having a corner of heimdall displaying seperates times zones would be a nice to have being able to choose witch corner would be nice and being able to colorize each one would also be a nice to have too