From 44b9a709f3e14eb65276245b532455f581167b0d Mon Sep 17 00:00:00 2001
From: hopperelec <hopperelec@gmail.com>
Date: Thu, 9 Nov 2023 05:40:26 +0000
Subject: [PATCH] Prettier For some reason the format and format-check use less
 strict settings than my IDE's "Reformat with Prettier" option

---
 src/app.d.ts              |  10 --
 src/lib/LogoText.svelte   | 136 +++++++++++++++------
 src/routes/+error.svelte  |  38 +++---
 src/routes/+layout.svelte | 251 +++++++++++++++++++++-----------------
 src/routes/+page.svelte   |   9 +-
 5 files changed, 259 insertions(+), 185 deletions(-)
 delete mode 100644 src/app.d.ts

diff --git a/src/app.d.ts b/src/app.d.ts
deleted file mode 100644
index 10ed528..0000000
--- a/src/app.d.ts
+++ /dev/null
@@ -1,10 +0,0 @@
-declare global {
-  namespace App {
-    // interface Error {}
-    // interface Locals {}
-    // interface PageData {}
-    // interface Platform {}
-  }
-}
-
-export {};
diff --git a/src/lib/LogoText.svelte b/src/lib/LogoText.svelte
index 0c8fdfd..60e16f6 100644
--- a/src/lib/LogoText.svelte
+++ b/src/lib/LogoText.svelte
@@ -1,43 +1,101 @@
 <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 44.5 8" width="100%">
