Tweak UI

Author: ThomasFarstrike

index.html

@@ -112,18 +112,26 @@
         }
         /* Old Releases Toggle */
         .old-releases-toggle {
-            margin: 1rem 0;
-            padding: 0.6rem 1.2rem;
-            background-color: #ecf0f1;
+            margin: 0.8rem 0 0.5rem 8rem;
+            padding: 0.4rem 1rem;
+            background: linear-gradient(to bottom, #f8f9fa, #e9ecef);
             border: 1px solid #bdc3c7;
-            border-radius: 4px;
+            border-radius: 6px;
             cursor: pointer;
-            font-size: 1rem;
-            color: #2c3e50;
-            transition: background-color 0.2s;
+            font-size: 0.9rem;
+            color: #495057;
+            transition: all 0.2s ease;
+            box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
         }
         .old-releases-toggle:hover {
-            background-color: #d5dbdb;
+            background: linear-gradient(to bottom, #e9ecef, #dee2e6);
+            border-color: #95a5a6;
+            box-shadow: 0 2px 5px rgba(0, 0, 0, 0.15);
+            transform: translateY(-1px);
+        }
+        .old-releases-toggle:active {
+            transform: translateY(0);
+            box-shadow: 0 1px 2px rgba(0, 0, 0, 0.1);
         }
         .old-releases-section {
             max-height: 0;
@@ -156,6 +164,12 @@
                 display: block;
                 margin: 0.5rem 0;
             }
+            .old-releases-toggle {
+                margin-left: 0;
+            }
+            .old-releases-label {
+                margin-left: 0;
+            }
         }
     </style>
 </head>
@@ -177,7 +191,7 @@ <h2>Install MicroPythonOS</h2>
                     <br/>
                     <button class="old-releases-toggle" onclick="toggleOldReleases()">Show old releases ▼</button>
                     <div id="oldReleasesSection" class="old-releases-section">
-                        <p class="old-releases-label">Old releases, only for reverting or troubleshooting:</p>
+                        <div class="old-releases-label">These old releases are only here for archival, reverting, testing or troubleshooting.</div>
                         <label><input type="radio" name="device" value="/manifests/Waveshare/ESP32-S3-Touch-LCD-2/Waveshare_ESP32-S3-Touch-LCD-2_0.4.x.json" onchange="updateManifest()"> Waveshare ESP32-S3-Touch-LCD-2: version 0.4.0</label>
                         <label><input type="radio" name="device" value="/manifests/Waveshare/ESP32-S3-Touch-LCD-2/Waveshare_ESP32-S3-Touch-LCD-2_0.3.x.json" onchange="updateManifest()"> Waveshare ESP32-S3-Touch-LCD-2: version 0.3.2</label>
                         <label><input type="radio" name="device" value="/manifests/Waveshare/ESP32-S3-Touch-LCD-2/Waveshare_ESP32-S3-Touch-LCD-2_0.2.x.json" onchange="updateManifest()"> Waveshare ESP32-S3-Touch-LCD-2: version 0.2.1</label>