fix styling

assets/css/style.css

@@ -68,7 +68,7 @@ header {
     height: 1em;
 }
 
-header .middle {
+header .end {
     font-size: 1.2em;
     display: flex;
     gap: 1em;

templates/en/partials/topbar.eta

@@ -48,12 +48,12 @@
 <header>
     <p><%~ timeIcon %> <span id="topbarTime"><%= date.toLocaleString('en-US', { hour: 'numeric', minute: 'numeric', second: 'numeric', hour12: true }) %></span></p>
     
-    <div class="middle">
+    <p><%~ dateIcon %> <span id="topbarDate"><%= date.toLocaleDateString('en-US', { weekday: "long", year: "numeric", month: "long", day: "numeric" }) %></span></p>
+    
+    <div class="end">
         <a role="button" href="/"><%~ skFlag %></a>
         <a role="button" href="/en/settings"><%~ settingsIcon %></a>
     </div>
-    
-    <p><%~ dateIcon %> <span id="topbarDate"><%= date.toLocaleDateString('en-US', { weekday: "long", year: "numeric", month: "long", day: "numeric" }) %></span></p>
 
     <script defer>
         setInterval(() => {

templates/sk/partials/topbar.eta

@@ -45,13 +45,13 @@
 <header>
     <p><%~ timeIcon %> <span id="topbarTime"><%= date.toLocaleString('sk-SK', { hour: 'numeric', minute: 'numeric', second: 'numeric' }) %></span></p>
     
-    <div class="middle">
+    <p><%~ dateIcon %> <span id="topbarDate"><%= date.toLocaleDateString('sk-SK', { weekday: "long", year: "numeric", month: "long", day: "numeric" }) %></span></p>
+    
+    <div class="end">
         <a role="button" href="/en"><%~ usFlag %></a>
         <a role="button" href="/settings"><%~ settingsIcon %></a>
     </div>
     
-    <p><%~ dateIcon %> <span id="topbarDate"><%= date.toLocaleDateString('sk-SK', { weekday: "long", year: "numeric", month: "long", day: "numeric" }) %></span></p>
-
     <script defer>
         setInterval(() => {
             const topbarTime = document.querySelector("#topbarTime")