-    <defs>
-        <mask id="matrix">
-            <rect id="letterRect" fill="white" width="4" height="8"/>
-            <path fill="none" stroke="black" d="M1 0 1 8 4 5 0 1 1 0 4 3 0 7 1 8M3 0 3 8 0 5 4 1 3 0 0 3 4 7 3 8M2 1 2 7" stroke-width=".2"/>
-        </mask>
-        <mask id="hopperMask">
-            <use href="#letterRect"/>
-            <svg stroke="black" stroke-width="10" fill="none" viewBox="0 0 216 200" x="1" y="1" width="2" height="4" preserveAspectRatio="none">
-                <polyline points="82 166, 108 179, 135 166"/>
-                <polyline points="54 130, 108 157, 162 130"/>
-                <polyline points="0 54, 108 108, 216 54"/>
-                <polyline points="49 78.5, 108 49, 167 78.5"/>
-                <line x1="108" y1="0" x2="108" y2="49"/>
-                <line x1="108" y1="200" x2="108" y2="108"/>
-            </svg>
-        </mask>
-    </defs>
-    <path mask="url(#matrix)" id="letterH" d="M0 1 1 2 1 4 3 2 3 0 4 1 4 5 3 6 3 4 1 6 1 8 0 7Z"/>
-    <path mask="url(#matrix)" id="letterO" transform="translate(4.5)" d="M1 0 2 1 1 2 1 6 2 7 1 8 0 7 0 1ZM3 0 4 1 4 7 3 8 2 7 3 6 3 2 2 1 3 0"/>
-    <path mask="url(#matrix)" id="letterP" transform="translate(9)" d="M1 0 2 1 1 2 1 4 2 5 1 6 1 8 0 7 0 1ZM3 0 4 1 4 5 3 6 2 5 3 4 3 2 2 1 3 0"/>
-    <use href="#letterP" x="4.5"/>
-    <path mask="url(#matrix)" id="letterE" transform="translate(18)" d="M1 0 2 1 3 0 4 1 3 2 2 1 1 2 1 4 2 3 2 3 3 4 2 5 1 4 1 6 2 7 3 6 4 7 3 8 2 7 1 8 0 7 0 1Z"/>
-    <g id="letterR" transform="translate(22.5)" mask="url(#hopperMask)">
-        <path mask="url(#matrix)" d="M1 0 2 1 3 0 4 1 4 5 3 6 4 7 3 8 1 6 1 8 0 7 0 1Z"/>
-        <svg id="hopper" viewBox="0 0 216 200" x="1" y="1" width="2" height="4" preserveAspectRatio="none">
-            <path fill="#636363" d="M108 0 L216 54 L216 103 L162 130 L162 152 L135 166 L135 187 L108 200 L82 187 L82 166 L54 152 L54 130 L0 103 L0 54Z"/>
-        </svg>
-    </g>
-    <use href="#letterE" x="9"/>
-    <path mask="url(#matrix)" id="letterL" transform="translate(31.5)" d="M1 0 1 6 2 7 3 6 4 7 3 8 2 7 1 8 0 7 0 1Z"/>
-    <use href="#letterE" x="18"/>
-    <path mask="url(#matrix)" id="letterC" transform="translate(40.5)" d="M1 0 2 1 3 0 4 1 3 2 2 1 1 2 1 4 1 4 1 6 2 7 3 6 4 7 3 8 2 7 1 8 0 7 0 1Z"/>
+  <defs>
+    <mask id="matrix">
+      <rect id="letterRect" fill="white" width="4" height="8" />
+      <path
+        fill="none"
+        stroke="black"
+        d="M1 0 1 8 4 5 0 1 1 0 4 3 0 7 1 8M3 0 3 8 0 5 4 1 3 0 0 3 4 7 3 8M2 1 2 7"
+        stroke-width=".2"
+      />
+    </mask>
+    <mask id="hopperMask">
+      <use href="#letterRect" />
+      <svg
+        stroke="black"
+        stroke-width="10"
+        fill="none"
+        viewBox="0 0 216 200"
+        x="1"
+        y="1"
+        width="2"
+        height="4"
+        preserveAspectRatio="none"
+      >
+        <polyline points="82 166, 108 179, 135 166" />
+        <polyline points="54 130, 108 157, 162 130" />
+        <polyline points="0 54, 108 108, 216 54" />
+        <polyline points="49 78.5, 108 49, 167 78.5" />
+        <line x1="108" y1="0" x2="108" y2="49" />
+        <line x1="108" y1="200" x2="108" y2="108" />
+      </svg>
+    </mask>
+  </defs>
+  <path
+    mask="url(#matrix)"
+    id="letterH"
+    d="M0 1 1 2 1 4 3 2 3 0 4 1 4 5 3 6 3 4 1 6 1 8 0 7Z"
+  />
+  <path
+    mask="url(#matrix)"
+    id="letterO"
+    transform="translate(4.5)"
+    d="M1 0 2 1 1 2 1 6 2 7 1 8 0 7 0 1ZM3 0 4 1 4 7 3 8 2 7 3 6 3 2 2 1 3 0"
+  />
+  <path
+    mask="url(#matrix)"
+    id="letterP"
+    transform="translate(9)"
+    d="M1 0 2 1 1 2 1 4 2 5 1 6 1 8 0 7 0 1ZM3 0 4 1 4 5 3 6 2 5 3 4 3 2 2 1 3 0"
+  />
+  <use href="#letterP" x="4.5" />
+  <path
+    mask="url(#matrix)"
+    id="letterE"
+    transform="translate(18)"
+    d="M1 0 2 1 3 0 4 1 3 2 2 1 1 2 1 4 2 3 2 3 3 4 2 5 1 4 1 6 2 7 3 6 4 7 3 8 2 7 1 8 0 7 0 1Z"
+  />
+  <g id="letterR" transform="translate(22.5)" mask="url(#hopperMask)">
+    <path
+      mask="url(#matrix)"
+      d="M1 0 2 1 3 0 4 1 4 5 3 6 4 7 3 8 1 6 1 8 0 7 0 1Z"
+    />
+    <svg
+      id="hopper"
+      viewBox="0 0 216 200"
+      x="1"
+      y="1"
+      width="2"
+      height="4"
+      preserveAspectRatio="none"
+    >
+      <path
+        fill="#636363"
+        d="M108 0 L216 54 L216 103 L162 130 L162 152 L135 166 L135 187 L108 200 L82 187 L82 166 L54 152 L54 130 L0 103 L0 54Z"
+      />
+    </svg>
+  </g>
+  <use href="#letterE" x="9" />
+  <path
+    mask="url(#matrix)"
+    id="letterL"
+    transform="translate(31.5)"
+    d="M1 0 1 6 2 7 3 6 4 7 3 8 2 7 1 8 0 7 0 1Z"
+  />
+  <use href="#letterE" x="18" />
+  <path
+    mask="url(#matrix)"
+    id="letterC"
+    transform="translate(40.5)"
+    d="M1 0 2 1 3 0 4 1 3 2 2 1 1 2 1 4 1 4 1 6 2 7 3 6 4 7 3 8 2 7 1 8 0 7 0 1Z"
+  />
 </svg>
 
 <style>
-    svg {
-        fill: var(--main-fg-color);
-    }
-    svg:hover #matrix path {
-        display: none;
-    }
-</style>
\ No newline at end of file
+  svg {
+    fill: var(--main-fg-color);
+  }
+  svg:hover #matrix path {
+    display: none;
+  }
+</style>
diff --git a/src/routes/+error.svelte b/src/routes/+error.svelte
index 88faaab..3ea9b39 100644
--- a/src/routes/+error.svelte
+++ b/src/routes/+error.svelte
@@ -1,27 +1,27 @@
 <script>
