From 9628803ca3c7aac1c9a6a968c4810f4bd051b8a0 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=C3=98yvind=20Andreas=20Nilsen?= Date: Fri, 21 Nov 2025 13:44:44 +0100 Subject: [PATCH 1/2] Theme chooser no longer requires test-mode. The selector now appears if you hover over the top right corner --- index.html | 41 +++++++++++++++++++++++++++-------------- 1 file changed, 27 insertions(+), 14 deletions(-) diff --git a/index.html b/index.html index 9e45526..83f2993 100644 --- a/index.html +++ b/index.html @@ -20,6 +20,22 @@ overflow-x: auto; } + .theme-trigger-area { + position: fixed; + top: 0; + right: 0; + width: 150px; + height: 100px; + z-index: 999; + cursor: pointer; + } + + .theme-trigger-area:hover + .theme-selector, + .theme-selector:hover { + opacity: 1; + pointer-events: auto; + } + .theme-selector { position: fixed; top: 20px; @@ -31,13 +47,12 @@ box-shadow: 0 4px 16px rgba(31, 38, 135, 0.37); border: 1px solid rgba(255, 255, 255, 0.18); z-index: 1000; - display: none; /* Hidden by default */ + display: flex; align-items: center; gap: 10px; - } - - .theme-selector.visible { - display: flex; + opacity: 0; + pointer-events: none; + transition: opacity 0.3s ease; } .theme-selector label { @@ -338,6 +353,10 @@ } @media (max-width: 768px) { + .theme-trigger-area { + display: none; /* Hide trigger on mobile */ + } + .theme-selector { position: relative; top: 0; @@ -345,6 +364,8 @@ margin-bottom: 20px; width: calc(100% - 40px); justify-content: center; + opacity: 1; + pointer-events: auto; } .theme-selector label { @@ -603,6 +624,7 @@ +