From f773aacd20a202a13eb7165a150a9e9abd2561a5 Mon Sep 17 00:00:00 2001
From: nobody <info@localcdn.org>
Date: Fri, 30 Jul 2021 21:41:53 +0200
Subject: [PATCH] Release notes redesigned

---
 pages/updates/updates.css  | 22 ++++++++++++++----
 pages/updates/updates.html | 47 +++++++++++++++++++++++---------------
 2 files changed, 46 insertions(+), 23 deletions(-)

diff --git a/pages/updates/updates.css b/pages/updates/updates.css
index 03f25acf..e8debeb9 100644
--- a/pages/updates/updates.css
+++ b/pages/updates/updates.css
@@ -2,16 +2,15 @@
     font-weight: bold;
 }
 
-.subtle-hint > ul,
+#history-release-notes {
+    display: none;
+}
+
 #history-release-notes > ul {
     border-bottom: 1px solid #ccc;
     padding-bottom: 20px;
 }
 
-#history-release-notes {
-    display: none;
-}
-
 input[type=radio] {
     margin: 0;
 }
@@ -46,3 +45,16 @@ input[type=radio], label {
     border-radius: 5px;
     color: #555;
 }
+.release-notes-area {
+    border-bottom: 1px solid #ccc;
+    margin: 20px 0;
+}
+.release-notes-area > p {
+    font-size: larger;
+    font-weight: bold;
+    margin: 0;
+}
+
+.release-notes-area > ul {
+    margin: 0 0 20px 0;
+}
diff --git a/pages/updates/updates.html b/pages/updates/updates.html
index 86e89ed3..ac8a514a 100644
--- a/pages/updates/updates.html
+++ b/pages/updates/updates.html
@@ -22,25 +22,36 @@
             <div class="notice">
                 <div class="subtle-hint">
                     <div class="topic-label">
-                        New in LocalCDN:
+                        <h2>New in LocalCDN:</h2>
+                    </div>
+                    <div class="release-notes-area">
+                        <p>Updated</p>
+                        <ul>
+                            <li>Chart.js v3.4.1 -> v3.5.0 (<a href="https://codeberg.org/nobody/LocalCDN/issues/586">#586</a>)</li>
+                            <li>video.js v7.14.2 -> v7.15.0 (<a href="https://codeberg.org/nobody/LocalCDN/issues/587">#587</a>)</li>
+                            <li>findify-bundle v7.0.24 -> v7.0.25 (<a href="https://codeberg.org/nobody/LocalCDN/issues/588">#588</a>)</li>
+                            <li>flv.js v1.6.0 -> v1.6.1 (<a href="https://codeberg.org/nobody/LocalCDN/issues/589">#589</a>)</li>
+                            <li>webrtc-adapter v8.0.0 -> v8.1.0 (<a href="https://codeberg.org/nobody/LocalCDN/issues/591">#591</a>)</li>
+                            <li>bootstrap-multiselect v1.1.0 (<a href="https://codeberg.org/nobody/LocalCDN/issues/592">#592</a>)</li>
+                        </ul>
+                        <p>Mapping</p>
+                        <ul>
+                            <li>vuex -> cdn.jsdelivr.net (<a href="https://codeberg.org/nobody/LocalCDN/commit/9d2595a1d3391097ca51fd1df0234b7f2d19a33f">#9d2595a1d3</a>)</li>
+                        </ul>
+                        <p>Added</p>
+                        <ul>
+                            <li>exif-js v2.3.0 (<a href="https://codeberg.org/nobody/LocalCDN/issues/590">#590</a>)</li>
+                        </ul>
+                        <p>Fixed</p>
+                        <ul>
+                            <li>Version detection of Vue.js (<a href="https://codeberg.org/nobody/LocalCDN/commit/465a18cb04e21968ee1b33519d77982475c28308">#465a18cb04</a>)</li>
+                            <li>Latest version of toastr.js (<a href="https://codeberg.org/nobody/LocalCDN/issues/590">#590</a>)</li>
+                        </ul>
+                        <p>Improved</p>
+                        <ul>
+                            <li>FAQ and options page about generated rules (<a href="https://codeberg.org/nobody/LocalCDN/commit/edad875768e00d72ca64cb36d0aa700636e1b0e8">#edad875768</a>)</li>
+                        </ul>
                     </div>
-                    <ul>
-                        <li>Updated: Chart.js v3.4.1 -> v3.5.0 (<a href="https://codeberg.org/nobody/LocalCDN/issues/586">#586</a>)</li>
-                        <li>Updated: video.js v7.14.2 -> v7.15.0 (<a href="https://codeberg.org/nobody/LocalCDN/issues/587">#587</a>)</li>
-                        <li>Updated: findify-bundle v7.0.24 -> v7.0.25 (<a href="https://codeberg.org/nobody/LocalCDN/issues/588">#588</a>)</li>
-                        <li>Updated: flv.js v1.6.0 -> v1.6.1 (<a href="https://codeberg.org/nobody/LocalCDN/issues/589">#589</a>)</li>
-                        <li>Updated: webrtc-adapter v8.0.0 -> v8.1.0 (<a href="https://codeberg.org/nobody/LocalCDN/issues/591">#591</a>)</li>
-                        <li>Updated: bootstrap-multiselect v1.1.0 (<a href="https://codeberg.org/nobody/LocalCDN/issues/592">#592</a>)</li>
-                        <br>
-                        <li>Mapping: vuex -> cdn.jsdelivr.net</li>
-                        <br>
-                        <li>Added: exif-js v2.3.0 (<a href="https://codeberg.org/nobody/LocalCDN/issues/590">#590</a>)</li>
-                        <br>
-                        <li>Fixed: Version detection of Vue.js</li>
-                        <li>Fixed: Latest version of toastr.js (<a href="https://codeberg.org/nobody/LocalCDN/issues/590">#590</a>)</li>
-                        <br>
-                        <li>Improved: FAQ and options page about generated rules</li>
-                    </ul>
                     <div id="generator-section">
                         <div class="topic-label">
                             Generate rule sets for your adblocker