From 2e435683aa0080bda6e8be0955e86b03004e70fb Mon Sep 17 00:00:00 2001
From: ivarlovlie <git@ivarlovlie.no>
Date: Sun, 31 Jul 2022 20:44:12 +0200
Subject: refactor: Move shared preloaded js and css into web-shared

---
 apps/frontpage/src/app.html | 147 +-------------------------------------------
 1 file changed, 2 insertions(+), 145 deletions(-)

(limited to 'apps/frontpage/src')

diff --git a/apps/frontpage/src/app.html b/apps/frontpage/src/app.html
index 1c46682..922aeec 100644
--- a/apps/frontpage/src/app.html
+++ b/apps/frontpage/src/app.html
@@ -4,151 +4,8 @@
   <meta charset="utf-8"/>
   <link rel="icon"
         href="%sveltekit.assets%/favicon.png"/>
-  <style>
-    :root {
-      --loader-primary: hsl(250, 84%, 54%);
-      --loader-accent: hsl(342, 89%, 48%);
-      --loader-contrast: hsl(180, 1%, 84%);
-      --loader-easing: cubic-bezier(0.645, 0.045, 0.355, 1);
-    }
-
-    [data-theme="dark"] :root {
-      --loader-primary: hsl(250, 93%, 65%);
-      --loader-accent: hsl(342, 92%, 54%);
-      --loader-contrast: hsl(208, 12%, 24%);
-      --loader-easing: cubic-bezier(0.645, 0.045, 0.355, 1);
-    }
-
-    [data-theme="dark"] {
-      background-color: hsl(203, 24%, 13%);
-    }
-
-    .fill-loader {
-      position: relative;
-      overflow: hidden;
-      display: inline-block;
-      margin: 3rem;
-    }
-
-    .fill-loader__fill {
-      position: absolute;
-    }
-
-    @supports (-webkit-animation-name: this) or (animation-name: this) {
-      .fill-loader__label {
-        position: absolute;
-        clip: rect(1px, 1px, 1px, 1px);
-        -webkit-clip-path: inset(50%);
-        clip-path: inset(50%);
-      }
-    }
-
-    @supports (-webkit-animation-name: this) or (animation-name: this) {
-      .fill-loader--v4 {
-        width: 90%;
-        max-width: 300px;
-      }
-
-      .fill-loader--v4 .fill-loader__base {
-        height: 4px;
-        background-color: var(--loader-contrast);
-      }
-
-      .fill-loader--v4 .fill-loader__fill {
-        top: 0;
-        left: 0;
-        right: 0;
-        height: 100%;
-        background-color: var(--loader-primary);
-        -webkit-animation: fill-loader-4 1.6s infinite var(--loader-easing);
-        animation: fill-loader-4 1.6s infinite var(--loader-easing);
-        will-change: left, right;
-      }
-    }
-
-    @-webkit-keyframes fill-loader-4 {
-      0% {
-        left: 0;
-        right: 100%;
-        background-color: var(--loader-primary);
-      }
-
-      10%,
-      60% {
-        left: 0;
-      }
-
-      40%,
-      90% {
-        right: 0;
-      }
-
-      50% {
-        left: 100%;
-        background-color: var(--loader-primary);
-      }
-
-      51% {
-        left: 0;
-        right: 100%;
-        background-color: var(--loader-accent);
-      }
-
-      100% {
-        left: 100%;
-        background-color: var(--loader-accent);
-      }
-    }
-
-    @keyframes fill-loader-4 {
-      0% {
-        left: 0;
-        right: 100%;
-        background-color: var(--loader-primary);
-      }
-
-      10%,
-      60% {
-        left: 0;
-      }
-
-      40%,
-      90% {
-        right: 0;
-      }
-
-      50% {
-        left: 100%;
-        background-color: var(--loader-primary);
-      }
-
-      51% {
-        left: 0;
-        right: 100%;
-        background-color: var(--loader-accent);
-      }
-
-      100% {
-        left: 100%;
-        background-color: var(--loader-accent);
-      }
-    }
-  </style>
-  <script>
-    const value = `; ${document.cookie}`;
-    const parts = value.split(`; go_theme=`);
-    let currentTheme = "system";
-    if (parts.length === 2) {
-      currentTheme = parts.pop().split(";").shift();
-    }
-    if (currentTheme === "light") {
-      document.querySelector("html").dataset.theme = "light";
-    } else if (currentTheme === "dark") {
-      document.querySelector("html").dataset.theme = "dark";
-    } else {
-      document.querySelector("html").dataset.theme = window.matchMedia("(prefers-color-scheme: dark)").matches ? "dark" : "light";
-    }
-  </script>
+  <link rel="stylesheet" href="%sveltekit.assets%/preload.css">
+  <script src="%sveltekit.assets%/preload.js"></script>
   <meta name="viewport"
         content="width=device-width, initial-scale=1"/>
   %sveltekit.head%
-- 
cgit v1.3