diff --git a/index.html b/index.html
index 45306b8..0ca3d55 100644
--- a/index.html
+++ b/index.html
@@ -48,13 +48,27 @@
border: 1px solid rgba(255, 255, 255, 0.18);
z-index: 1000;
display: flex;
- align-items: center;
+ flex-direction: column;
gap: 10px;
opacity: 0;
pointer-events: none;
transition: opacity 0.3s ease;
}
+ .theme-selector-row {
+ display: flex;
+ align-items: center;
+ gap: 10px;
+ }
+
+ .theme-date-range {
+ color: rgba(255, 255, 255, 0.9);
+ font-size: 0.85rem;
+ text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.5);
+ font-style: italic;
+ text-align: center;
+ }
+
.theme-selector label {
color: white;
font-weight: bold;
@@ -626,15 +640,18 @@
-
-
+
+
+
+
+
@@ -1579,6 +1596,34 @@
// Check for theme change every hour
setInterval(applyTheme, 1000 * 60 * 60);
+ // Function to update theme date range display
+ function updateThemeDateInfo() {
+ const themeDropdown = document.getElementById('theme-dropdown');
+ const dateInfoElement = document.getElementById('theme-date-info');
+ const selectedThemeKey = themeDropdown.value;
+
+ if (selectedThemeKey === 'auto') {
+ dateInfoElement.textContent = 'Basert på dato';
+ return;
+ }
+
+ const theme = themes[selectedThemeKey];
+ if (!theme.dateRange) {
+ dateInfoElement.textContent = 'Resten av året';
+ return;
+ }
+
+ const monthNames = ['jan', 'feb', 'mar', 'apr', 'mai', 'jun',
+ 'jul', 'aug', 'sep', 'okt', 'nov', 'des'];
+
+ const startMonth = monthNames[theme.dateRange.startMonth];
+ const endMonth = monthNames[theme.dateRange.endMonth];
+ const startDay = theme.dateRange.startDay;
+ const endDay = theme.dateRange.endDay;
+
+ dateInfoElement.textContent = `${startDay}. ${startMonth} - ${endDay}. ${endMonth}`;
+ }
+
// Initialize theme dropdown
document.addEventListener('DOMContentLoaded', function() {
const themeDropdown = document.getElementById('theme-dropdown');
@@ -1587,11 +1632,15 @@
const savedTheme = localStorage.getItem('selectedTheme') || 'auto';
themeDropdown.value = savedTheme;
+ // Update date info on load
+ updateThemeDateInfo();
+
// Handle theme selection
themeDropdown.addEventListener('change', function() {
const selectedTheme = this.value;
localStorage.setItem('selectedTheme', selectedTheme);
applyTheme();
+ updateThemeDateInfo();
});
});