-    import { title } from "$lib/title.ts";
-    import { page } from '$app/stores';
-    title.set("Error "+$page.status);
+  import { title } from "$lib/title.ts";
+  import { page } from "$app/stores";
+  title.set("Error " + $page.status);
 </script>
 
 <div>
-    <h1 style="">An error has occurred!</h1>
-    <h2>{$page.status}: {$page.error?.message}</h2>
+  <h1 style="">An error has occurred!</h1>
+  <h2>{$page.status}: {$page.error?.message}</h2>
 </div>
 
 <style>
-    div {
-        width: 100%;
-        height: 100%;
-        display: flex;
-        align-items: center;
-        justify-content: center;
-        flex-direction: column;
-    }
+  div {
+    width: 100%;
+    height: 100%;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    flex-direction: column;
+  }
 
-    h1 {
-        font-size: 64px;
-        font-weight: bold;
-        color: white;
-    }
-</style>
\ No newline at end of file
+  h1 {
+    font-size: 64px;
+    font-weight: bold;
+    color: white;
+  }
+</style>
diff --git a/src/routes/+layout.svelte b/src/routes/+layout.svelte
index 5ffab38..f855075 100644
--- a/src/routes/+layout.svelte
+++ b/src/routes/+layout.svelte
@@ -1,131 +1,156 @@
 <script lang="ts">
-    import { page } from '$app/stores';
-    import LogoText from "$lib/LogoText.svelte";
-    import { title } from "$lib/title.ts"
-    import { BRAND_COLOR } from "$lib/constants.ts";
-    const links: {[key: string]: string;} = {
-        "Home": "/",
-    };
+  import { page } from "$app/stores";
+  import LogoText from "$lib/LogoText.svelte";
+  import { title } from "$lib/title.ts";
+  import { BRAND_COLOR } from "$lib/constants.ts";
+  const links: { [key: string]: string } = {
+    Home: "/",
+  };
 </script>
 
 <svelte:head>
-    <title>{$title || "website"}</title>
-    <meta name="msapplication-TileColor" content="{BRAND_COLOR}" />
-    <meta name="theme-color" content="{BRAND_COLOR}" />
+  <title>{$title || "website"}</title>
+  <meta name="msapplication-TileColor" content={BRAND_COLOR} />
+  <meta name="theme-color" content={BRAND_COLOR} />
 </svelte:head>
 <nav>
