Add kawaii mode~ ✨

Signed-off-by: Asahi Lina <[email protected]>
AsahiLinux · May 2, 2024 · cf4fe5b · cf4fe5b
1 parent cbf010c
commit cf4fe5b
Show file tree

Hide file tree

Showing 6 changed files with 299 additions and 2 deletions.
diff --git a/layouts/index.html b/layouts/index.html
@@ -11,7 +11,7 @@ <h2>Install from macOS</h2>
             <h3><a class="more" href="/fedora/#device-support">Device support<i class="fas fa-angle-right more"></i></a></h3>
         </div>
         <div>
-            <img src="/img/asahilinux_laptop.svg?{{ slicestr (readFile "static/img/asahilinux_laptop.svg" | md5) 0 8 }}" alt="Asahi Linux on a laptop">
+            <img class="laptop" src="/img/asahilinux_laptop.svg?{{ slicestr (readFile "static/img/asahilinux_laptop.svg" | md5) 0 8 }}" alt="Asahi Linux on a laptop">
         </div>
     </div>
 </section>

diff --git a/layouts/partials/footer.html b/layouts/partials/footer.html
@@ -5,7 +5,9 @@
                     <img src="/img/AsahiLinux_logomark.svg" class="logo" alt="Asahi Linux logo">
                 </a>
                 <span class="license">Licensed under CC BY-SA 4.0</span>
-                <span class="disclaimer">Linux® is the registered trademark of Linus Torvalds in the U.S. and other countries. All other product names, logos, and brands are property of their respective owners.</span>
+                <span class="disclaimer">Linux® is the registered trademark of Linus Torvalds in the U.S. and other countries. All other product names, logos, and brands are property of their respective owners.
+                    <span class="kawaii-disclaimer">Kawaii Asahi Linux logo by <a href="https://github.com/SAWARATSUKI/Logos">SAWARATSUKI</a> (see link for license).</span>
+                </span>
             </div>
             <div class="footer-links">
                 <ul class="footer-services">

diff --git a/layouts/partials/header.html b/layouts/partials/header.html
@@ -25,6 +25,15 @@
 
     <meta property="og:image" content="https://asahilinux.org/img/AsahiLinux_logomark_256px.png">
     <meta property="og:title" content="{{ if not .IsHome }}{{.Title}} - {{ end }}Asahi Linux">
+    <script>
+        var kawaii = (new URLSearchParams(window.location.search)).get("kawaii") ?? localStorage.getItem("kawaii");
+        if (kawaii == "true") {
+            document.documentElement.classList.add("kawaii");
+            localStorage.setItem("kawaii", "true");
+        } else {
+            localStorage.removeItem("kawaii");
+        }
+    </script>
 </head>
 <body class="{{ .Scratch.Get "body_class" }}">
     <header id="header">

diff --git a/static/css/main.css b/static/css/main.css
@@ -1311,6 +1311,27 @@ ul.footer-services i {
     opacity: 0.8;
 }
 
+.disclaimer a {
+    text-decoration: underline;
+}
+
+/* Kawaii mode */
+html.kawaii img.logo {
+    content: url("/img/AsahiLinux_kawaii_logo.png");
+}
+
+html.kawaii img.laptop {
+    content: url("/img/asahilinux_kawaii_laptop.svg");
+}
+
+.kawaii-disclaimer {
+    display: none;
+}
+
+html.kawaii .kawaii-disclaimer {
+    display: inline;
+}
+
 @media screen and (max-width: 1050px) {
     .community-links > div {
         display: block;

diff --git a/static/img/AsahiLinux_kawaii_logo.png b/static/img/AsahiLinux_kawaii_logo.png
diff --git a/static/img/asahilinux_kawaii_laptop.svg b/static/img/asahilinux_kawaii_laptop.svg