From 8e6f31e4219f70d9852af6a062e4ec2345734a95 Mon Sep 17 00:00:00 2001
From: =?utf8?q?Roland=20H=C3=A4der?= <roland@mxchange.org>
Date: Thu, 22 Jun 2023 18:24:48 +0200
Subject: [PATCH] Continued: - CSS notice box added - text aligned to left,
 header to centered - rounded corners look beautiful!

---
 templates/base.html             | 21 ++++++++++++++++++---
 templates/views/scoreboard.html | 24 ++++++++++++++----------
 2 files changed, 32 insertions(+), 13 deletions(-)

diff --git a/templates/base.html b/templates/base.html
index 9d3e735..864291b 100644
--- a/templates/base.html
+++ b/templates/base.html
@@ -17,7 +17,7 @@
         }
 
         h1 {
-            background-color: #f0f0f0;
+            background-color: #eaeaea;
             border-radius: 5px;
             padding-left: 5px;
             padding-right: 5px;
@@ -30,7 +30,7 @@
 
         table {
             width: 100%;
-            border: 2px solid #f0f0f0;
+            border: 2px solid #eaeaea;
             border-spacing: 0px;
             border-radius: 5px;
         }
@@ -41,7 +41,7 @@
         }
 
         table tr:nth-of-type(2n), thead {
-            background-color: #f0f0f0;
+            background-color: #eaeaea;
         }
 
         table td {
@@ -91,6 +91,21 @@
             min-width: 50%;
             width: 50em;
         }
+        .notes {
+            margin-left: auto;
+            margin-right: auto;
+            margin-bottom: 20px;
+            width: 50em;
+            text-align: left;
+            border: 1px solid #eaeaea;
+            border-radius: 5px;
+        }
+        .notes > h2 {
+            margin: 0px;
+            padding: 5px;
+            background-color: #eaeaea;
+            text-align: center;
+        }
     </style>
 </head>
 
diff --git a/templates/views/scoreboard.html b/templates/views/scoreboard.html
index 53cc3ec..bb2236b 100644
--- a/templates/views/scoreboard.html
+++ b/templates/views/scoreboard.html
@@ -19,7 +19,7 @@
         <h1>TOP {{amount}} average peer count</h1>
     {% elif mode == 'obsfucator' %}
         <h1>TOP {{amount}} obsfucating software</h1>
-    {% elif mode == 'obsfucator' %}
+    {% elif mode == 'obsfucation' %}
         <h1>Obsfucation metrics</h1>
     {% endif %}
 {% endblock %}
@@ -58,16 +58,20 @@
 
 {% block footer %}
     {% if mode == 'error_code' %}
-        <h2>Please note to error codes:</h2>
-        <ul>
-            <li>Error code 999 is fake and covers a lot of reasons why the domain/instance is not reachable. Mostly that the domain is not resolvable or the server refused connection.</li>
-        </ul>
+        <div class="notes">
+            <h2>Please note to error codes:</h2>
+            <ul>
+                <li>Error code 999 is fake and covers a lot of reasons why the domain/instance is not reachable. Mostly that the domain is not resolvable or the server refused connection.</li>
+            </ul>
+        </div>
     {% elif mode == 'obsfucation' %}
-        <h2>Please note to obsfucation status:</h2>
-        <ul>
-            <li>Only supported networks are listed here.</li>
-            <li><em>None</em> means not determined yet.</li>
-        </ul>
+        <div class="notes">
+            <h2>Please note to obsfucation status:</h2>
+            <ul>
+                <li>Only supported networks are counted here.</li>
+                <li><em>None</em> means not determined yet.</li>
+            </ul>
+        </div>
     {% endif %}
     <a href="{{base_url}}/">Index</a> /
     {{ super() }}
-- 
2.39.2