-    <ul>
-        {#each Object.entries(links) as [label, href]}
-            {#if $page.url.pathname === href}
-                <li class="active">{label}</li>
-            {:else}
-                <li><a href="{href}">{label}</a></li>
-            {/if}
-        {/each}
-    </ul>
+  <ul>
+    {#each Object.entries(links) as [label, href]}
+      {#if $page.url.pathname === href}
+        <li class="active">{label}</li>
+      {:else}
+        <li><a {href}>{label}</a></li>
+      {/if}
+    {/each}
+  </ul>
 </nav>
-<main style="--brand-color: {BRAND_COLOR}"><slot/></main>
-<footer><header><LogoText/></header></footer>
+<main style="--brand-color: {BRAND_COLOR}"><slot /></main>
+<footer><header><LogoText /></header></footer>
 
 <style>
-    /* Colors */
-    :global(:root) {
-        --main-bg-color: #333;
-        --secondary-bg-color: #444;
-        --main-fg-color: #0f0;
-        --border: 2px dashed black;
-    }
+  /* Colors */
+  :global(:root) {
+    --main-bg-color: #333;
+    --secondary-bg-color: #444;
+    --main-fg-color: #0f0;
+    --border: 2px dashed black;
+  }
 
-    :global(body) {
-        background-color: var(--secondary-bg-color);
-    }
+  :global(body) {
+    background-color: var(--secondary-bg-color);
+  }
 
-    main, header, li {
-        border: var(--border);
-        background-color: var(--main-bg-color);
-    }
+  main,
+  header,
+  li {
+    border: var(--border);
+    background-color: var(--main-bg-color);
+  }
 
-    main, li {
-        font-family: Segoe UI,Calibri,Arial,sans-serif;
-    }
+  main,
+  li {
+    font-family:
+      Segoe UI,
+      Calibri,
+      Arial,
+      sans-serif;
+  }
 
-    /* Structure */
-    main {
-        width: 90vw;
-        height: 80vh;
-        margin: 10vh 5vw;
-        position: fixed;
-        overflow-y: auto;
-        color: white;
-    }
-    ul, footer {
-        width: 100%;
-        height: 10vh;
-        position: fixed;
-        display: flex;
-        justify-content: center;
-        align-items: center;
-    }
-    footer {
-        bottom: 0;
-    }
-    ul {
-        list-style: none;
-        padding: 0;
-    }
+  /* Structure */
+  main {
+    width: 90vw;
+    height: 80vh;
+    margin: 10vh 5vw;
+    position: fixed;
+    overflow-y: auto;
+    color: white;
+  }
+  ul,
+  footer {
+    width: 100%;
+    height: 10vh;
+    position: fixed;
+    display: flex;
+    justify-content: center;
+    align-items: center;
+  }
+  footer {
+    bottom: 0;
+  }
+  ul {
+    list-style: none;
+    padding: 0;
+  }
 
-    /* Animated navbar border */
-    li {
-        background-image: linear-gradient(90deg, black 50%, transparent 50%),
-        linear-gradient(90deg, black 50%, transparent 50%),
-        linear-gradient(0deg, black 50%, transparent 50%),
-        linear-gradient(0deg, black 50%, transparent 50%);
-        background-repeat: repeat-x, repeat-x, repeat-y, repeat-y;
-        background-position: 0 0, 100% 100%, 0 100%, 100% 0;
-        background-size: 8px 2px, 8px 2px, 2px 8px, 2px 8px;
-        border: none;
-    }
-    .active {
-        background-size: 8px 3px, 8px 3px, 3px 8px, 3px 8px
-    }
-    li:not(.active):hover {
-        animation: borderAnimation 5s linear infinite;
-    }
-    @keyframes borderAnimation {
-        to {
-            background-position: 100% 0, 0 100%, 0 0, 100% 100%;
-        }
-    }
+  /* Animated navbar border */
+  li {
+    background-image: linear-gradient(90deg, black 50%, transparent 50%),
+      linear-gradient(90deg, black 50%, transparent 50%),
+      linear-gradient(0deg, black 50%, transparent 50%),
+      linear-gradient(0deg, black 50%, transparent 50%);
+    background-repeat: repeat-x, repeat-x, repeat-y, repeat-y;
+    background-position:
+      0 0,
+      100% 100%,
+      0 100%,
+      100% 0;
+    background-size:
+      8px 2px,
+      8px 2px,
+      2px 8px,
+      2px 8px;
+    border: none;
+  }
+  .active {
+    background-size:
+      8px 3px,
+      8px 3px,
+      3px 8px,
+      3px 8px;
+  }
+  li:not(.active):hover {
+    animation: borderAnimation 5s linear infinite;
+  }
+  @keyframes borderAnimation {
+    to {
+      background-position:
+        100% 0,
+        0 100%,
+        0 0,
+        100% 100%;
+    }
+  }
 
-    /* Navbar formatting */
-    li, a {
-        color: var(--main-fg-color);
-        display: inline-flex;
-        align-items: center;
-        justify-content: center;
-    }
-    a {
-        width: 100%;
-        height: 100%;
-        font-weight: normal;
-    }
+  /* Navbar formatting */
+  li,
+  a {
+    color: var(--main-fg-color);
+    display: inline-flex;
+    align-items: center;
+    justify-content: center;
+  }
+  a {
+    width: 100%;
+    height: 100%;
+    font-weight: normal;
+  }
+  li {
+    height: 50%;
+    flex-basis: 0;
+    flex-grow: 1;
+    margin: 0 5vw;
+    font-size: 3vh;
+    font-weight: bold;
+  }
+  @media (max-width: 1050px) {
     li {
-        height: 50%;
-        flex-basis: 0;
-        flex-grow: 1;
-        margin: 0 5vw;
-        font-size: 3vh;
-        font-weight: bold;
-    }
-    @media (max-width: 1050px) {
-        li {
-            margin-left: 4px;
-            margin-right: 4px;
-        }
+      margin-left: 4px;
+      margin-right: 4px;
     }
-    @media (max-width: 620px) {
-        nav {
-            flex-wrap: wrap;
-        }
+  }
+  @media (max-width: 620px) {
+    nav {
+      flex-wrap: wrap;
     }
-</style>
\ No newline at end of file
+  }
+</style>
diff --git a/src/routes/+page.svelte b/src/routes/+page.svelte
index 11bd822..7566109 100644
--- a/src/routes/+page.svelte
+++ b/src/routes/+page.svelte
@@ -1,6 +1,7 @@
 <script>
-    import { title } from "$lib/title.ts";
-    import Slideshow from "$lib/Slideshow.svelte";
-    title.set("Home");
+  import { title } from "$lib/title.ts";
+  import Slideshow from "$lib/Slideshow.svelte";
+  title.set("Home");
 </script>
-<Slideshow/>
\ No newline at end of file
+
+<Slideshow />