From 457732ae030e5e8611459600710fa1fcf9b2c395 Mon Sep 17 00:00:00 2001
From: Booteille <booteille@protonmail.com>
Date: Wed, 27 Nov 2024 03:22:16 +0100
Subject: [PATCH] minor tweaks

---
 themes/default/public/css/lufi.css            |   4 +
 themes/default/templates/index.html.ep        |   2 +-
 .../default/templates/layouts/default.html.ep | 158 +++++++++---------
 3 files changed, 85 insertions(+), 79 deletions(-)
diff --git a/themes/default/public/css/lufi.css b/themes/default/public/css/lufi.css
index c332c0a..d1500a2 100644
--- a/themes/default/public/css/lufi.css
+++ b/themes/default/public/css/lufi.css
@@ -96,6 +96,10 @@ a {
   color: var(--active-color);
 }
 
+a:hover {
+  filter: brightness(80%);
+}
+
 a:visited {
   color: var(--active-color);
 }
diff --git a/themes/default/templates/index.html.ep b/themes/default/templates/index.html.ep
index 6abd028..9007345 100644
--- a/themes/default/templates/index.html.ep
+++ b/themes/default/templates/index.html.ep
@@ -302,4 +302,4 @@ document.addEventListener('DOMContentLoaded', () => {
   }
 });
 </script>
-%= javascript '/js/lufi-upload.js', type => 'module'
+%= javascript '/js/lufi-upload.js', type => 'module', defer => "true"
diff --git a/themes/default/templates/layouts/default.html.ep b/themes/default/templates/layouts/default.html.ep
index 4c6c466..549aedc 100644
--- a/themes/default/templates/layouts/default.html.ep
+++ b/themes/default/templates/layouts/default.html.ep
@@ -17,6 +17,7 @@
         <link rel="apple-touch-icon" sizes="152x152" href="<%= url_for('/img/lufi152.png') %>">
         <link rel="apple-touch-icon-precomposed" sizes="128x128" href="<%= url_for('/img/lufi128.png') %>">
         <meta name="viewport" content="width=device-width, initial-scale=1.0">
+        <link rel="preload" href="/css/lufi.css" as="style">
         <link rel="stylesheet" href="/css/lufi.css">
     </head>
     <body>
@@ -62,82 +63,11 @@
       </header>
 
       <main role="main">
-        <script type="text/javascript">
-          const langUrl = '<%= url_for('lang') %>';
-          const prefix  = '<%= substr(config('prefix'), 1) %>';
-
-          const entityMap = {
-            "&": "&amp;",
-            "<": "&lt;",
-            ">": "&gt;",
-            '"': "&quot;",
-            "'": "&#39;",
-            "/": "&#x2F;",
-          };
-
-          const escapeHtml = (string) => String(string).replace(/[&<>"'\/]/g, (s) => entityMap[s]);
-
-          const formatDate = (unixTimestamp) => {
-            return new Date(unixTimestamp * 1000).toLocaleString(
-              window.navigator.language,
-              {
-                year: "numeric",
-                month: "long",
-                day: "numeric",
-                weekday: "long",
-                hour: "2-digit",
-                minute: "2-digit",
-              }
-            );
-          };
-
-          const addToast = (text, type) => {
-            const toastDOM = document.querySelector("template#toast").content.cloneNode(true).children[0];
-            toastDOM.classList.add(type)
-
-            toastDOM.querySelector(".message").innerText = escapeHtml(text);
-
-            document.querySelector(".toast-container").appendChild(toastDOM);
-            setTimeout(() => {
-              toastDOM.remove();
-            }, 3500)
-
-            toastDOM.onclick = () => {
-              toastDOM.remove();
-            }
-          };
-
-          const notify = (title, body) => {
-            if (!"Notification" in window || typeof Notification === "undefined") {
-              console.log(
-                `This browser does not support desktop notification, cannot send following message: ${title} ${body}`
-              );
-              return;
-            }
-
-            if (Notification.permission !== "granted") {
-              Notification.requestPermission();
-            } else {
-              new Notification(title, {
-                body,
-                icon: "/img/lufi196.png",
-              });
-            }
-          };
-          
-          document.addEventListener("DOMContentLoaded", () => {            
-            if (!"Notification" in window || typeof Notification === "undefined") {
-              return;
-            }
-
-            if (Notification.permission !== "granted") {
-              Notification.requestPermission();
-            }
-            
-            document.getElementById("menu-language").onchange = (event) =>  window.location = langUrl + event.target.value;
-          })
-        </script>
         <%= content %>
+        
+      % if (defined(config('piwik_img'))) {
+        <img src="<%== config('piwik_img') %>" class="no_border" alt="" />
+      % }
       </main>
 
       <div class="toast-container"></div>
@@ -151,8 +81,80 @@
         </div>
       </template>
 
-      % if (defined(config('piwik_img'))) {
-        <img src="<%== config('piwik_img') %>" class="no_border" alt="" />
-      % }
+      <script type="text/javascript">
+        const langUrl = '<%= url_for('lang') %>';
+        const prefix  = '<%= substr(config('prefix'), 1) %>';
+
+        const entityMap = {
+          "&": "&amp;",
+          "<": "&lt;",
+          ">": "&gt;",
+          '"': "&quot;",
+          "'": "&#39;",
+          "/": "&#x2F;",
+        };
+
+        const escapeHtml = (string) => String(string).replace(/[&<>"'\/]/g, (s) => entityMap[s]);
+
+        const formatDate = (unixTimestamp) => {
+          return new Date(unixTimestamp * 1000).toLocaleString(
+            window.navigator.language,
+            {
+              year: "numeric",
+              month: "long",
+              day: "numeric",
+              weekday: "long",
+              hour: "2-digit",
+              minute: "2-digit",
+            }
+          );
+        };
+
+        const addToast = (text, type) => {
+          const toastDOM = document.querySelector("template#toast").content.cloneNode(true).children[0];
+          toastDOM.classList.add(type)
+
+          toastDOM.querySelector(".message").innerText = escapeHtml(text);
+
+          document.querySelector(".toast-container").appendChild(toastDOM);
+          setTimeout(() => {
+            toastDOM.remove();
+          }, 3500)
+
+          toastDOM.onclick = () => {
+            toastDOM.remove();
+          }
+        };
+
+        const notify = (title, body) => {
+          if (!"Notification" in window || typeof Notification === "undefined") {
+            console.log(
+              `This browser does not support desktop notification, cannot send following message: ${title} ${body}`
+            );
+            return;
+          }
+
+          if (Notification.permission !== "granted") {
+            Notification.requestPermission();
+          } else {
+            new Notification(title, {
+              body,
+              icon: "/img/lufi196.png",
+            });
+          }
+        };
+        
+        document.addEventListener("DOMContentLoaded", () => {            
+          if (!"Notification" in window || typeof Notification === "undefined") {
+            return;
+          }
+
+          if (Notification.permission !== "granted") {
+            Notification.requestPermission();
+          }
+          
+          document.getElementById("menu-language").onchange = (event) =>  window.location = langUrl + event.target.value;
+        })
+      </script>
     </body>
 </html>
