From c99b9874a34ed27f6e56eb8d797265d3e2540a38 Mon Sep 17 00:00:00 2001
From: blumed <cullan.luther@gmail.com>
Date: Mon, 22 Jan 2024 11:22:56 -0600
Subject: [PATCH 1/4] adding new bookmarklet library section, ported over some
 bookmarklets from personal site

---
 .gitignore                                    |   1 +
 package.json                                  |   4 +-
 src/lib/components/accordion.svelte           |  10 +-
 src/lib/components/constants.ts               |  19 +-
 src/lib/components/hero.svelte                | 136 +++++
 src/lib/components/main-navigation.svelte     |  52 ++
 src/lib/data/bookmarklets.json                |   0
 src/lib/styles/global.scss                    |  89 ++-
 src/routes/(app)/+layout.svelte               |  13 +-
 src/routes/(app)/+page.svelte                 | 279 ++++++----
 src/routes/+error.svelte                      |  16 +-
 src/routes/404/+page.svelte                   | 137 +++++
 .../bookmarklets/{esseeoh => }/+layout.svelte | 195 ++-----
 src/routes/bookmarklets/+page.svelte          | 101 ++++
 .../bookmarklets/[slug].svelte/+page.svelte   |  10 +
 .../bookmarklets/[slug].svelte/+page.ts       |  23 +
 src/routes/bookmarklets/bookmarklets.json     |  33 ++
 src/routes/bookmarklets/esseeoh/+page.svelte  |  60 +-
 .../+page.svelte                              | 521 ++++++++++++++++++
 .../bookmarklet.svelte                        |  89 +++
 20 files changed, 1481 insertions(+), 307 deletions(-)
 create mode 100644 src/lib/components/hero.svelte
 create mode 100644 src/lib/components/main-navigation.svelte
 create mode 100644 src/lib/data/bookmarklets.json
 create mode 100644 src/routes/404/+page.svelte
 rename src/routes/bookmarklets/{esseeoh => }/+layout.svelte (59%)
 create mode 100644 src/routes/bookmarklets/+page.svelte
 create mode 100644 src/routes/bookmarklets/[slug].svelte/+page.svelte
 create mode 100644 src/routes/bookmarklets/[slug].svelte/+page.ts
 create mode 100644 src/routes/bookmarklets/bookmarklets.json
 create mode 100644 src/routes/bookmarklets/responsive-breakpoint-builder/+page.svelte
 create mode 100644 src/routes/bookmarklets/responsive-breakpoint-builder/bookmarklet.svelte

diff --git a/.gitignore b/.gitignore
index afa8509..fab5659 100644
--- a/.gitignore
+++ b/.gitignore
@@ -15,3 +15,4 @@ vite.config.ts.timestamp-*
 pnpm-lock.yaml
 package-lock.json
 yarn-error.log
+*/esseeoh.js
\ No newline at end of file
diff --git a/package.json b/package.json
index 16f540b..5589739 100644
--- a/package.json
+++ b/package.json
@@ -4,7 +4,7 @@
 	"private": true,
 	"scripts": {
 		"dev": "vite dev",
-		"build": "vite build",
+		"build": "vite build && terser ./build/esseeoh.js -c -m -o ./build/esseeoh.js",
 		"preview": "vite preview",
 		"test": "playwright test",
 		"check": "svelte-kit sync && svelte-check --tsconfig ./tsconfig.json",
@@ -41,4 +41,4 @@
 	},
 	"type": "module",
 	"dependencies": {}
-}
+}
\ No newline at end of file
diff --git a/src/lib/components/accordion.svelte b/src/lib/components/accordion.svelte
index 7c4f89a..1a44ebb 100644
--- a/src/lib/components/accordion.svelte
+++ b/src/lib/components/accordion.svelte
@@ -40,7 +40,7 @@
 
     .button {
         border-radius: 0;
-        box-shadow: 12px 12px 0 0 var(--pink-color);
+        box-shadow: 12px 12px 0 0 var(--color-pink);
         line-height: 25px;
         padding-right: 50px;
         position: relative;
@@ -48,7 +48,7 @@
         &::after {
             content: "";
             width: 12px;
-            background-color: var(--red-color);
+            background-color: var(--color-red);
             height: 2px;
             position: absolute;
             right: 20px;
@@ -58,7 +58,7 @@
         &::before {
             content: "";
             width: 2px;
-            background-color: var(--red-color);
+            background-color: var(--color-red);
             height: 12px;
             position: absolute;
             right: 25px;
@@ -73,12 +73,12 @@
 
         &:hover {
             transform: translate(3px, 3px);
-            box-shadow: 6px 6px 0 0 var(--pink-color) !important;
+            box-shadow: 6px 6px 0 0 var(--color-pink) !important;
         }
 
         &:active {
             transform: translate(6px, 6px);
-            box-shadow: 3px 3px 0 0 var(--pink-color) !important;
+            box-shadow: 3px 3px 0 0 var(--color-pink) !important;
         }
     }
     @media (max-width: 768px) {
diff --git a/src/lib/components/constants.ts b/src/lib/components/constants.ts
index 9c2f45d..b2512ee 100644
--- a/src/lib/components/constants.ts
+++ b/src/lib/components/constants.ts
@@ -34,11 +34,11 @@ export const useExampleBookmarklet3 = `function pageSpeedInsights(currentSite){
     }
   };
   pageSpeedInsights(window.location.href);`;
-  export const useExampleBookmarklet4 = `try {   
+export const useExampleBookmarklet4 = `try {   
     navigator.clipboard.writeText('ADD WHAT EVER TEXT YOU WANT HERE');
   } catch(error) {
     console.log('Copy To Clipboard Bookmarklet did not work: ', error);
-  }`;  
+}`;  
 export const useExampleBookmarklet5 = `try {
   const highlightedText = window.getSelection().toString();
    window.open('http://google.com/search?q=site:' + window.location.hostname + ' "' + highlightedText + '"');
@@ -113,4 +113,17 @@ export const config = {
       "no-dupe-else-if": ["error", "always"],
       "no-console": ["warn", "always"],
   },
-};
\ No newline at end of file
+};
+
+export const colorPicker = `const abortController = new AbortController();
+async function sampleColorFromScreen(abortController) {
+  const eyeDropper = new EyeDropper();
+  try {
+    const result = await eyeDropper.open({signal: abortController.signal});
+    navigator.clipboard.writeText(result.sRGBHex);
+    return result.sRGBHex;
+  } catch (e) {
+    return null;
+  }
+}
+sampleColorFromScreen(abortController);`
\ No newline at end of file
diff --git a/src/lib/components/hero.svelte b/src/lib/components/hero.svelte
new file mode 100644
index 0000000..50a7cc9
--- /dev/null
+++ b/src/lib/components/hero.svelte
@@ -0,0 +1,136 @@
+<section class="hero section">
+    <div class="container">
+        <header>
+            <h1>
+                <slot name="light" /><br />
+                {#if $$slots.dark}
+                    <slot name="dark" />
+                {:else}
+                    Bookmarklet
+                {/if}
+            </h1>
+            {#if $$slots.features}
+                <div class="features-section">
+                    <h2><slot name="light" /> Features Include</h2>
+                    <slot name="features" />
+                </div>
+            {/if}
+            {#if $$slots.copy}
+                <slot name="copy" />
+            {/if}
+        </header>
+        <img
+            class="ribbon"
+            src="/flat-bookmark.svg"
+            role="presentation"
+            alt="ribbon"
+            loading="eager"
+        />
+    </div>
+</section>
+
+<style lang="scss">
+    .hero {
+        display: flex;
+        align-items: center;
+        padding-bottom: 0;
+        :global(p) {
+            margin-inline: auto;
+            max-width: 903px;
+            padding-right: 115px;
+        }
+    }
+    .container,
+    .code-editor {
+        position: relative;
+        z-index: 1;
+    }
+    .ribbon {
+        position: absolute;
+        z-index: -1;
+        top: -139px;
+        left: 980px;
+        height: 1029px;
+    }
+    h1 {
+        font-size: 5rem;
+        line-height: 76px;
+        margin-top: 0;
+        margin-bottom: 40px;
+        padding-right: 431px;
+        :global(span[slot="light"]) {
+            text-shadow:
+                -1px -1px 0 var(--color-black),
+                1px -1px 0 var(--color-black),
+                -1px 1px 0 var(--color-black),
+                1px 1px 0 var(--color-black);
+            color: white;
+            font-size: 5.3rem;
+        }
+    }
+    .features-section {
+        margin-inline: auto;
+        max-width: 903px;
+        padding-right: 115px;
+        h2 {
+            font-size: 1.3rem;
+            margin-bottom: 10px;
+        }
+        ul {
+            padding-left: 23px;
+            margin-top: 10px;
+            margin-bottom: 0;
+        }
+        li {
+            list-style: circle;
+            line-height: 24px;
+        }
+    }
+    @media (max-width: 768px) {
+        .ribbon {
+            width: 100%;
+            inset: 0;
+            object-fit: cover;
+            height: 100%;
+            top: 342px;
+            overflow: inherit;
+        }
+        .hero {
+            height: auto;
+            text-align: left;
+            padding-bottom: 0;
+            background-color: var(--color-pink);
+            overflow: inherit;
+            header::after {
+                content: "";
+                background-color: var(--color-pink);
+                z-index: -1;
+                height: 100px;
+                width: 100%;
+                display: block;
+                left: 0;
+                position: absolute;
+            }
+            .container {
+                position: static;
+            }
+        }
+        .features-section {
+            padding-right: 0;
+            h2 {
+                font-size: 1.1rem;
+                margin-bottom: 0;
+            }
+        }
+        h1 {
+            font-size: 2.4rem;
+            line-height: 46px;
+            margin-bottom: 20px;
+            padding-right: 0;
+            :global(span[slot="light"]) {
+                letter-spacing: 1.5px;
+                font-size: 2.7rem;
+            }
+        }
+    }
+</style>
diff --git a/src/lib/components/main-navigation.svelte b/src/lib/components/main-navigation.svelte
new file mode 100644
index 0000000..da5fd0c
--- /dev/null
+++ b/src/lib/components/main-navigation.svelte
@@ -0,0 +1,52 @@
+<script lang="ts">
+    let toggleNavigation = false;
+</script>
+
+<a href="#skip-main-navigation" class="sr-only">Skip Main Navigation</a>
+<nav>
+    <ul id="main-navigation" class="list-unstyled">
+        <li><a href="/">Home</a></li>
+        <li>
+            <svg
+                aria-hidden="true"
+                focusable="false"
+                class="svg-circle unfilled"
+                role="presentation"
+                xmlns="http://www.w3.org/2000/svg"
+                viewBox="0 0 512 512"
+                ><path
+                    fill="currentColor"
+                    d="M256 8C119 8 8 119 8 256s111 248 248 248 248-111 248-248S393 8 256 8z"
+                ></path></svg
+            >
+        </li>
+        <li><a href="/bookmarklets">Bookmark Library</a></li>
+    </ul>
+</nav>
+
+<style lang="scss">
+    nav {
+        position: absolute;
+        z-index: 2;
+        top: 20px;
+        right: 5%;
+        display: flex;
+        flex-direction: row-reverse;
+        color: var(--color-black);
+    }
+    .svg-circle {
+        width: 12px;
+        height: 12px;
+        color: white;
+    }
+    #main-navigation {
+        display: flex;
+        align-items: center;
+        li {
+            padding-inline: 8px;
+            a {
+                color: inherit;
+            }
+        }
+    }
+</style>
diff --git a/src/lib/data/bookmarklets.json b/src/lib/data/bookmarklets.json
new file mode 100644
index 0000000..e69de29
diff --git a/src/lib/styles/global.scss b/src/lib/styles/global.scss
index 3620e24..75deb26 100644
--- a/src/lib/styles/global.scss
+++ b/src/lib/styles/global.scss
@@ -23,14 +23,16 @@
 :root {
     font-family: 'Lexend Deca', Arial, -apple-system, sans-serif;
     --font-base: 16px;
-    --clay-color: #edece8;
-    --pink-color: #ec6e89;
-    --red-color: #d53253;
-    --dark-red-color: #b80000;
-    --turquoise-color: #b9e7de;
-    --purple-color: #bc98cb;
+    --color-clay: #edece8;
+    --color-pink: #ec6e89;
+    --color-pinkish: #f78da7;
+    --color-red: #d53253;
+    --color-dark-red: #b80000;
+    --color-turquoise: #b9e7de;
+    --color-purple: #bc98cb;
+    --color-black: #161613;
+    --color-white: #ffffff;
     --global-transition: all 0.3s ease-in-out;
-    --black-color: #161613;
 }
 
 *, :after, :before {
@@ -40,8 +42,8 @@
 body {
     font-family: inherit;
     font-size: var(--font-base);
-    background-color: var(--clay-color);
-    color: var(--black-color);
+    background-color: var(--color-clay);
+    color: var(--color-black);
     margin: 0;
     overflow-x: hidden;
 }
@@ -59,7 +61,7 @@ li {
 }
 
 a {
-    color: var(--red-color);
+    color: var(--color-red);
     font-weight: 400;
     text-decoration: none;
 }
@@ -77,7 +79,7 @@ a {
 .input {
     padding: 10px;
     width: 100%;
-    border: 2px solid var(--black-color);
+    border: 2px solid var(--color-black);
     border-radius: 0.25rem;
 }
 
@@ -86,7 +88,7 @@ a {
     margin-inline: auto;
 }
 
-.button, [role="button"] {
+.button, [role="button"]:not(.button-custom) {
     font-family: inherit;
     display: inline-block;
     font-size: 16px;
@@ -94,10 +96,10 @@ a {
     letter-spacing: 1px;
     padding: 15px 20px;
     border: 2px solid currentColor;
-    color: var(--black-color);
+    color: var(--color-black);
     border-radius: 0.25rem;
     background-color: transparent;
-    box-shadow: 6px 6px 0 0 var(--black-color);
+    box-shadow: 6px 6px 0 0 var(--color-black);
     position: relative;
     user-select: none;
     -webkit-user-select: none;
@@ -109,32 +111,38 @@ a {
 
     &:hover {
         transform: translate(2px,2px);
-        box-shadow: 3px 3px 0 0 var(--black-color) !important;
+        box-shadow: 3px 3px 0 0 var(--color-black) !important;
     }
 
     &:active {
         transform: translate(4px,4px);
-        box-shadow: 1px 1px 0 0 var(--black-color) !important;
+        box-shadow: 1px 1px 0 0 var(--color-black) !important;
     }
 
     &.fill-white {
-        background-color: #ffffff;
+        background-color: var(--color-white);
         &:hover {
-            background-color: var(--turquoise-color);
+            background-color: var(--color-turquoise);
         }
     }
 
     &.fill-blue {
-        background-color: var(--turquoise-color);
+        background-color: var(--color-turquoise);
         &:hover {
-            background-color: var(--turquoise-color);
+            background-color: var(--color-turquoise);
+        }
+    }
+    &.fill-pink {
+        background-color: var(--color-pinkish);
+        &:hover {
+            background-color: var(--color-pinkish);
         }
     }
 
     &.fill-clay {
-        background-color: var(--clay-color);
+        background-color: var(--color-clay);
         &:hover {
-            background-color: var(--clay-color);
+            background-color: var(--color-clay);
         }
     }
 
@@ -149,12 +157,12 @@ a {
     z-index: 8;
     top: 16px;
     right: 32px;
-    background-color: #fff;
+    background-color: var(--color-white);
     margin: 0;
     cursor: pointer;
     width: 20px;
     height: 20px;
-    border: 0.15em solid var(--black-color);
+    border: 0.15em solid var(--color-black);
     border-radius: 0.15rem;
     overflow: hidden;
     &:checked {
@@ -164,7 +172,7 @@ a {
         content: "";
         width: 2px;
         height: 12px;
-        background-color: var(--black-color);
+        background-color: var(--color-black);
         display: block;
         top: 2px;
         left: calc(50% - 1px);
@@ -211,7 +219,7 @@ a {
 }
 
 .button-inline {
-    color: var(--red-color);
+    color: var(--color-red);
     font-weight: 400;
     cursor: pointer;
     border: 0;
@@ -226,6 +234,31 @@ a {
     margin-left: 20px;
 }
 
+.sr-only {
+	border: 0 !important;
+	clip: rect(1px, 1px, 1px, 1px) !important;
+	clip-path: inset(50%) !important;
+	height: 1px !important;
+	overflow: hidden !important;
+	margin: -1px !important;
+	padding: 0 !important;
+	position: absolute !important;
+	width: 1px !important;
+	white-space: nowrap !important;
+}
+
+.list-unstyled {
+    list-style: none;
+    padding-left: 0;
+    margin-block: 0;
+}
+
+@media (min-width: 769px) {
+    .mobile-only {
+        display: none;
+    }
+}
+
 @media (max-width: 768px) {
     .section {
         padding-block: 30px;
@@ -235,4 +268,8 @@ a {
         margin-top: 20px;
         margin-left: 0;
     }
+
+    .desktop-only {
+        display: none;
+    }
 }
\ No newline at end of file
diff --git a/src/routes/(app)/+layout.svelte b/src/routes/(app)/+layout.svelte
index c91a1b2..9fc8185 100644
--- a/src/routes/(app)/+layout.svelte
+++ b/src/routes/(app)/+layout.svelte
@@ -1,12 +1,13 @@
 <script lang="ts">
     import "$lib/styles/global.scss";
     import Heart from "$lib/components/heart-icon/heart.svelte";
+    import MainNavigation from "$lib/components/main-navigation.svelte";
     import { browser } from "$app/environment";
     let dialog: any;
     function toggleDialog(state: boolean, dialogName: string) {
         if (browser) {
             const dialogPrivacy = document.getElementById(
-                "dialog-privacy-policy"
+                "dialog-privacy-policy",
             );
             const dialogContact = document.getElementById("dialog-contact");
             if (dialogName === "privacy") dialog = dialogPrivacy;
@@ -17,7 +18,9 @@
     }
 </script>
 
-<main>
+<MainNavigation />
+
+<main id="skip-main-navigation">
     <slot />
 </main>
 
@@ -193,10 +196,10 @@
     }
 
     .dialog {
-        background-color: var(--clay-color);
-        border-color: var(--pink-color);
+        background-color: var(--color-clay);
+        border-color: var(--color-pink);
         border-radius: 0.25rem;
-        color: var(--black-color);
+        color: var(--color-black);
         &::backdrop {
             position: fixed;
             inset: 0px;
diff --git a/src/routes/(app)/+page.svelte b/src/routes/(app)/+page.svelte
index b94cd2b..346592e 100644
--- a/src/routes/(app)/+page.svelte
+++ b/src/routes/(app)/+page.svelte
@@ -34,6 +34,7 @@
     let toggleExamples = false;
     let toggleSnippets = false;
     let toggleGists = false;
+    let toggleOptions = false;
     let clickedMobileInstructions = false;
     let files: any;
 
@@ -112,7 +113,7 @@
     function scrollToMobileInstructions() {
         if (browser) {
             const mobileInstruction = document.querySelector(
-                "#item-5-header"
+                "#item-5-header",
             ) as HTMLElement;
             mobileInstruction?.click();
             const mobileInstructionPosition =
@@ -131,7 +132,7 @@
     function addToCodeEditor(
         getCodeInput: string,
         openSidebar: boolean,
-        id: string
+        id: string,
     ) {
         if (id === "gists-menu") {
             codeInput = "";
@@ -203,7 +204,7 @@
             const gistData = await response.json();
 
             gistFiles = Object.values(gistData.files).filter(
-                (javascriptFile) => javascriptFile?.language === "JavaScript"
+                (javascriptFile) => javascriptFile?.language === "JavaScript",
             );
 
             if (gistFiles.length === 0) {
@@ -243,7 +244,7 @@
         addToCodeEditor(
             gistFiles && gistFiles[selectedGist].content,
             true,
-            "gists-menu"
+            "gists-menu",
         );
 
         codeInputGist = `async function getGist(url) {
@@ -268,66 +269,67 @@ getGist('https://gist.githubusercontent.com/${
         gistEditorMessage =
             "It is unnecessary to edit code below. It is only a snapshot of your gist for verification purposes. Your generated bookmarklet will contain the selected gist url";
     }
-    async function read(file) {
-        codeInput = await file.text();
-    }
-    async function save() {
-        if (browser) {
-            const suggestedName = `${new Date()
-                .toISOString()
-                .slice(0, 10)}-${new Date()
-                .toLocaleTimeString()
-                .replace(/( |:|\_)/g, "-")}.js`;
-            const options = {
-                suggestedName: suggestedName,
-                types: [
-                    {
-                        description: "Make Bookmarklet File",
-                        accept: {
-                            "text/javascript": [".js"],
-                        },
-                    },
-                ],
-            };
-            const supportsFileSystemAccess =
-                "showSaveFilePicker" in window &&
-                (() => {
-                    try {
-                        return window.self === window.top;
-                    } catch {
-                        return false;
-                    }
-                })();
-            if (supportsFileSystemAccess) {
-                try {
-                    const handle = await showSaveFilePicker(options);
-                    const writable = await handle.createWritable();
-                    await writable.write(codeInput);
-                    await writable.close();
-                    return;
-                } catch (err) {
-                    if (err.name !== "AbortError") {
-                        console.error(err.name, err.message);
-                        return;
-                    }
-                }
-            } else {
-                const blobURL = URL.createObjectURL(
-                    new Blob([codeInput], { type: "text/javascript" })
-                );
-                const a = document.createElement("a");
-                a.href = blobURL;
-                a.download = suggestedName;
-                a.style.display = "none";
-                document.body.append(a);
-                a.click();
-                setTimeout(() => {
-                    URL.revokeObjectURL(blobURL);
-                    a.remove();
-                }, 1000);
-            }
-        }
-    }
+    // async function read(file) {
+    //     codeInput = await file.text();
+    // }
+
+    // async function save() {
+    //     if (browser) {
+    //         const suggestedName = `${new Date()
+    //             .toISOString()
+    //             .slice(0, 10)}-${new Date()
+    //             .toLocaleTimeString()
+    //             .replace(/( |:|\_)/g, "-")}.js`;
+    //         const options = {
+    //             suggestedName: suggestedName,
+    //             types: [
+    //                 {
+    //                     description: "Make Bookmarklet File",
+    //                     accept: {
+    //                         "text/javascript": [".js"],
+    //                     },
+    //                 },
+    //             ],
+    //         };
+    //         const supportsFileSystemAccess =
+    //             "showSaveFilePicker" in window &&
+    //             (() => {
+    //                 try {
+    //                     return window.self === window.top;
+    //                 } catch {
+    //                     return false;
+    //                 }
+    //             })();
+    //         if (supportsFileSystemAccess) {
+    //             try {
+    //                 const handle = await showSaveFilePicker(options);
+    //                 const writable = await handle.createWritable();
+    //                 await writable.write(codeInput);
+    //                 await writable.close();
+    //                 return;
+    //             } catch (err) {
+    //                 if (err.name !== "AbortError") {
+    //                     console.error(err.name, err.message);
+    //                     return;
+    //                 }
+    //             }
+    //         } else {
+    //             const blobURL = URL.createObjectURL(
+    //                 new Blob([codeInput], { type: "text/javascript" }),
+    //             );
+    //             const a = document.createElement("a");
+    //             a.href = blobURL;
+    //             a.download = suggestedName;
+    //             a.style.display = "none";
+    //             document.body.append(a);
+    //             a.click();
+    //             setTimeout(() => {
+    //                 URL.revokeObjectURL(blobURL);
+    //                 a.remove();
+    //             }, 1000);
+    //         }
+    //     }
+    // }
 
     $: if (codeInput === "") reset();
     $: if (codeInput !== "" && errorMessage === "Put some code in there!")
@@ -339,12 +341,12 @@ getGist('https://gist.githubusercontent.com/${
     $: if (gistUrl === "") gistMultipleFiles = false;
     $: selectedGist, selectedGist !== "" && createGistBookmarklet();
 
-    $: if (files) {
-        for (const file of files) {
-            read(file);
-            console.log(`${file.name}: ${file.size} bytes`);
-        }
-    }
+    // $: if (files) {
+    //     for (const file of files) {
+    //         read(file);
+    //         console.log(`${file.name}: ${file.size} bytes`);
+    //     }
+    // }
 </script>
 
 <Seo title="Make Bookmarklets | Make it easy" pageCanonicalUrl="/" />
@@ -387,11 +389,67 @@ getGist('https://gist.githubusercontent.com/${
         {/if}
         <div class="editor-wrapper">
             <CodeEditor bind:codeEditor={codeInput} />
+            <!-- <div class="editor-options">
+                <input hidden type="file" id="upload" accept=".js" bind:files />
+                <label
+                    class="button-option button-custom"
+                    for="upload"
+                    role="button"
+                    title="Upload Javascript"
+                    ><img src="/file.svg" alt="file upload icon" /> Upload File</label
+                >
+                <button
+                    type="button"
+                    class="button-option"
+                    title="Download Javascript"
+                    on:click={save}
+                    ><img src="/file.svg" alt="file download icon" />Download
+                    File</button
+                >
+            </div> -->
+            <!-- <button
+                type="button"
+                class="button-options"
+                on:click={() => (toggleOptions = !toggleOptions)}
+                >More Options</button
+            > -->
         </div>
-
+        <!-- {#if toggleOptions}
+            <div class="editor-drawer drawer-options" in:slide out:slide>
+                <div class="external-files">
+                    <p>Save or Restore your work</p>
+                    <input
+                        hidden
+                        type="file"
+                        id="upload"
+                        accept=".js"
+                        bind:files
+                    />
+                    <label
+                        class="button button-upload fill-white"
+                        for="upload"
+                        role="button"
+                        title="Upload Javascript"
+                        ><img src="/file.svg" alt="file upload icon" /> Up</label
+                    >
+                    <button
+                        type="button"
+                        class="button button-download fill-white"
+                        title="Download Javascript"
+                        on:click={save}
+                        ><img
+                            src="/file.svg"
+                            alt="file download icon"
+                        />Down</button
+                    >
+                </div>
+            </div>
+        {/if} -->
         {#if errorMessage !== ""}
             <div
-                class={`error-message ${codeInputGist && "gist-message"}`}
+                class={`editor-drawer error-message ${
+                    codeInputGist && "gist-message"
+                }`}
                 in:slide
                 out:slide
             >
@@ -412,19 +470,6 @@ getGist('https://gist.githubusercontent.com/${
                     class="button button-reset fill-white"
                     on:click={reset}>Reset</button
                 >
-                <input hidden type="file" id="upload" accept=".js" bind:files />
-                <label class="button button-upload fill-white" for="upload"
-                    ><img src="/file.svg" alt="file upload icon" /> Up</label
-                >
-                <button
-                    type="button"
-                    class="button button-download fill-white"
-                    on:click={save}
-                    ><img
-                        src="/file.svg"
-                        alt="file download icon"
-                    />Down</button
-                >
                 {#if codeOutput !== ""}
                     <a
                         href={codeOutput}
@@ -893,7 +938,7 @@ getGist('https://gist.githubusercontent.com/${
                         addToCodeEditor(
                             useExampleBookmarklet4,
                             false,
-                            "examples-menu"
+                            "examples-menu",
                         )}>Example</button
                 >.
             </p>
@@ -1068,9 +1113,11 @@ getGist('https://gist.githubusercontent.com/${
         margin-bottom: 40px;
         padding-right: 431px;
         span {
-            text-shadow: -1px -1px 0 var(--black-color),
-                1px -1px 0 var(--black-color), -1px 1px 0 var(--black-color),
-                1px 1px 0 var(--black-color);
+            text-shadow:
+                -1px -1px 0 var(--color-black),
+                1px -1px 0 var(--color-black),
+                -1px 1px 0 var(--color-black),
+                1px 1px 0 var(--color-black);
             color: white;
             font-size: 5.3rem;
         }
@@ -1109,9 +1156,9 @@ getGist('https://gist.githubusercontent.com/${
         align-items: center;
         padding: 1rem;
         border-bottom: 2px solid white;
-        color: var(--clay-color);
+        color: var(--color-clay);
         background-color: #282c34;
-        box-shadow: 12px 12px 0 0 #ffffff;
+        box-shadow: 12px 12px 0 0 #fff;
     }
     .gist-message + .editor-wrapper:before {
         content: "";
@@ -1122,26 +1169,36 @@ getGist('https://gist.githubusercontent.com/${
         pointer-events: none;
     }
     .editor-wrapper {
-        min-height: 200px;
+        min-height: 230px;
         position: relative;
         z-index: 1;
-    }
-    :global(.codemirror-wrapper) {
         box-shadow: 12px 12px 0 0 #fff;
+        background-color: #282c34;
     }
+    // :global(.codemirror-wrapper) {
+    //     box-shadow: 12px 12px 0 0 #fff;
+    // }
     :global(.cm-scroller) {
         min-height: 200px;
     }
+    .external-files {
+        display: flex;
+    }
+    .editor-drawer {
+        padding: 1rem;
+        box-shadow: 12px 12px 0 0 #fff;
+        position: relative;
+        z-index: 2;
+    }
     .error-message {
         height: 100%;
         display: flex;
         align-items: center;
-        padding: 1rem;
-        color: var(--dark-red-color);
+        color: var(--color-dark-red);
         background-color: pink;
-        box-shadow: 12px 12px 0 0 #ffffff;
-        position: relative;
-        z-index: 2;
+    }
+    .drawer-options {
+        background-color: var(--color-turquoise);
     }
     .code-output-controls {
         display: flex;
@@ -1173,7 +1230,7 @@ getGist('https://gist.githubusercontent.com/${
     #output {
         width: 100%;
         padding: 10px;
-        border: 2px solid var(--black-color);
+        border: 2px solid var(--color-black);
         border-radius: 0.25rem;
         display: flex;
         margin-top: 20px;
@@ -1183,7 +1240,7 @@ getGist('https://gist.githubusercontent.com/${
     }
     .button-reset {
         &:hover {
-            background-color: var(--pink-color);
+            background-color: var(--color-pink);
         }
     }
     .button-upload {
@@ -1216,19 +1273,19 @@ getGist('https://gist.githubusercontent.com/${
         position: absolute;
         cursor: pointer;
         right: 0;
-        color: var(--black-color);
+        color: var(--color-black);
         height: 38.5px;
         top: 20px;
         padding-inline: 10px;
         border-top-left-radius: 0;
         border-bottom-left-radius: 0;
-        border: 2px solid var(--black-color);
+        border: 2px solid var(--color-black);
         border-top-right-radius: 0.25rem;
         border-bottom-right-radius: 0.25rem;
-        background-color: var(--clay-color);
+        background-color: var(--color-clay);
         transition: var(--global-transition);
         &:hover {
-            background-color: var(--turquoise-color);
+            background-color: var(--color-turquoise);
         }
     }
     .group-bookmarklet-output {
@@ -1309,12 +1366,12 @@ getGist('https://gist.githubusercontent.com/${
         overflow-y: auto;
         font-size: 0.875rem;
         z-index: 6;
-        color: var(--black-color);
-        background-color: var(--clay-color);
+        color: var(--color-black);
+        background-color: var(--color-clay);
         transition: var(--global-transition);
         backface-visibility: hidden;
         padding: 16px 16px 60px;
-        border-left: 2px solid var(--black-color);
+        border-left: 2px solid var(--color-black);
         h2 {
             font-size: 1.3rem;
             margin-top: 35px;
@@ -1397,11 +1454,11 @@ getGist('https://gist.githubusercontent.com/${
             height: auto;
             text-align: left;
             padding-bottom: 0;
-            background-color: var(--pink-color);
+            background-color: var(--color-pink);
             overflow: inherit;
             header::after {
                 content: "";
-                background-color: var(--pink-color);
+                background-color: var(--color-pink);
                 z-index: -1;
                 height: 100px;
                 width: 100%;
@@ -1495,7 +1552,7 @@ getGist('https://gist.githubusercontent.com/${
             width: 100%;
         }
         .mobile-bookmark-instructions {
-            background-color: var(--clay-color);
+            background-color: var(--color-clay);
             padding: 10px 30px 10px;
             border-radius: 0.25rem;
         }
diff --git a/src/routes/+error.svelte b/src/routes/+error.svelte
index c24f9f5..778deb4 100644
--- a/src/routes/+error.svelte
+++ b/src/routes/+error.svelte
@@ -1,7 +1,11 @@
 <script>
     import { browser } from "$app/environment";
-    import { slide } from "svelte/transition";
     import "$lib/styles/global.scss";
+    // if (browser) {
+    //     setTimeout(() => {
+    //         window.location.href = "https://make-bookmarklets.com";
+    //     }, 1000);
+    // }
 </script>
 
 <svelte:head>
@@ -17,11 +21,7 @@
     />
     <meta name="robots" content="noindex nofollow" />
 </svelte:head>
-<!-- <h1>
-    404 error 😭 can't find <strong
-        >{browser && window.location.pathname}</strong
-    >
-</h1> -->
+
 <div class="container">
     <h1>
         <span class="four">4</span>
@@ -35,13 +35,13 @@
             alt="Goat Head"
             class="the-goat"
         />
-        <div class="chat-bubble">
+        <!-- <div class="chat-bubble">
             <p>
                 Sorry but <strong>{browser && window.location.pathname}</strong>
                 does not exist..... but I do.
                 <span>I'll send you on home.</span>
             </p>
-        </div>
+        </div> -->
     </div>
 </div>
 
diff --git a/src/routes/404/+page.svelte b/src/routes/404/+page.svelte
new file mode 100644
index 0000000..42d08cb
--- /dev/null
+++ b/src/routes/404/+page.svelte
@@ -0,0 +1,137 @@
+<script>
+    import { browser } from "$app/environment";
+    import "$lib/styles/global.scss";
+    if (browser) {
+        setTimeout(() => {
+            window.location.href = "https://make-bookmarklets.com";
+        }, 500);
+    }
+</script>
+
+<svelte:head>
+    <link rel="preconnect" href="https://fonts.googleapis.com" />
+    <link
+        rel="preconnect"
+        href="https://fonts.gstatic.com"
+        crossorigin="true"
+    />
+    <link
+        href="https://fonts.googleapis.com/css2?family=Nixie+One&display=swap"
+        rel="stylesheet"
+    />
+    <meta name="robots" content="noindex nofollow" />
+</svelte:head>
+
+<div class="container">
+    <h1>
+        <span class="four">4</span>
+        <span class="oh">0</span>
+        <span class="for">4</span>
+    </h1>
+    <div class="the-message">
+        <img
+            src="https://assets.make-bookmarklets.com/goathead.svg"
+            role="presentation"
+            alt="Goat Head"
+            class="the-goat"
+        />
+        <div class="chat-bubble">
+            <p>
+                Sorry but <strong>{browser && window.location.pathname}</strong>
+                does not exist..... but I do.
+                <span>I'll send you on home.</span>
+            </p>
+        </div>
+    </div>
+</div>
+
+<style lang="scss">
+    h1 {
+        font-family: "Nixie One", cursive;
+        text-align: center;
+        font-size: 7rem;
+        position: relative;
+        margin: 0;
+        z-index: 4;
+        translate: -33px 55px;
+        text-align: center;
+        color: #d53253;
+    }
+    span {
+        position: absolute;
+    }
+
+    .four {
+        animation: four 10s infinite;
+    }
+    .oh {
+        top: 10px;
+    }
+    .for {
+        animation: for 10s infinite;
+    }
+    .the-goat {
+        object-fit: cover;
+        overflow-clip-margin: inherit;
+        overflow: inherit;
+    }
+    .the-message {
+        position: relative;
+        z-index: -1;
+    }
+    .chat-bubble {
+        background-image: url(/chat-bubble.svg);
+        background-size: contain;
+        background-repeat: no-repeat;
+        position: absolute;
+        width: 410px;
+        height: 407px;
+        top: 45%;
+        left: 18%;
+        p {
+            padding-inline: 49px;
+            text-align: left;
+            font-size: 2rem;
+            margin-top: 130px;
+            line-height: 35px;
+            span {
+                margin-top: 5px;
+                display: block;
+            }
+        }
+    }
+    @keyframes four {
+        0% {
+            transform: rotate(0);
+            animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
+        }
+        50% {
+            transform: rotate(900deg);
+            animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
+        }
+        100% {
+            transform: rotate(1800deg);
+        }
+    }
+
+    @keyframes for {
+        0% {
+            transform: rotate(0);
+            animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
+        }
+        50% {
+            transform: rotate(-900deg);
+            animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
+        }
+        100% {
+            transform: rotate(-1800deg);
+        }
+    }
+    @media (max-width: 768px) {
+        .chat-bubble {
+            display: none;
+            left: 0;
+            width: 100%;
+        }
+    }
+</style>
diff --git a/src/routes/bookmarklets/esseeoh/+layout.svelte b/src/routes/bookmarklets/+layout.svelte
similarity index 59%
rename from src/routes/bookmarklets/esseeoh/+layout.svelte
rename to src/routes/bookmarklets/+layout.svelte
index d3660e2..774d826 100644
--- a/src/routes/bookmarklets/esseeoh/+layout.svelte
+++ b/src/routes/bookmarklets/+layout.svelte
@@ -2,11 +2,12 @@
     import "$lib/styles/global.scss";
     import Heart from "$lib/components/heart-icon/heart.svelte";
     import { browser } from "$app/environment";
+    import MainNavigation from "$lib/components/main-navigation.svelte";
     let dialog: any;
     function toggleDialog(state: boolean, dialogName: string) {
         if (browser) {
             const dialogPrivacy = document.getElementById(
-                "dialog-privacy-policy"
+                "dialog-privacy-policy",
             );
             const dialogContact = document.getElementById("dialog-contact");
             if (dialogName === "privacy") dialog = dialogPrivacy;
@@ -17,50 +18,9 @@
     }
 </script>
 
-<main>
-    <section class="hero section">
-        <div class="container">
-            <header>
-                <h1><span>Esseeoh<br /></span> Bookmarklet</h1>
-                <div class="features-section">
-                    <h2>Esseeoh Features Include</h2>
-                    <ul>
-                        <li>Its free</li>
-                        <li>
-                            Unlike browser extensions Esseeoh can be installed
-                            on any browser and on any mobile or desktop device
-                        </li>
-                        <li>
-                            Auto updates so you always have the latest version
-                        </li>
-                        <li>
-                            Display and edit meta tags. Meta tags pertinent to
-                            SEO are also validated against suggested character
-                            counts
-                        </li>
-                        <li>
-                            Scroll to and highlight all header tags. Each tag
-                            can be edited and validated against suggested
-                            character counts
-                        </li>
-                        <li>Count and list all internal and external links</li>
-                        <li>
-                            View Rich Text Snippets and checks for malformatted
-                            json
-                        </li>
-                        <li>View sitemap and checks for malformatted xml</li>
-                    </ul>
-                </div>
-            </header>
-            <img
-                class="ribbon"
-                src="/flat-bookmark.svg"
-                role="presentation"
-                alt="ribbon"
-                loading="eager"
-            />
-        </div>
-    </section>
+<MainNavigation />
+
+<main id="skip-main-navigation">
     <slot />
 </main>
 
@@ -174,55 +134,6 @@
 </dialog>
 
 <style lang="scss">
-    .hero {
-        display: flex;
-        align-items: center;
-        padding-bottom: 0;
-    }
-    .container,
-    .code-editor {
-        position: relative;
-        z-index: 1;
-    }
-    .ribbon {
-        position: absolute;
-        z-index: -1;
-        top: -139px;
-        left: 980px;
-        height: 1029px;
-    }
-    h1 {
-        font-size: 5rem;
-        line-height: 76px;
-        margin-top: 0;
-        margin-bottom: 40px;
-        padding-right: 431px;
-        span {
-            text-shadow: -1px -1px 0 var(--black-color),
-                1px -1px 0 var(--black-color), -1px 1px 0 var(--black-color),
-                1px 1px 0 var(--black-color);
-            color: white;
-            font-size: 5.3rem;
-        }
-    }
-    .features-section {
-        margin-inline: auto;
-        max-width: 903px;
-        padding-right: 115px;
-        h2 {
-            font-size: 1.3rem;
-            margin-bottom: 10px;
-        }
-        ul {
-            padding-left: 23px;
-            margin-top: 10px;
-            margin-bottom: 0;
-        }
-        li {
-            list-style: circle;
-            line-height: 24px;
-        }
-    }
     .footer-section {
         padding-block: 10px;
     }
@@ -285,10 +196,10 @@
     }
 
     .dialog {
-        background-color: var(--clay-color);
-        border-color: var(--pink-color);
+        background-color: var(--color-clay);
+        border-color: var(--color-pink);
         border-radius: 0.25rem;
-        color: var(--black-color);
+        color: var(--color-black);
         &::backdrop {
             position: fixed;
             inset: 0px;
@@ -296,51 +207,51 @@
         }
     }
     @media (max-width: 768px) {
-        .ribbon {
-            width: 100%;
-            inset: 0;
-            object-fit: cover;
-            height: 100%;
-            top: 342px;
-            overflow: inherit;
-        }
-        .hero {
-            height: auto;
-            text-align: left;
-            padding-bottom: 0;
-            background-color: var(--pink-color);
-            overflow: inherit;
-            header::after {
-                content: "";
-                background-color: var(--pink-color);
-                z-index: -1;
-                height: 100px;
-                width: 100%;
-                display: block;
-                left: 0;
-                position: absolute;
-            }
-            .container {
-                position: static;
-            }
-        }
-        .features-section {
-            padding-right: 0;
-            h2 {
-                font-size: 1.1rem;
-                margin-bottom: 0;
-            }
-        }
-        h1 {
-            font-size: 2.4rem;
-            line-height: 46px;
-            margin-bottom: 20px;
-            padding-right: 0;
-            span {
-                letter-spacing: 1.5px;
-                font-size: 2.7rem;
-            }
-        }
+        // .ribbon {
+        //     width: 100%;
+        //     inset: 0;
+        //     object-fit: cover;
+        //     height: 100%;
+        //     top: 342px;
+        //     overflow: inherit;
+        // }
+        // .hero {
+        //     height: auto;
+        //     text-align: left;
+        //     padding-bottom: 0;
+        //     background-color: var(--color-pink);
+        //     overflow: inherit;
+        //     header::after {
+        //         content: "";
+        //         background-color: var(--color-pink);
+        //         z-index: -1;
+        //         height: 100px;
+        //         width: 100%;
+        //         display: block;
+        //         left: 0;
+        //         position: absolute;
+        //     }
+        //     .container {
+        //         position: static;
+        //     }
+        // }
+        // .features-section {
+        //     padding-right: 0;
+        //     h2 {
+        //         font-size: 1.1rem;
+        //         margin-bottom: 0;
+        //     }
+        // }
+        // h1 {
+        //     font-size: 2.4rem;
+        //     line-height: 46px;
+        //     margin-bottom: 20px;
+        //     padding-right: 0;
+        //     span {
+        //         letter-spacing: 1.5px;
+        //         font-size: 2.7rem;
+        //     }
+        // }
         .dialog {
             margin-inline: 15px;
         }
diff --git a/src/routes/bookmarklets/+page.svelte b/src/routes/bookmarklets/+page.svelte
new file mode 100644
index 0000000..be0c1a3
--- /dev/null
+++ b/src/routes/bookmarklets/+page.svelte
@@ -0,0 +1,101 @@
+<script>
+    import Hero from "$lib/components/hero.svelte";
+    import dataBookmarklets from "./bookmarklets.json";
+
+    let filterSearch = "";
+    $: searchBookmarklets = dataBookmarklets.filter((bookmarklet) => {
+        const title = bookmarklet.title.toLowerCase().includes(filterSearch);
+        const copy = bookmarklet.copy.toLowerCase().includes(filterSearch);
+        const categories = bookmarklet.categories.includes(filterSearch);
+        return title || copy || categories;
+    });
+</script>
+
+<Hero>
+    <span slot="light">Bookmarklet</span>
+    <span slot="dark">Library</span>
+    <p slot="copy">
+        Compiling a collection of useful bookmarklets created on this site. Let
+        me know if you have a bookmarklet you think should be on this page.
+    </p>
+</Hero>
+
+<section class="section">
+    <div class="container">
+        <search>
+            <form method="null">
+                <label for="bookmarklets" class="">Pick out a Bookmarklet</label
+                >
+                <input
+                    type="search"
+                    id="bookmarklets"
+                    placeholder="...search"
+                    name="search"
+                    bind:value={filterSearch}
+                />
+            </form>
+        </search>
+    </div>
+</section>
+
+<div class="cards-list container">
+    {#if searchBookmarklets.length}
+        <div class="cards-list-container">
+            {#each searchBookmarklets.reverse() as card}
+                <article class="cards-list-card">
+                    <header>
+                        <h2>
+                            <a href={card.url} class="cards-list-title"
+                                >{card.title}</a
+                            >
+                        </h2>
+                    </header>
+                    <a href={card.url} class="cards-list-copy"
+                        ><p>{card.copy}</p></a
+                    >
+                    <footer>
+                        <ul class="list-unstyled">
+                            {#each card.categories as category}
+                                <li>{category}</li>
+                            {/each}
+                        </ul>
+                    </footer>
+                </article>
+            {/each}
+        </div>
+    {:else}
+        <p>Sorry, no bookmarklets found with "{filterSearch}"</p>
+    {/if}
+</div>
+
+<style lang="scss">
+    .section,
+    .cards-list {
+        position: relative;
+        z-index: 1;
+    }
+    [type="search"] {
+        padding: 5px;
+    }
+    .cards-list-container {
+        display: grid;
+        grid-template-columns: auto auto auto auto;
+        gap: 30px;
+        margin-bottom: 60px;
+    }
+    .cards-list-card {
+        padding: 20px;
+        outline: 2px solid currentColor;
+        box-shadow: 6px 6px 0 0 var(--color-black);
+        transition: all 0.3s ease;
+        border-radius: 8px;
+        background-color: var(--color-white);
+        p {
+            opacity: 0.7;
+        }
+        &:hover {
+            transform: scale(1.01);
+            outline-width: 5px;
+        }
+    }
+</style>
diff --git a/src/routes/bookmarklets/[slug].svelte/+page.svelte b/src/routes/bookmarklets/[slug].svelte/+page.svelte
new file mode 100644
index 0000000..9cc2d5e
--- /dev/null
+++ b/src/routes/bookmarklets/[slug].svelte/+page.svelte
@@ -0,0 +1,10 @@
+<script context="module">
+    import { page } from "$app/stores";
+
+    // export function load({ fetch, page }) {
+    //     const res = await(fetch(`../bookmarklets.json`));
+    // }
+    // const slug = $page.params.slug;
+</script>
+
+<h1>{$page.params.slug}</h1>
diff --git a/src/routes/bookmarklets/[slug].svelte/+page.ts b/src/routes/bookmarklets/[slug].svelte/+page.ts
new file mode 100644
index 0000000..63e9836
--- /dev/null
+++ b/src/routes/bookmarklets/[slug].svelte/+page.ts
@@ -0,0 +1,23 @@
+// import { error } from '@sveltejs/kit';
+
+// /** @type {import('./$types').PageLoad} */
+// export function load({ params }) {
+// 	if (params.slug === 'bookmarklets/hello-world') {
+// 		return {
+// 			title: 'Hello world!',
+// 			content: 'Welcome to our blog. Lorem ipsum dolor sit amet...'
+// 		};
+// 	}
+
+// 	error(404, 'Not found');
+// }
+
+// export const prerender = true;
+
+export const prerender = true;
+
+/** @type {import('./$types').PageLoad} */
+export async function load({ fetch }) {
+	const res = await fetch('../bookmarklets.json');
+	return await res.json();
+}
\ No newline at end of file
diff --git a/src/routes/bookmarklets/bookmarklets.json b/src/routes/bookmarklets/bookmarklets.json
new file mode 100644
index 0000000..ae3b90f
--- /dev/null
+++ b/src/routes/bookmarklets/bookmarklets.json
@@ -0,0 +1,33 @@
+[
+    {
+        "id": 0,
+        "url": "/bookmarklets/esseeoh",
+        "title": "Esseeoh",
+        "copy": "Full feature SEO bookmarklet for analyzing webpages",
+        "featured": true,
+        "categories": [
+            "seo"
+        ]
+    },
+    {
+        "id": 1,
+        "url": "/bookmarklets/responsive-breakpoint-builder",
+        "title": "Responsive Breakpoint Bookmarklet Builder",
+        "copy": "Build and customize a responsive breakpoint bookmarklet",
+        "featured": true,
+        "categories": [
+            "responsive",
+            "css"
+        ]
+    },
+    {
+        "id": 2,
+        "url": "/bookmarklets/color-picker",
+        "title": "Color Picker",
+        "copy": "Build and customize a responsive breakpoint bookmarklet",
+        "featured": false,
+        "categories": [
+            "hex color"
+        ]
+    }
+]
\ No newline at end of file
diff --git a/src/routes/bookmarklets/esseeoh/+page.svelte b/src/routes/bookmarklets/esseeoh/+page.svelte
index 081e856..4f58696 100644
--- a/src/routes/bookmarklets/esseeoh/+page.svelte
+++ b/src/routes/bookmarklets/esseeoh/+page.svelte
@@ -1,8 +1,9 @@
 <script lang="ts">
     import Seo from "$lib/components/page-meta.svelte";
+    import Hero from "$lib/components/hero.svelte";
 
     let bookmarkletName = "✨Esseeoh✨";
-    const bookmarklet = `javascript:(function()%7B(function()%7Basync function getGist(url)%7Btry%7Bconst response=await fetch(url+Math.random()),gistData=await response.text();if(!response.ok)throw new Error("Network response was not OK");return eval(gistData)%7Dcatch(t)%7Bconsole.log("error",t)%7D%7DgetGist("https://gist.githubusercontent.com/Blumed/b6d4e56b5d943b235c6cf540a51a5bd5/raw/seo-bookmarklet.js?")%7D)();%7D());`;
+    const bookmarklet = `javascript:(function()%7B(function()%7Basync function getGist(url)%7Btry%7Bconst response=await fetch(url+Math.random()),gistData=await response.text();if(!response.ok)throw new Error("Network response was not OK");return eval(gistData)%7Dcatch(t)%7Bconsole.log("error",t)%7D%7DgetGist("https://bookmarklets.make-bookmarklets.com/esseeoh.js?")%7D)();%7D());`;
     async function getGist(url) {
         try {
             const response = await fetch(url + Math.random());
@@ -24,13 +25,35 @@
     pageMetaDescription="Identify and validate webpage SEO. Works on all devices and automatically updates."
     pageCanonicalUrl="/bookmarklets/esseeoh"
 />
+<Hero>
+    <span slot="light" class="butt">Esseeoh</span>
+    <ul slot="features">
+        <li>Its free</li>
+        <li>
+            Unlike browser extensions Esseeoh can be installed on any browser
+            and on any mobile or desktop device
+        </li>
+        <li>Auto updates so you always have the latest version</li>
+        <li>
+            Display and edit meta tags. Meta tags pertinent to SEO are also
+            validated against suggested character counts
+        </li>
+        <li>
+            Scroll to and highlight all header tags. Each tag can be edited and
+            validated against suggested character counts
+        </li>
+        <li>Count and list all internal and external links</li>
+        <li>View Rich Text Snippets and checks for malformatted json</li>
+        <li>View sitemap and checks for malformatted xml</li>
+    </ul>
+</Hero>
 <section class="section call-to-action">
     <div class="container">
         <h2>Take Esseeoh out for a spin</h2>
         <button
             on:click={() =>
                 getGist(
-                    "https://gist.githubusercontent.com/Blumed/b6d4e56b5d943b235c6cf540a51a5bd5/raw/seo-bookmarklet.js?"
+                    "https://bookmarklets.make-bookmarklets.com/esseeoh.js?",
                 )}
             class="button button-bookmarklet">See the value for yourself</button
         >
@@ -41,10 +64,24 @@
         <div class="bookmarklet-copy">
             <h2>How to install Esseeoh</h2>
             <ol class="how-to-install">
-                <li>
+                <li class="desktop-only">
                     Click and drag the <strong>{bookmarkletName}</strong> button
                     to your browsers bookmark bar.
                 </li>
+                <li class="mobile-only">Click copy button below</li>
+                <li class="mobile-only">
+                    Create a bookmark on your phone. You can bookmark this page.
+                </li>
+                <li class="mobile-only">Open up your bookmarks and edit</li>
+                <li class="mobile-only">Change the name to Esseeoh</li>
+                <li class="mobile-only">
+                    Paste the copied code into the url and save
+                </li>
+                <li class="mobile-only">
+                    Not all devices are as simple as clicking the bookmark to
+                    launch it. You may need to read up on how your phone or
+                    tablet works with bookmarklets
+                </li>
                 <li>You did it 🎉</li>
             </ol>
         </div>
@@ -53,9 +90,22 @@
             <a
                 href={bookmarklet}
                 on:click={(e) => e.preventDefault()}
-                class="button fill-white">{bookmarkletName}</a
+                class="button fill-white desktop-only">{bookmarkletName}</a
             >
         </div>
+        <input
+            type="text"
+            class="input mobile-only"
+            name="output"
+            id="output"
+            value={bookmarklet}
+        />
+        <button
+            type="button"
+            class="button-copy mobile-only"
+            on:click={() => navigator.clipboard.writeText(bookmarklet)}
+            >Copy</button
+        >
     </div>
 </section>
 
@@ -101,7 +151,7 @@
         padding-left: 15px;
     }
     @media (max-width: 768px) {
-        .bookmarklet-section {
+        .section {
             position: relative;
             z-index: 1;
             margin-bottom: 0;
diff --git a/src/routes/bookmarklets/responsive-breakpoint-builder/+page.svelte b/src/routes/bookmarklets/responsive-breakpoint-builder/+page.svelte
new file mode 100644
index 0000000..b56e00d
--- /dev/null
+++ b/src/routes/bookmarklets/responsive-breakpoint-builder/+page.svelte
@@ -0,0 +1,521 @@
+<script lang="ts">
+    import Bookmarklet from "./bookmarklet.svelte";
+    import Seo from "$lib/components/page-meta.svelte";
+    import Hero from "$lib/components/hero.svelte";
+
+    let toggleBookmarklet = false;
+
+    let data = {
+        backgroundColors: {
+            container: "#000000",
+            xxl: "#999999",
+            xl: "#7d96ff",
+            lg: "#98ff7d",
+            md: "#ff837d",
+            sm: "#b57dff",
+            xs: "#ff7dd6",
+        },
+        colors: {
+            container: "#ffffff",
+            xxl: "#ffffff",
+            xl: "#ffffff",
+            lg: "#ffffff",
+            md: "#ffffff",
+            sm: "#ffffff",
+            xs: "#ffffff",
+        },
+        text: {
+            xxl: "xxl",
+            xl: "xl",
+            lg: "lg",
+            md: "md",
+            sm: "sm",
+            xs: "xs",
+        },
+        textColor: {
+            currentColor: "#ffffff",
+        },
+        breakpoint: {
+            xxl: 1400,
+            xl: 1200,
+            lg: 992,
+            md: 768,
+            sm: 576,
+            xs: 400,
+        },
+        bookmarkletName: "Drag Me To Your Bookmark Bar",
+    };
+    const bulma = () => {
+        data.text.xs = "mobile";
+        data.breakpoint.xs = 768;
+        data.text.sm = "tablet";
+        data.breakpoint.sm = 1023;
+        data.text.md = "desktop";
+        data.breakpoint.md = 1215;
+        data.text.lg = "widescreen";
+        data.breakpoint.lg = 1408;
+        data.text.xl = "fullhd";
+        data.breakpoint.xl = 2816;
+        data.text.xxl = "";
+        data.breakpoint.xxl = 0;
+    };
+    const semanticUI = () => {
+        data.text.xs = "mobile";
+        data.breakpoint.xs = 768;
+        data.text.sm = "tablet";
+        data.breakpoint.sm = 991;
+        data.text.md = "small monitor";
+        data.breakpoint.md = 1200;
+        data.text.lg = "large monitor";
+        data.breakpoint.lg = 2000;
+        data.text.xl = "";
+        data.breakpoint.xl = 0;
+        data.text.xxl = "";
+        data.breakpoint.xxl = 0;
+    };
+    const bootstrap = () => {
+        data.text.xs = "xs";
+        data.breakpoint.xs = 400;
+        data.text.sm = "sm";
+        data.breakpoint.sm = 576;
+        data.text.md = "md";
+        data.breakpoint.md = 768;
+        data.text.lg = "lg";
+        data.breakpoint.lg = 992;
+        data.text.xl = "xl";
+        data.breakpoint.xl = 1200;
+        data.text.xxl = "xxl";
+        data.breakpoint.xxl = 1400;
+    };
+</script>
+
+<Seo
+    title="Responsive Breakpoint Bookmarklet"
+    pageCanonicalUrl="/bookmarklets/responsive-breakpoint"
+/>
+
+<Hero>
+    <span slot="light">Responsive Breakpoint</span>
+    <ul slot="features">
+        <li>Have you ever wanted a quick view of your responsive
+            breakpoints? This tool helps you see the relationship
+            between breakpoints for dialing in UI. Change the
+            breakpoints to fit your needs. Change text and color and
+            make it your own.</li>
+    </ul>
+</Hero>
+<section class="section">
+    <div class="container">
+    <h2>Breakpoints</h2>
+    <div class="cards">
+        <div class="card">
+            <h3>Extra Extra Large</h3>
+            <div class="field-group is-spaced">
+                <label for="xxlBg">Background Color</label>
+                <input
+                    class="input-color"
+                    id="xxlBg"
+                    type="color"
+                    bind:value={data.backgroundColors.xxl}
+                />
+            </div>
+            <div class="field-group is-spaced">
+                <label for="xxlColor">Text Color</label>
+                <input
+                    class="input-color"
+                    id="xxlColor"
+                    type="color"
+                    bind:value={data.colors.xxl}
+                />
+            </div>
+            <div class="field-group">
+                <label class="sr-only" for="xxlText">Text</label>
+                <input
+                    class="input-text"
+                    id="xxlText"
+                    type="text"
+                    bind:value={data.text.xxl}
+                />
+            </div>
+            <div class="field-group">
+                <label for="xxlBreakpoint"
+                    >Max Width: {data.breakpoint.xxl}</label
+                >
+                <input
+                    class="input-range"
+                    id="xxlBreakpoint"
+                    type="range"
+                    min="0"
+                    max="2400"
+                    style={`accent-color: ${data.backgroundColors.xxl}`}
+                    bind:value={data.breakpoint.xxl}
+                />
+            </div>
+        </div>
+        <div class="card">
+            <h3>Extra Large</h3>
+            <div class="field-group is-spaced">
+                <label for="xlBg">Background Color</label>
+                <input
+                    class="input-color"
+                    id="xlBg"
+                    type="color"
+                    bind:value={data.backgroundColors.xl}
+                />
+            </div>
+            <div class="field-group is-spaced">
+                <label for="xlColor">Text Color</label>
+                <input
+                    class="input-color"
+                    id="xlColor"
+                    type="color"
+                    bind:value={data.colors.xl}
+                />
+            </div>
+            <div class="field-group">
+                <label class="sr-only" for="xlText">Text</label>
+                <input
+                    class="input-text"
+                    id="xlText"
+                    type="text"
+                    bind:value={data.text.xl}
+                />
+            </div>
+            <div class="field-group">
+                <label for="xlBreakpoint">Max Width: {data.breakpoint.xl}</label
+                >
+                <input
+                    class="input-range"
+                    id="xlBreakpoint"
+                    type="range"
+                    min="0"
+                    max="2400"
+                    style={`accent-color: ${data.backgroundColors.xl}`}
+                    bind:value={data.breakpoint.xl}
+                />
+            </div>
+        </div>
+        <div class="card">
+            <h3>Large</h3>
+            <div class="field-group is-spaced">
+                <label for="lgBg">Background Color</label>
+                <input
+                    class="input-color"
+                    id="lgBg"
+                    type="color"
+                    bind:value={data.backgroundColors.lg}
+                />
+            </div>
+            <div class="field-group is-spaced">
+                <label for="lgColor">Color</label>
+                <input
+                    class="input-color"
+                    id="lgColor"
+                    type="color"
+                    bind:value={data.colors.lg}
+                />
+            </div>
+            <div class="field-group">
+                <label class="sr-only" for="lgText">Text</label>
+                <input
+                    class="input-text"
+                    id="lgText"
+                    type="text"
+                    bind:value={data.text.lg}
+                />
+            </div>
+            <div class="field-group">
+                <label for="lgBreakpoint">Max Width: {data.breakpoint.lg}</label
+                >
+                <input
+                    class="input-range"
+                    id="lgBreakpoint"
+                    type="range"
+                    min="0"
+                    max="2400"
+                    style={`accent-color: ${data.backgroundColors.lg}`}
+                    bind:value={data.breakpoint.lg}
+                />
+            </div>
+        </div>
+        <div class="card">
+            <h3>Medium</h3>
+            <div class="field-group is-spaced">
+                <label for="mdBg">Background Color</label>
+                <input
+                    class="input-color"
+                    id="mdBg"
+                    type="color"
+                    bind:value={data.backgroundColors.md}
+                />
+            </div>
+            <div class="field-group is-spaced">
+                <label for="mdColor">Color</label>
+                <input
+                    class="input-color"
+                    id="mdColor"
+                    type="color"
+                    bind:value={data.colors.md}
+                />
+            </div>
+            <div class="field-group">
+                <label class="sr-only" for="mdText">Text</label>
+                <input
+                    class="input-text"
+                    id="mdText"
+                    type="text"
+                    bind:value={data.text.md}
+                />
+            </div>
+            <div class="field-group">
+                <label for="mdBreakpoint">Max Width: {data.breakpoint.md}</label
+                >
+                <input
+                    class="input-range"
+                    id="mdBreakpoint"
+                    type="range"
+                    min="0"
+                    max="2400"
+                    style={`accent-color: ${data.backgroundColors.md}`}
+                    bind:value={data.breakpoint.md}
+                />
+            </div>
+        </div>
+        <div class="card">
+            <h3>Small</h3>
+            <div class="field-group is-spaced">
+                <label for="smBg">Background Color</label>
+                <input
+                    class="input-color"
+                    id="smBg"
+                    type="color"
+                    bind:value={data.backgroundColors.sm}
+                />
+            </div>
+            <div class="field-group is-spaced">
+                <label for="smColor">Color</label>
+                <input
+                    class="input-color"
+                    id="smColor"
+                    type="color"
+                    bind:value={data.colors.sm}
+                />
+            </div>
+            <div class="field-group is-spaced">
+                <label class="sr-only" for="smText">Text</label>
+                <input
+                    class="input-text"
+                    id="smText"
+                    type="text"
+                    bind:value={data.text.sm}
+                />
+            </div>
+            <div class="field-group">
+                <label for="smBreakpoint">Max Width: {data.breakpoint.sm}</label
+                >
+                <input
+                    class="input-range"
+                    id="smBreakpoint"
+                    type="range"
+                    min="0"
+                    max="2400"
+                    style={`accent-color: ${data.backgroundColors.sm}`}
+                    bind:value={data.breakpoint.sm}
+                />
+            </div>
+        </div>
+        <div class="card">
+            <h3>Extra Small</h3>
+            <div class="field-group is-spaced">
+                <label for="xsBg">Background Color</label>
+                <input
+                    class="input-color"
+                    id="xsBg"
+                    type="color"
+                    bind:value={data.backgroundColors.xs}
+                />
+            </div>
+            <div class="field-group is-spaced">
+                <label for="xsColor">Color</label>
+                <input
+                    class="input-color"
+                    id="xsColor"
+                    type="color"
+                    bind:value={data.colors.xs}
+                />
+            </div>
+            <div class="field-group">
+                <label class="sr-only" for="xsText">Text</label>
+                <input
+                    class="input-text"
+                    id="xsText"
+                    type="text"
+                    bind:value={data.text.xs}
+                />
+            </div>
+            <div class="field-group">
+                <label for="xsBreakpoint">Max Width: {data.breakpoint.xs}</label
+                >
+                <input
+                    class="input-range"
+                    id="xsBreakpoint"
+                    type="range"
+                    min="0"
+                    max="2400"
+                    style={`accent-color: ${data.backgroundColors.xs}`}
+                    bind:value={data.breakpoint.xs}
+                />
+            </div>
+        </div>
+    </div>
+    <div class="cards is-two-columns">
+        <div class="card">
+            <h3>More Bookmarklet Configuration</h3>
+            <div class="field-group is-spaced">
+                <label for="containerBg">Container</label>
+                <input
+                    class="input-color"
+                    id="containerBg"
+                    type="color"
+                    bind:value={data.backgroundColors.container}
+                />
+            </div>
+            <div class="field-group is-spaced">
+                <label for="textColor">Window Display Color</label>
+                <input
+                    class="input-color"
+                    id="textColor"
+                    type="color"
+                    bind:value={data.textColor.currentColor}
+                />
+            </div>
+            <div class="field-group">
+                <label class="sr-only" for="bookmarkletName"
+                    >Bookmarklet Name</label
+                >
+                <input
+                    class="input-text"
+                    id="bookmarkletName"
+                    type="text"
+                    bind:value={data.bookmarkletName}
+                />
+            </div>
+        </div>
+        <div class="card">
+            <h3>Popular Css Framework Presets</h3>
+            <div class="buttons">
+                <button type="button" class="button fill-white" on:click={bulma}>Bulma</button>
+                <button type="button" class="button fill-white" on:click={semanticUI}>Semantic UI</button>
+                <button type="button" class="button fill-white" on:click={bootstrap}>Bootstrap</button>
+            </div>
+        </div>
+    </div>
+    {#key data || toggleBookmarklet}
+    <Bookmarklet {data} {toggleBookmarklet} />
+{/key}
+
+<button
+    type="button"
+    on:click={() => (toggleBookmarklet = !toggleBookmarklet)}
+    class="button button-toggle-bookmarklet"
+    >{`${toggleBookmarklet ? "Hide" : "Show"} Bookmarklet`}
+</button>
+</div>
+</section>
+
+
+<!-- <section class="decorative-background">
+    <div class="container">
+    <h2>Things to note</h2>
+    <ul>
+        <li>
+            I don't use Bootstrap but everyone else does so I set it as the
+            default breakpoint settings.
+        </li>
+        <li>
+            The tool bumps the site down a little to make room for the
+            bookmarklet above pages. This is fine unless your site uses position
+            fixed in the nav. If you are trying to debug the nav and there is
+            overlap with the bookmarklet you will need to adjust for this.
+        </li>
+        <li>
+            If you have multiple sites and each site uses different breakpoints.
+            A nice way to organize this tool is by making a bookmark folder and
+            placing each bookmarklet you need in it and renaming each
+            bookmarklet to be the name of each of your sites.
+        </li>
+        <li>
+            If you use a popular css framework which you think should have a preset let me know.
+        </li>
+    </ul>
+</div>
+</section> -->
+
+<style lang="scss">
+    .section {
+        position: relative;
+        z-index: 1;
+    }
+    .clean-inline {
+        display: table;
+        padding-right: 15px;
+        background-color: var(--color-white);
+    }
+    .decorative-background {
+        margin-top: 60px;
+    }
+    .cards {
+        display: grid;
+        grid-template-columns: auto auto auto;
+        gap: 22px;
+        margin-bottom: 34px;
+        &.is-two-columns {
+            grid-template-columns: auto auto;
+        }
+    }
+    .input-color,
+    .input-text {
+        margin-bottom: 15px;
+    }
+    .input-color {
+        border: 2px solid var(--color-black);
+
+        cursor: pointer;
+    }
+    .input-text {
+        padding: 5px 5px 3px;
+        width: 100%;
+        border-radius: 4px;
+        border: 2px solid var(--color-black);
+    }
+    .input-range {
+        width: 100%;
+    }
+    .card {
+        background-color: var(--color-white);
+        padding: 56px 32px 32px;
+        //border: 2px solid var(--color-black);
+        box-shadow: 6px 6px 0 0 var(--color-black);
+        h3 {
+            margin-top: 0;
+        }
+    }
+    .buttons {
+        display: flex;
+        gap: 20px;
+        flex-wrap: wrap;
+        :global(button) {
+            margin: 0;
+        }
+    }
+    .field-group.is-spaced {
+        display: flex;
+        justify-content: space-between;
+    }
+    @media (max-width: 768px) {
+        .cards,
+        .cards.is-two-columns {
+            grid-template-columns: auto;
+        }
+    }
+</style>
diff --git a/src/routes/bookmarklets/responsive-breakpoint-builder/bookmarklet.svelte b/src/routes/bookmarklets/responsive-breakpoint-builder/bookmarklet.svelte
new file mode 100644
index 0000000..faff6ea
--- /dev/null
+++ b/src/routes/bookmarklets/responsive-breakpoint-builder/bookmarklet.svelte
@@ -0,0 +1,89 @@
+<script lang="ts">
+    import { browser } from "$app/environment";
+    export let data: any;
+    export let toggleBookmarklet: boolean;
+
+    //https://www.toptal.com/developers/javascript-minifier
+    export let dynamicString =
+        '!function(){let t={xxl:{background:"' +
+        data.backgroundColors.xxl +
+        '",color:"' +
+        data.colors.xxl +
+        '",maxWidth:' +
+        data.breakpoint.xxl +
+        ',text:"' +
+        data.text.xxl +
+        '"},xl:{background:"' +
+        data.backgroundColors.xl +
+        '",color:"' +
+        data.colors.xl +
+        '",maxWidth:' +
+        data.breakpoint.xl +
+        ',text:"' +
+        data.text.xl +
+        '"},lg:{background:"' +
+        data.backgroundColors.lg +
+        '",color:"' +
+        data.colors.lg +
+        '",maxWidth:' +
+        data.breakpoint.lg +
+        ',text:"' +
+        data.text.lg +
+        '"},md:{background:"' +
+        data.backgroundColors.md +
+        '",color:"' +
+        data.colors.md +
+        '",maxWidth:' +
+        data.breakpoint.md +
+        ',text:"' +
+        data.text.md +
+        '"},sm:{background:"' +
+        data.backgroundColors.sm +
+        '",color:"' +
+        data.colors.sm +
+        '",maxWidth:' +
+        data.breakpoint.sm +
+        ',text:"' +
+        data.text.sm +
+        '"},xs:{background:"' +
+        data.backgroundColors.xs +
+        '",color:"' +
+        data.colors.xs +
+        '",maxWidth:' +
+        data.breakpoint.xs +
+        ',text:"' +
+        data.text.xs +
+        '"},static:{wrap:"width: 100%;letter-spacing:1px;background-color:' +
+        data.backgroundColors.container +
+        ";text-align:right;font-family:helvetica !important;font-weight:100;line-height:20px;color:" +
+        data.textColor.currentColor +
+        ';margin:auto;top:0;right:0;left:0;position:fixed;z-index:2147483647;font-size:18px;height:36px;text-rendering:optimizeLegibility;",panel:"position: absolute;padding: 3px 0;margin: 0 auto;width: 100%;right: 0;left: 0;top:0;bottom:0;",font:"font-size: inherit;color:inherit;font-weight:100;",dots:"width:10px;height:10px;border:1px solid ' +
+        data.textColor.currentColor +
+        ';position:absolute;top:14px;border-radius:10px;"}};function e(t,e){clearTimeout(t),t=setTimeout(x,e)}function x(){let e=document.getElementById("screen-width"),x=document.getElementById("before-circle"),i=document.getElementById("after-circle"),l=window.innerWidth;e.innerText=window.innerWidth,e.setAttribute("style",`${t.static.font}${l===t.xxl.maxWidth||l===t.xl.maxWidth||l===t.lg.maxWidth||l===t.md.maxWidth||l===t.sm.maxWidth||l===t.xs.maxWidth?"font-weight: 600;":""}`),x.setAttribute("style",`${t.static.dots}left:62px;${l===t.xxl.maxWidth-1||l===t.xl.maxWidth-1||l===t.lg.maxWidth-1||l===t.md.maxWidth-1||l===t.sm.maxWidth-1||l===t.xs.maxWidth-1?"background-color: ' +
+        data.textColor.currentColor +
+        ';":""}`),i.setAttribute("style",`${t.static.dots}right:62px;${l===t.xxl.maxWidth+1||l===t.xl.maxWidth+1||l===t.lg.maxWidth+1||l===t.md.maxWidth+1||l===t.sm.maxWidth+1||l===t.xs.maxWidth+1?"background-color: ' +
+        data.textColor.currentColor +
+        ';":""}`)}(function x(){function i(t,e,x){let i=document.createElement("p");i.setAttribute("style","margin: 0;padding: 5px; color: inherit;font-weight: inherit;"),i.setAttribute("title",`breakpoint: ${x}`),i.textContent=e,t.appendChild(i)}let l=document.createElement("div");l.className="xxxxxx_wraper_xxxxx",l.setAttribute("style",t.static.wrap),document.body.appendChild(l);let a=document.createElement("button");a.setAttribute("type","button"),a.className="xxxxxx_close_xxxxx",a.setAttribute("style","position:absolute;left:30px;top:8px !important;background-color:white;border-radius:50%;color:black;z-index:30;padding:0;font-size:15px;font-weight:100;width:20px;height:20px;cursor:pointer;display:flex;justify-content:center;align-items:center;border:1px solid black;"),a.onclick=function t(){window.removeEventListener("resize",e),l.remove()},l.appendChild(a);let o=document.createElement("span");o.setAttribute("style","margin-top:-3px;"),o.textContent="x",a.appendChild(o);let n=document.createElement("section");n.className="xxxxxx_xxl_xxxxx",n.setAttribute("style",`max-width:${t.xxl.maxWidth}px;background-color:${t.xxl.background};${t.static.font}color:${t.xxl.color};${t.static.panel}z-index: 1;`),i(n,t.xxl.text,t.xxl.maxWidth),l.appendChild(n);let d=document.createElement("section");d.className="xxxxxx_xl_xxxxx",d.setAttribute("style",`max-width:${t.xl.maxWidth}px;background-color:${t.xl.background};${t.static.font}color:${t.xl.color};${t.static.panel}z-index: 2;`),i(d,t.xl.text,t.xl.maxWidth),l.appendChild(d);let r=document.createElement("section");r.className="xxxxxx_lg_xxxxx",r.setAttribute("style",`max-width:${t.lg.maxWidth}px;background-color:${t.lg.background};${t.static.font}color:${t.lg.color};${t.static.panel}z-index: 3;`),i(r,t.lg.text,t.lg.maxWidth),l.appendChild(r);let c=document.createElement("section");c.className="xxxxxx_md_xxxxx",c.setAttribute("style",`max-width:${t.md.maxWidth}px;background-color:${t.md.background};${t.static.font}color:${t.md.color};${t.static.panel}z-index: 4;`),i(c,t.md.text,t.md.maxWidth),l.appendChild(c);let s=document.createElement("section");s.className="xxxxxx_sm_xxxxx",s.setAttribute("style",`max-width:${t.sm.maxWidth}px;background-color:${t.sm.background};${t.static.font}color:${t.sm.color};${t.static.panel}z-index: 5;`),i(s,t.sm.text,t.sm.maxWidth),l.appendChild(s);let m=document.createElement("section");m.className="xxxxxx_xs_xxxxx",m.setAttribute("style",`max-width:${t.xs.maxWidth}px;background-color:${t.xs.background};${t.static.font}color:${t.xs.color};${t.static.panel}z-index: 6;`),i(m,t.xs.text,t.xs.maxWidth),l.appendChild(m);let p=document.createElement("section");p.className="xxxxxx_display_xxxxx",p.setAttribute("style",`width:200px;height:100%;margin:0 auto;position:relative;text-align:center;color:inherit;padding-top: 10px;letter-spacing:inherit;z-index:7;${t.static.font}`),l.appendChild(p);let h=document.createElement("div");h.setAttribute("id","before-circle"),p.appendChild(h);let f=document.createElement("span");f.setAttribute("id","screen-width"),p.appendChild(f);let g=document.createElement("div");g.setAttribute("id","after-circle"),p.appendChild(g);let u=document.createElement("style");u.textContent="html{padding-top: 36px !important;}",l.appendChild(u)})(),x(),window.addEventListener("resize",e)}();';
+    export let bookmarkletify = "javascript:" + dynamicString;
+
+    $: data || toggleBookmarklet, toggleBookmarklet && updateBookmarklet();
+    $: toggleBookmarklet, updateBookmarklet();
+
+    function updateBookmarklet() {
+        if (browser && toggleBookmarklet === true) {
+            const bookmarklet = document.querySelector(".xxxxxx_wraper_xxxxx");
+            bookmarklet && bookmarklet ? bookmarklet.remove() : null;
+            return new Function("return " + dynamicString)();
+        }
+        if (browser && toggleBookmarklet === false) {
+            toggleBookmarklet = false;
+            const bookmarklet = document.querySelector(".xxxxxx_wraper_xxxxx");
+            bookmarklet && bookmarklet ? bookmarklet.remove() : null;
+        }
+    }
+</script>
+
+<a
+    href={bookmarkletify}
+    class="button fill-pink"
+>{data.bookmarkletName}</a>
\ No newline at end of file

From 89d5c822607c3f57b586e25e061d66e8f0556c66 Mon Sep 17 00:00:00 2001
From: blumed <cullan.luther@gmail.com>
Date: Sat, 20 Apr 2024 11:30:26 -0500
Subject: [PATCH 2/4] broke out code editor, change to pnpm, removed testing
 for now

---
 package.json                                  |   19 +-
 playwright.config.ts                          |   11 -
 src/lib/components/editors/js-editor.svelte   |  346 +++
 src/routes/(app)/+page.svelte                 |  269 +-
 .../bookmarklets/[slug].svelte/+page.svelte   |   10 -
 .../bookmarklets/[slug].svelte/+page.ts       |   23 -
 src/routes/bookmarklets/[slug]/+page.svelte   |   27 +
 src/routes/bookmarklets/[slug]/+page.ts       |   59 +
 tests/test.ts                                 |    6 -
 yarn.lock                                     | 2185 -----------------
 10 files changed, 445 insertions(+), 2510 deletions(-)
 delete mode 100644 playwright.config.ts
 delete mode 100644 src/routes/bookmarklets/[slug].svelte/+page.svelte
 delete mode 100644 src/routes/bookmarklets/[slug].svelte/+page.ts
 create mode 100644 src/routes/bookmarklets/[slug]/+page.svelte
 create mode 100644 src/routes/bookmarklets/[slug]/+page.ts
 delete mode 100644 tests/test.ts
 delete mode 100644 yarn.lock

diff --git a/package.json b/package.json
index 5589739..555669e 100644
--- a/package.json
+++ b/package.json
@@ -3,10 +3,11 @@
 	"version": "0.0.1",
 	"private": true,
 	"scripts": {
+		"start": "vite dev",
 		"dev": "vite dev",
 		"build": "vite build && terser ./build/esseeoh.js -c -m -o ./build/esseeoh.js",
 		"preview": "vite preview",
-		"test": "playwright test",
+		"test": "vite test",
 		"check": "svelte-kit sync && svelte-check --tsconfig ./tsconfig.json",
 		"check:watch": "svelte-kit sync && svelte-check --tsconfig ./tsconfig.json --watch",
 		"test:unit": "vitest",
@@ -18,27 +19,25 @@
 		"@codemirror/lang-javascript": "^6.1.4",
 		"@codemirror/lint": "^6.1.0",
 		"@codemirror/theme-one-dark": "^6.1.0",
-		"@playwright/test": "^1.28.1",
 		"@sveltejs/adapter-static": "^2.0.1",
 		"@sveltejs/kit": "^1.5.0",
 		"@types/uglify-js": "^3.17.1",
 		"@typescript-eslint/eslint-plugin": "^5.45.0",
 		"@typescript-eslint/parser": "^5.45.0",
 		"codemirror": "^6.0.1",
-		"eslint": "^8.28.0",
+		"eslint": "^8.56.0",
 		"eslint-linter-browserify": "^8.34.0",
 		"eslint-plugin-svelte3": "^4.0.0",
-		"sass": "^1.58.2",
-		"svelte": "^4.0.0",
+		"sass": "^1.70.0",
+		"svelte": "^4.2.10",
 		"svelte-check": "^3.0.1",
 		"svelte-codemirror-editor": "^1.1.0",
 		"svelte-sitemap": "^2.6.0",
 		"terser": "^5.16.3",
-		"tslib": "^2.4.1",
+		"tslib": "^2.6.2",
 		"typescript": "^5.0.0",
-		"vite": "^4.0.0",
-		"vitest": "^0.32.0"
+		"vite": "^5.1.1",
+		"vitest": "^1.2.2"
 	},
-	"type": "module",
-	"dependencies": {}
+	"type": "module"
 }
\ No newline at end of file
diff --git a/playwright.config.ts b/playwright.config.ts
deleted file mode 100644
index 80731be..0000000
--- a/playwright.config.ts
+++ /dev/null
@@ -1,11 +0,0 @@
-import type { PlaywrightTestConfig } from '@playwright/test';
-
-const config: PlaywrightTestConfig = {
-	webServer: {
-		command: 'npm run build && npm run preview',
-		port: 4173
-	},
-	testDir: 'tests'
-};
-
-export default config;
diff --git a/src/lib/components/editors/js-editor.svelte b/src/lib/components/editors/js-editor.svelte
index 41efc67..be07779 100644
--- a/src/lib/components/editors/js-editor.svelte
+++ b/src/lib/components/editors/js-editor.svelte
@@ -5,7 +5,92 @@
     import * as eslint from "eslint-linter-browserify";
     import { oneDark } from "@codemirror/theme-one-dark";
     import { config } from "$lib/components/constants";
+    import { slide } from "svelte/transition";
+    import { minify } from "terser";
+
     export let codeEditor: string = "";
+console.log('codeEditor', codeEditor);
+    let errorMessage = "";
+    let gistMultipleFiles = false;
+    let gistValid = true;
+    let gistErrorMessage: null | string = null;
+    let gistFiles: null | any[] = null;
+    let gistEditorMessage = "";
+    let selectedGist: number | string = "";
+    let codeInputGist = "";
+    let codeOutput = "";
+    let bookmarkletName = "Drag Me To Your Nearest Bookmark Bar";
+    let gistUrl = "";
+    let toggleBookmarklet = false;
+    let toggleExamples = false;
+    let toggleSnippets = false;
+    let toggleGists = false;
+    let toggleOptions = false;
+    let clickedMobileInstructions = false;
+    let files: any;
+
+    async function minification(str: string) {
+        const result = await minify(str, {});
+        return result.code;
+    }
+
+    function result() {
+        if (codeInputGist !== "") {
+            return minification(codeInputGist)
+                .then((result) => {
+                    errorMessage = "";
+                    if (result === "") {
+                        errorMessage =
+                            "Sorry something went wrong creating your gist bookmarklet 😅";
+                    } else {
+                        codeOutput =
+                            "javascript:(function(){" + result + "}());";
+                    }
+
+                    return;
+                })
+                .catch((err) => {
+                    codeOutput = "";
+                    return (errorMessage = err);
+                });
+        }
+
+        return minification(codeEditor)
+            .then((result) => {
+                errorMessage = "";
+                if (result === "") {
+                    errorMessage = "Put some code in there!";
+                } else {
+                    codeOutput = "javascript:(function(){" + result + "}());";
+                }
+                return;
+            })
+            .catch((err) => {
+                codeOutput = "";
+                return (errorMessage = err);
+            });
+    }
+
+    function reset() {
+        codeOutput = "";
+        codeEditor = "";
+        errorMessage = "";
+        codeInputGist = "";
+        gistUrl = "";
+        selectedGist = "";
+        gistEditorMessage = "";
+        clickedMobileInstructions = false;
+    }
+
+    $: if (codeEditor === "") reset();
+    $: if (codeEditor !== "" && errorMessage === "Put some code in there!")
+        errorMessage = "";
+    $: codeEditor = codeEditor;
+    $: if (gistUrl === "" && !gistValid) gistValid = true;
+    gistErrorMessage = null;
+
+    $: if (gistUrl === "") gistMultipleFiles = false;
+    $: selectedGist, selectedGist !== "" && createGistBookmarklet();
 </script>
 
 <CodeMirror
@@ -18,3 +103,264 @@
         linter(esLint(new eslint.Linter(), config)),
     ]}
 />
+{#if errorMessage !== ""}
+    <div
+        class={`editor-drawer error-message ${codeInputGist && "gist-message"}`}
+        in:slide
+        out:slide
+    >
+        <span>{errorMessage}</span>
+    </div>
+{/if}
+
+<div class="code-input-controls">
+    <div class="buttons">
+        <button
+            type="button"
+            class="button button-create fill-white"
+            on:click={result}
+            >{codeOutput === "" ? "Create" : "Update"} Bookmarklet</button
+        >
+        <button
+            type="button"
+            class="button button-reset fill-white"
+            on:click={reset}>Reset</button
+        >
+        {#if codeOutput !== ""}
+            <a
+                href={codeOutput}
+                class="button button-run-code fill-blue mobile-only">Run Code</a
+            >
+        {/if}
+    </div>
+</div>
+
+{#if codeOutput !== ""}
+    <div class="code-output-controls" in:slide out:slide>
+        <a
+            role="button"
+            href={codeOutput}
+            class="button button-run-code fill-blue desktop-only">Run Code</a
+        >
+        <button
+            type="button"
+            class="button button-toggle-code fill-white desktop-only"
+            on:click={() => (toggleBookmarklet = !toggleBookmarklet)}
+            >{`${toggleBookmarklet ? "Hide" : "Show"} Code`}
+        </button>
+        <div class="group-bookmarklet-output">
+            <a
+                role="button"
+                href={codeOutput}
+                on:click={(e) => e.preventDefault()}
+                class="button button-bookmarklet">{bookmarkletName}</a
+            >
+            <div class="inline-field-group desktop-only">
+                <label for="name">Name your Bookmarklet</label>
+                <input
+                    type="text"
+                    id="name"
+                    class="input"
+                    bind:value={bookmarkletName}
+                />
+            </div>
+        </div>
+
+        {#if toggleBookmarklet && codeOutput !== ""}
+            <div
+                class="inline-field-group output-code-fields desktop-only"
+                in:slide
+                out:slide
+            >
+                <input
+                    type="text"
+                    class="input"
+                    name="output"
+                    id="output"
+                    value={codeOutput}
+                />
+                <button
+                    type="button"
+                    class="button-copy"
+                    in:slide
+                    on:click={() => navigator.clipboard.writeText(codeOutput)}
+                    >Copy</button
+                >
+            </div>
+        {/if}
+
+        <div class="inline-field-group output-code-fields mobile-only">
+            <label for="output">Bookmarklet Url</label>
+            <input
+                type="text"
+                class="input"
+                name="output"
+                id="output"
+                value={codeOutput}
+            />
+            <button
+                type="button"
+                class="button-copy"
+                in:slide
+                on:click={() => navigator.clipboard.writeText(codeOutput)}
+                >Copy</button
+            >
+        </div>
+        <!-- <button
+        type="button"
+        class="button fill-white button-mobile-instructions mobile-only"
+        on:click={() => scrollToMobileInstructions()}
+        >Save bookmarklets on mobile?</button
+    > -->
+    </div>
+{/if}
+
+<style lang="scss">
+     .code-input-controls {
+        margin-top: 50px;
+        margin-bottom: 30px;
+        .buttons {
+            display: flex;
+        }
+        .button {
+            height: 50px;
+        }
+    }
+    .gist-message {
+        height: 100%;
+        display: flex;
+        align-items: center;
+        padding: 1rem;
+        border-bottom: 2px solid white;
+        color: var(--color-clay);
+        background-color: #282c34;
+        box-shadow: 12px 12px 0 0 #fff;
+    }
+    .gist-message + .editor-wrapper:before {
+        content: "";
+        position: absolute;
+        inset: 0;
+        background-color: rgb(255, 255, 255, 0.1);
+        z-index: 1;
+        pointer-events: none;
+    }
+    .editor-wrapper {
+        min-height: 230px;
+        position: relative;
+        z-index: 1;
+        box-shadow: 12px 12px 0 0 #fff;
+        background-color: #282c34;
+    }
+
+    :global(.cm-scroller) {
+        min-height: 200px;
+    }
+    .external-files {
+        display: flex;
+    }
+    .editor-drawer {
+        padding: 1rem;
+        box-shadow: 12px 12px 0 0 #fff;
+        position: relative;
+        z-index: 2;
+    }
+    .error-message {
+        height: 100%;
+        display: flex;
+        align-items: center;
+        color: var(--color-dark-red);
+        background-color: pink;
+    }
+    .drawer-options {
+        background-color: var(--color-turquoise);
+    }
+    .code-output-controls {
+        display: flex;
+        flex-wrap: wrap;
+        position: relative;
+    }
+    .inline-field-group {
+        display: flex;
+        align-items: center;
+        margin-left: auto;
+        order: 2;
+        #name {
+            min-width: 167px;
+        }
+    }
+    .button-upload {
+        margin-left: auto;
+    }
+    .button-upload,
+    .button-download {
+        display: flex;
+        align-items: center;
+    }
+    .button-download img {
+        transform: rotate(180deg);
+    }
+    .button.button-bookmarklet {
+        margin-bottom: 30px;
+        background-color: #f78da7;
+        line-height: 20px;
+    }
+    .button-toggle-code {
+        height: 50px;
+    }
+    .button-run-code {
+        height: 50px;
+        line-height: 17px;
+        &.desktop-only {
+            margin-right: 20px;
+        }
+    }
+    .button-copy {
+        position: absolute;
+        cursor: pointer;
+        right: 0;
+        color: var(--color-black);
+        height: 38.5px;
+        top: 20px;
+        padding-inline: 10px;
+        border-top-left-radius: 0;
+        border-bottom-left-radius: 0;
+        border: 2px solid var(--color-black);
+        border-top-right-radius: 0.25rem;
+        border-bottom-right-radius: 0.25rem;
+        background-color: var(--color-clay);
+        transition: var(--global-transition);
+        &:hover {
+            background-color: var(--color-turquoise);
+        }
+    }
+    .output-code-fields {
+        width: calc(100% - 415px);
+        margin: 0;
+        position: absolute;
+        left: 0;
+        max-width: 415px;
+        bottom: 0;
+    }
+    #output {
+        width: 100%;
+        padding: 10px;
+        border: 2px solid var(--color-black);
+        border-radius: 0.25rem;
+        display: flex;
+        margin-top: 20px;
+        align-self: center;
+        order: 3;
+        padding-right: 65px;
+    }
+    .button-reset {
+        &:hover {
+            background-color: var(--color-pink);
+        }
+    }
+
+    .group-bookmarklet-output {
+        display: flex;
+        flex-direction: column;
+        margin-left: auto;
+    }
+</style>
\ No newline at end of file
diff --git a/src/routes/(app)/+page.svelte b/src/routes/(app)/+page.svelte
index 346592e..a47ab1a 100644
--- a/src/routes/(app)/+page.svelte
+++ b/src/routes/(app)/+page.svelte
@@ -331,15 +331,6 @@ getGist('https://gist.githubusercontent.com/${
     //     }
     // }
 
-    $: if (codeInput === "") reset();
-    $: if (codeInput !== "" && errorMessage === "Put some code in there!")
-        errorMessage = "";
-    $: codeInput = codeInput;
-    $: if (gistUrl === "" && !gistValid) gistValid = true;
-    gistErrorMessage = null;
-
-    $: if (gistUrl === "") gistMultipleFiles = false;
-    $: selectedGist, selectedGist !== "" && createGistBookmarklet();
 
     // $: if (files) {
     //     for (const file of files) {
@@ -445,7 +436,7 @@ getGist('https://gist.githubusercontent.com/${
                 </div>
             </div>
         {/if} -->
-        {#if errorMessage !== ""}
+        <!-- {#if errorMessage !== ""}
             <div
                 class={`editor-drawer error-message ${
                     codeInputGist && "gist-message"
@@ -455,113 +446,7 @@ getGist('https://gist.githubusercontent.com/${
             >
                 <span>{errorMessage}</span>
             </div>
-        {/if}
-
-        <div class="code-input-controls">
-            <div class="buttons">
-                <button
-                    type="button"
-                    class="button button-create fill-white"
-                    on:click={result}
-                    >{codeOutput === "" ? "Create" : "Update"} Bookmarklet</button
-                >
-                <button
-                    type="button"
-                    class="button button-reset fill-white"
-                    on:click={reset}>Reset</button
-                >
-                {#if codeOutput !== ""}
-                    <a
-                        href={codeOutput}
-                        class="button button-run-code fill-blue mobile-only"
-                        >Run Code</a
-                    >
-                {/if}
-            </div>
-        </div>
-
-        {#if codeOutput !== ""}
-            <div class="code-output-controls" in:slide out:slide>
-                <a
-                    role="button"
-                    href={codeOutput}
-                    class="button button-run-code fill-blue desktop-only"
-                    >Run Code</a
-                >
-                <button
-                    type="button"
-                    class="button button-toggle-code fill-white desktop-only"
-                    on:click={() => (toggleBookmarklet = !toggleBookmarklet)}
-                    >{`${toggleBookmarklet ? "Hide" : "Show"} Code`}
-                </button>
-                <div class="group-bookmarklet-output">
-                    <a
-                        role="button"
-                        href={codeOutput}
-                        on:click={(e) => e.preventDefault()}
-                        class="button button-bookmarklet">{bookmarkletName}</a
-                    >
-                    <div class="inline-field-group desktop-only">
-                        <label for="name">Name your Bookmarklet</label>
-                        <input
-                            type="text"
-                            id="name"
-                            class="input"
-                            bind:value={bookmarkletName}
-                        />
-                    </div>
-                </div>
-
-                {#if toggleBookmarklet && codeOutput !== ""}
-                    <div
-                        class="inline-field-group output-code-fields desktop-only"
-                        in:slide
-                        out:slide
-                    >
-                        <input
-                            type="text"
-                            class="input"
-                            name="output"
-                            id="output"
-                            value={codeOutput}
-                        />
-                        <button
-                            type="button"
-                            class="button-copy"
-                            in:slide
-                            on:click={() =>
-                                navigator.clipboard.writeText(codeOutput)}
-                            >Copy</button
-                        >
-                    </div>
-                {/if}
-
-                <div class="inline-field-group output-code-fields mobile-only">
-                    <label for="output">Bookmarklet Url</label>
-                    <input
-                        type="text"
-                        class="input"
-                        name="output"
-                        id="output"
-                        value={codeOutput}
-                    />
-                    <button
-                        type="button"
-                        class="button-copy"
-                        in:slide
-                        on:click={() =>
-                            navigator.clipboard.writeText(codeOutput)}
-                        >Copy</button
-                    >
-                </div>
-                <button
-                    type="button"
-                    class="button fill-white button-mobile-instructions mobile-only"
-                    on:click={() => scrollToMobileInstructions()}
-                    >Save bookmarklets on mobile?</button
-                >
-            </div>
-        {/if}
+        {/if} -->
     </div>
 </div>
 
@@ -1140,159 +1025,13 @@ getGist('https://gist.githubusercontent.com/${
             line-height: 24px;
         }
     }
-    .code-input-controls {
-        margin-top: 50px;
-        margin-bottom: 30px;
-        .buttons {
-            display: flex;
-        }
-        .button {
-            height: 50px;
-        }
-    }
-    .gist-message {
-        height: 100%;
-        display: flex;
-        align-items: center;
-        padding: 1rem;
-        border-bottom: 2px solid white;
-        color: var(--color-clay);
-        background-color: #282c34;
-        box-shadow: 12px 12px 0 0 #fff;
-    }
-    .gist-message + .editor-wrapper:before {
-        content: "";
-        position: absolute;
-        inset: 0;
-        background-color: rgb(255, 255, 255, 0.1);
-        z-index: 1;
-        pointer-events: none;
-    }
-    .editor-wrapper {
-        min-height: 230px;
-        position: relative;
-        z-index: 1;
-        box-shadow: 12px 12px 0 0 #fff;
-        background-color: #282c34;
-    }
-    // :global(.codemirror-wrapper) {
-    //     box-shadow: 12px 12px 0 0 #fff;
-    // }
-    :global(.cm-scroller) {
-        min-height: 200px;
-    }
-    .external-files {
-        display: flex;
-    }
-    .editor-drawer {
-        padding: 1rem;
-        box-shadow: 12px 12px 0 0 #fff;
-        position: relative;
-        z-index: 2;
-    }
-    .error-message {
-        height: 100%;
-        display: flex;
-        align-items: center;
-        color: var(--color-dark-red);
-        background-color: pink;
-    }
-    .drawer-options {
-        background-color: var(--color-turquoise);
-    }
-    .code-output-controls {
-        display: flex;
-        flex-wrap: wrap;
-        position: relative;
-    }
-    .inline-field-group {
-        display: flex;
-        align-items: center;
-        margin-left: auto;
-        order: 2;
-        #name {
-            min-width: 167px;
-        }
-    }
+
 
     :global(.button.button-toggle-code) {
         margin-left: 0;
         margin-right: 20px;
     }
-    .output-code-fields {
-        width: calc(100% - 415px);
-        margin: 0;
-        position: absolute;
-        left: 0;
-        max-width: 415px;
-        bottom: 0;
-    }
-    #output {
-        width: 100%;
-        padding: 10px;
-        border: 2px solid var(--color-black);
-        border-radius: 0.25rem;
-        display: flex;
-        margin-top: 20px;
-        align-self: center;
-        order: 3;
-        padding-right: 65px;
-    }
-    .button-reset {
-        &:hover {
-            background-color: var(--color-pink);
-        }
-    }
-    .button-upload {
-        margin-left: auto;
-    }
-    .button-upload,
-    .button-download {
-        display: flex;
-        align-items: center;
-    }
-    .button-download img {
-        transform: rotate(180deg);
-    }
-    .button.button-bookmarklet {
-        margin-bottom: 30px;
-        background-color: #f78da7;
-        line-height: 20px;
-    }
-    .button-toggle-code {
-        height: 50px;
-    }
-    .button-run-code {
-        height: 50px;
-        line-height: 17px;
-        &.desktop-only {
-            margin-right: 20px;
-        }
-    }
-    .button-copy {
-        position: absolute;
-        cursor: pointer;
-        right: 0;
-        color: var(--color-black);
-        height: 38.5px;
-        top: 20px;
-        padding-inline: 10px;
-        border-top-left-radius: 0;
-        border-bottom-left-radius: 0;
-        border: 2px solid var(--color-black);
-        border-top-right-radius: 0.25rem;
-        border-bottom-right-radius: 0.25rem;
-        background-color: var(--color-clay);
-        transition: var(--global-transition);
-        &:hover {
-            background-color: var(--color-turquoise);
-        }
-    }
-    .group-bookmarklet-output {
-        display: flex;
-        flex-direction: column;
-        margin-left: auto;
-    }
+
     .faq-section {
         h2 {
             text-align: center;
diff --git a/src/routes/bookmarklets/[slug].svelte/+page.svelte b/src/routes/bookmarklets/[slug].svelte/+page.svelte
deleted file mode 100644
index 9cc2d5e..0000000
--- a/src/routes/bookmarklets/[slug].svelte/+page.svelte
+++ /dev/null
@@ -1,10 +0,0 @@
-<script context="module">
-    import { page } from "$app/stores";
-
-    // export function load({ fetch, page }) {
-    //     const res = await(fetch(`../bookmarklets.json`));
-    // }
-    // const slug = $page.params.slug;
-</script>
-
-<h1>{$page.params.slug}</h1>
diff --git a/src/routes/bookmarklets/[slug].svelte/+page.ts b/src/routes/bookmarklets/[slug].svelte/+page.ts
deleted file mode 100644
index 63e9836..0000000
--- a/src/routes/bookmarklets/[slug].svelte/+page.ts
+++ /dev/null
@@ -1,23 +0,0 @@
-// import { error } from '@sveltejs/kit';
-
-// /** @type {import('./$types').PageLoad} */
-// export function load({ params }) {
-// 	if (params.slug === 'bookmarklets/hello-world') {
-// 		return {
-// 			title: 'Hello world!',
-// 			content: 'Welcome to our blog. Lorem ipsum dolor sit amet...'
-// 		};
-// 	}
-
-// 	error(404, 'Not found');
-// }
-
-// export const prerender = true;
-
-export const prerender = true;
-
-/** @type {import('./$types').PageLoad} */
-export async function load({ fetch }) {
-	const res = await fetch('../bookmarklets.json');
-	return await res.json();
-}
\ No newline at end of file
diff --git a/src/routes/bookmarklets/[slug]/+page.svelte b/src/routes/bookmarklets/[slug]/+page.svelte
new file mode 100644
index 0000000..0352009
--- /dev/null
+++ b/src/routes/bookmarklets/[slug]/+page.svelte
@@ -0,0 +1,27 @@
+<script>
+    import Hero from "$lib/components/hero.svelte";
+    import CodeEditor from "$lib/components/editors/js-editor.svelte";
+
+    export let data;
+    export let codeEditor;
+
+    let codeInput = codeEditor;
+    //if (codeInput === "") {codeInput = data.code}
+    $: codeInput = codeInput;
+    console.log('on page codeInput', codeInput);
+</script>
+
+<Hero>
+    <span slot="light">{data.title}</span>
+    <ul slot="features">
+        <li>{data.copy}</li>
+    </ul>
+</Hero>
+
+<div class="section code-editor" id="editor">
+    <div class="container-small">
+        <div class="editor-wrapper">
+            <CodeEditor bind:codeEditor={codeInput} />
+        </div>
+    </div>
+</div>
diff --git a/src/routes/bookmarklets/[slug]/+page.ts b/src/routes/bookmarklets/[slug]/+page.ts
new file mode 100644
index 0000000..5c0cacb
--- /dev/null
+++ b/src/routes/bookmarklets/[slug]/+page.ts
@@ -0,0 +1,59 @@
+import { error } from '@sveltejs/kit';
+export const prerender = true;
+
+export function load({ params }) {
+	if (params.slug === 'color-picker') {
+		return {
+			title: 'Color Picker',
+			copy: 'Build and customize a responsive breakpoint bookmarklet',
+			code: `   document.cE = document.createElement;
+			var s = [], div = document.cE('div');
+			var text = document.cE('input');
+			var col = [0, 0, 0];
+			var aE = "attachEvent", oc = "onchange", ok = "onkeyup";
+			var uB  = function() {
+				var c = text.value.match(/\w\w?/g), n, i;
+				for(i in c) {
+					s[i].value = col[i] = parseInt(c[i], 16) || 0;
+				}
+				div.style.backgroundColor = text.value;
+			}
+			var uC = function(c, val) {
+				col[c] = parseInt(val, 10);
+				text.value = '#';
+				for(var i in col) {
+					n = col[i];
+					var v = ((n < 16) ? '0' : '') + n.toString(16).toUpperCase();
+					text.value += v;
+				}
+				div.style.backgroundColor = text.value;
+			}
+			if(!(text.attachEvent)) { aE = "addEventListener"; oc  = "change"; ok = "keyup" }
+			text.size = 7;
+			text[aE](ok, uB);
+			div.appendChild(text);
+			div.appendChild(document.cE('br'));
+			with(div.style) {
+				position = 'fixed';
+				padding = top = left = '5px';
+				boxShadow = '0 0 5px black';
+				backgroundColor = '#000';
+			}
+			for(var c in ['r','g','b']) { 
+				s[c] = document.cE('input'); 
+				s[c].type = 'range'; 
+				s[c].value = 0;
+				s[c].min = 0; 
+				s[c].max = 255; 
+				s[c].step = 1;
+				s[c][aE](oc, (function() { var col = c; return function() { uC(col, this.value); }})()); 
+				div.appendChild(s[c]); 
+				div.appendChild(document.cE('br'));
+			} 
+			
+			document.body.appendChild(div);`,
+		};
+	}
+
+	error(404, 'Not found');
+}
\ No newline at end of file
diff --git a/tests/test.ts b/tests/test.ts
deleted file mode 100644
index 5816be4..0000000
--- a/tests/test.ts
+++ /dev/null
@@ -1,6 +0,0 @@
-import { expect, test } from '@playwright/test';
-
-test('index page has expected h1', async ({ page }) => {
-	await page.goto('/');
-	await expect(page.getByRole('heading', { name: 'Welcome to SvelteKit' })).toBeVisible();
-});
diff --git a/yarn.lock b/yarn.lock
deleted file mode 100644
index 98b6a2e..0000000
--- a/yarn.lock
+++ /dev/null
@@ -1,2185 +0,0 @@
-# THIS IS AN AUTOGENERATED FILE. DO NOT EDIT THIS FILE DIRECTLY.
-# yarn lockfile v1
-
-
-"@aashutoshrathi/word-wrap@^1.2.3":
-  version "1.2.6"
-  resolved "https://registry.yarnpkg.com/@aashutoshrathi/word-wrap/-/word-wrap-1.2.6.tgz#bd9154aec9983f77b3a034ecaa015c2e4201f6cf"
-  integrity sha512-1Yjs2SvM8TflER/OD3cOjhWWOZb58A2t7wpE2S9XfBYTiIl+XFhQG2bjy4Pu1I+EAlCNUzRDYDdFwFYUKvXcIA==
-
-"@ampproject/remapping@^2.2.1":
-  version "2.2.1"
-  resolved "https://registry.yarnpkg.com/@ampproject/remapping/-/remapping-2.2.1.tgz#99e8e11851128b8702cd57c33684f1d0f260b630"
-  integrity sha512-lFMjJTrFL3j7L9yBxwYfCq2k6qqwHyzuUl/XBnif78PWTJYyL/dfowQHWE3sp6U6ZzqWiiIZnpTMO96zhkjwtg==
-  dependencies:
-    "@jridgewell/gen-mapping" "^0.3.0"
-    "@jridgewell/trace-mapping" "^0.3.9"
-
-"@codemirror/autocomplete@^6.0.0":
-  version "6.8.1"
-  resolved "https://registry.yarnpkg.com/@codemirror/autocomplete/-/autocomplete-6.8.1.tgz#3f3daa9f591186901db07f58d17256656242e841"
-  integrity sha512-HpphvDcTdOx+9R3eUw9hZK9JA77jlaBF0kOt2McbyfvY0rX9pnMoO8rkkZc0GzSbzhIY4m5xJ0uHHgjfqHNmXQ==
-  dependencies:
-    "@codemirror/language" "^6.0.0"
-    "@codemirror/state" "^6.0.0"
-    "@codemirror/view" "^6.6.0"
-    "@lezer/common" "^1.0.0"
-
-"@codemirror/commands@^6.0.0":
-  version "6.2.4"
-  resolved "https://registry.yarnpkg.com/@codemirror/commands/-/commands-6.2.4.tgz#b8a0e5ce72448c092ba4c4b1d902e6f183948aec"
-  integrity sha512-42lmDqVH0ttfilLShReLXsDfASKLXzfyC36bzwcqzox9PlHulMcsUOfHXNo2X2aFMVNUoQ7j+d4q5bnfseYoOA==
-  dependencies:
-    "@codemirror/language" "^6.0.0"
-    "@codemirror/state" "^6.2.0"
-    "@codemirror/view" "^6.0.0"
-    "@lezer/common" "^1.0.0"
-
-"@codemirror/lang-javascript@^6.1.4":
-  version "6.1.9"
-  resolved "https://registry.yarnpkg.com/@codemirror/lang-javascript/-/lang-javascript-6.1.9.tgz#19065ad32db7b3797829eca01b8d9c69da5fd0d6"
-  integrity sha512-z3jdkcqOEBT2txn2a87A0jSy6Te3679wg/U8QzMeftFt+4KA6QooMwfdFzJiuC3L6fXKfTXZcDocoaxMYfGz0w==
-  dependencies:
-    "@codemirror/autocomplete" "^6.0.0"
-    "@codemirror/language" "^6.6.0"
-    "@codemirror/lint" "^6.0.0"
-    "@codemirror/state" "^6.0.0"
-    "@codemirror/view" "^6.0.0"
-    "@lezer/common" "^1.0.0"
-    "@lezer/javascript" "^1.0.0"
-
-"@codemirror/language@^6.0.0", "@codemirror/language@^6.6.0":
-  version "6.8.0"
-  resolved "https://registry.yarnpkg.com/@codemirror/language/-/language-6.8.0.tgz#f2d7eea6b338c25593d800f2293b062d9f9856db"
-  integrity sha512-r1paAyWOZkfY0RaYEZj3Kul+MiQTEbDvYqf8gPGaRvNneHXCmfSaAVFjwRUPlgxS8yflMxw2CTu6uCMp8R8A2g==
-  dependencies:
-    "@codemirror/state" "^6.0.0"
-    "@codemirror/view" "^6.0.0"
-    "@lezer/common" "^1.0.0"
-    "@lezer/highlight" "^1.0.0"
-    "@lezer/lr" "^1.0.0"
-    style-mod "^4.0.0"
-
-"@codemirror/lint@^6.0.0", "@codemirror/lint@^6.1.0":
-  version "6.3.0"
-  resolved "https://registry.yarnpkg.com/@codemirror/lint/-/lint-6.3.0.tgz#bd36fb85094cf5735e5426e48f1a8e575a7b70df"
-  integrity sha512-tzxOVQNoDhhwFNfcTO2IB74wQoWarARcH6gv3YufPpiJ9yhcb7zD6JCkO5+FWARskqRFc8GFa6E+wUyOvADl5A==
-  dependencies:
-    "@codemirror/state" "^6.0.0"
-    "@codemirror/view" "^6.0.0"
-    crelt "^1.0.5"
-
-"@codemirror/search@^6.0.0":
-  version "6.5.0"
-  resolved "https://registry.yarnpkg.com/@codemirror/search/-/search-6.5.0.tgz#308f9968434e0e6ed59c9ec36a0239eb1dfc5d92"
-  integrity sha512-64/M40YeJPToKvGO6p3fijo2vwUEj4nACEAXElCaYQ50HrXSvRaK+NHEhSh73WFBGdvIdhrV+lL9PdJy2RfCYA==
-  dependencies:
-    "@codemirror/state" "^6.0.0"
-    "@codemirror/view" "^6.0.0"
-    crelt "^1.0.5"
-
-"@codemirror/state@^6.0.0", "@codemirror/state@^6.1.4", "@codemirror/state@^6.2.0":
-  version "6.2.1"
-  resolved "https://registry.yarnpkg.com/@codemirror/state/-/state-6.2.1.tgz#6dc8d8e5abb26b875e3164191872d69a5e85bd73"
-  integrity sha512-RupHSZ8+OjNT38zU9fKH2sv+Dnlr8Eb8sl4NOnnqz95mCFTZUaiRP8Xv5MeeaG0px2b8Bnfe7YGwCV3nsBhbuw==
-
-"@codemirror/theme-one-dark@^6.1.0":
-  version "6.1.2"
-  resolved "https://registry.yarnpkg.com/@codemirror/theme-one-dark/-/theme-one-dark-6.1.2.tgz#fcef9f9cfc17a07836cb7da17c9f6d7231064df8"
-  integrity sha512-F+sH0X16j/qFLMAfbciKTxVOwkdAS336b7AXTKOZhy8BR3eH/RelsnLgLFINrpST63mmN2OuwUt0W2ndUgYwUA==
-  dependencies:
-    "@codemirror/language" "^6.0.0"
-    "@codemirror/state" "^6.0.0"
-    "@codemirror/view" "^6.0.0"
-    "@lezer/highlight" "^1.0.0"
-
-"@codemirror/view@^6.0.0", "@codemirror/view@^6.6.0":
-  version "6.14.0"
-  resolved "https://registry.yarnpkg.com/@codemirror/view/-/view-6.14.0.tgz#a8ecb0216d6f81aeb20bf8b0cbbc7ed563cf0777"
-  integrity sha512-I263FPs4In42MNmrdwN2DfmYPFMVMXgT7o/mxdGp4jv5LPs8i0FOxzmxF5yeeQdYSTztb2ZhmPIu0ahveInVTg==
-  dependencies:
-    "@codemirror/state" "^6.1.4"
-    style-mod "^4.0.0"
-    w3c-keyname "^2.2.4"
-
-"@esbuild/android-arm64@0.17.19":
-  version "0.17.19"
-  resolved "https://registry.yarnpkg.com/@esbuild/android-arm64/-/android-arm64-0.17.19.tgz#bafb75234a5d3d1b690e7c2956a599345e84a2fd"
-  integrity sha512-KBMWvEZooR7+kzY0BtbTQn0OAYY7CsiydT63pVEaPtVYF0hXbUaOyZog37DKxK7NF3XacBJOpYT4adIJh+avxA==
-
-"@esbuild/android-arm@0.17.19":
-  version "0.17.19"
-  resolved "https://registry.yarnpkg.com/@esbuild/android-arm/-/android-arm-0.17.19.tgz#5898f7832c2298bc7d0ab53701c57beb74d78b4d"
-  integrity sha512-rIKddzqhmav7MSmoFCmDIb6e2W57geRsM94gV2l38fzhXMwq7hZoClug9USI2pFRGL06f4IOPHHpFNOkWieR8A==
-
-"@esbuild/android-x64@0.17.19":
-  version "0.17.19"
-  resolved "https://registry.yarnpkg.com/@esbuild/android-x64/-/android-x64-0.17.19.tgz#658368ef92067866d95fb268719f98f363d13ae1"
-  integrity sha512-uUTTc4xGNDT7YSArp/zbtmbhO0uEEK9/ETW29Wk1thYUJBz3IVnvgEiEwEa9IeLyvnpKrWK64Utw2bgUmDveww==
-
-"@esbuild/darwin-arm64@0.17.19":
-  version "0.17.19"
-  resolved "https://registry.yarnpkg.com/@esbuild/darwin-arm64/-/darwin-arm64-0.17.19.tgz#584c34c5991b95d4d48d333300b1a4e2ff7be276"
-  integrity sha512-80wEoCfF/hFKM6WE1FyBHc9SfUblloAWx6FJkFWTWiCoht9Mc0ARGEM47e67W9rI09YoUxJL68WHfDRYEAvOhg==
-
-"@esbuild/darwin-x64@0.17.19":
-  version "0.17.19"
-  resolved "https://registry.yarnpkg.com/@esbuild/darwin-x64/-/darwin-x64-0.17.19.tgz#7751d236dfe6ce136cce343dce69f52d76b7f6cb"
-  integrity sha512-IJM4JJsLhRYr9xdtLytPLSH9k/oxR3boaUIYiHkAawtwNOXKE8KoU8tMvryogdcT8AU+Bflmh81Xn6Q0vTZbQw==
-
-"@esbuild/freebsd-arm64@0.17.19":
-  version "0.17.19"
-  resolved "https://registry.yarnpkg.com/@esbuild/freebsd-arm64/-/freebsd-arm64-0.17.19.tgz#cacd171665dd1d500f45c167d50c6b7e539d5fd2"
-  integrity sha512-pBwbc7DufluUeGdjSU5Si+P3SoMF5DQ/F/UmTSb8HXO80ZEAJmrykPyzo1IfNbAoaqw48YRpv8shwd1NoI0jcQ==
-
-"@esbuild/freebsd-x64@0.17.19":
-  version "0.17.19"
-  resolved "https://registry.yarnpkg.com/@esbuild/freebsd-x64/-/freebsd-x64-0.17.19.tgz#0769456eee2a08b8d925d7c00b79e861cb3162e4"
-  integrity sha512-4lu+n8Wk0XlajEhbEffdy2xy53dpR06SlzvhGByyg36qJw6Kpfk7cp45DR/62aPH9mtJRmIyrXAS5UWBrJT6TQ==
-
-"@esbuild/linux-arm64@0.17.19":
-  version "0.17.19"
-  resolved "https://registry.yarnpkg.com/@esbuild/linux-arm64/-/linux-arm64-0.17.19.tgz#38e162ecb723862c6be1c27d6389f48960b68edb"
-  integrity sha512-ct1Tg3WGwd3P+oZYqic+YZF4snNl2bsnMKRkb3ozHmnM0dGWuxcPTTntAF6bOP0Sp4x0PjSF+4uHQ1xvxfRKqg==
-
-"@esbuild/linux-arm@0.17.19":
-  version "0.17.19"
-  resolved "https://registry.yarnpkg.com/@esbuild/linux-arm/-/linux-arm-0.17.19.tgz#1a2cd399c50040184a805174a6d89097d9d1559a"
-  integrity sha512-cdmT3KxjlOQ/gZ2cjfrQOtmhG4HJs6hhvm3mWSRDPtZ/lP5oe8FWceS10JaSJC13GBd4eH/haHnqf7hhGNLerA==
-
-"@esbuild/linux-ia32@0.17.19":
-  version "0.17.19"
-  resolved "https://registry.yarnpkg.com/@esbuild/linux-ia32/-/linux-ia32-0.17.19.tgz#e28c25266b036ce1cabca3c30155222841dc035a"
-  integrity sha512-w4IRhSy1VbsNxHRQpeGCHEmibqdTUx61Vc38APcsRbuVgK0OPEnQ0YD39Brymn96mOx48Y2laBQGqgZ0j9w6SQ==
-
-"@esbuild/linux-loong64@0.17.19":
-  version "0.17.19"
-  resolved "https://registry.yarnpkg.com/@esbuild/linux-loong64/-/linux-loong64-0.17.19.tgz#0f887b8bb3f90658d1a0117283e55dbd4c9dcf72"
-  integrity sha512-2iAngUbBPMq439a+z//gE+9WBldoMp1s5GWsUSgqHLzLJ9WoZLZhpwWuym0u0u/4XmZ3gpHmzV84PonE+9IIdQ==
-
-"@esbuild/linux-mips64el@0.17.19":
-  version "0.17.19"
-  resolved "https://registry.yarnpkg.com/@esbuild/linux-mips64el/-/linux-mips64el-0.17.19.tgz#f5d2a0b8047ea9a5d9f592a178ea054053a70289"
-  integrity sha512-LKJltc4LVdMKHsrFe4MGNPp0hqDFA1Wpt3jE1gEyM3nKUvOiO//9PheZZHfYRfYl6AwdTH4aTcXSqBerX0ml4A==
-
-"@esbuild/linux-ppc64@0.17.19":
-  version "0.17.19"
-  resolved "https://registry.yarnpkg.com/@esbuild/linux-ppc64/-/linux-ppc64-0.17.19.tgz#876590e3acbd9fa7f57a2c7d86f83717dbbac8c7"
-  integrity sha512-/c/DGybs95WXNS8y3Ti/ytqETiW7EU44MEKuCAcpPto3YjQbyK3IQVKfF6nbghD7EcLUGl0NbiL5Rt5DMhn5tg==
-
-"@esbuild/linux-riscv64@0.17.19":
-  version "0.17.19"
-  resolved "https://registry.yarnpkg.com/@esbuild/linux-riscv64/-/linux-riscv64-0.17.19.tgz#7f49373df463cd9f41dc34f9b2262d771688bf09"
-  integrity sha512-FC3nUAWhvFoutlhAkgHf8f5HwFWUL6bYdvLc/TTuxKlvLi3+pPzdZiFKSWz/PF30TB1K19SuCxDTI5KcqASJqA==
-
-"@esbuild/linux-s390x@0.17.19":
-  version "0.17.19"
-  resolved "https://registry.yarnpkg.com/@esbuild/linux-s390x/-/linux-s390x-0.17.19.tgz#e2afd1afcaf63afe2c7d9ceacd28ec57c77f8829"
-  integrity sha512-IbFsFbxMWLuKEbH+7sTkKzL6NJmG2vRyy6K7JJo55w+8xDk7RElYn6xvXtDW8HCfoKBFK69f3pgBJSUSQPr+4Q==
-
-"@esbuild/linux-x64@0.17.19":
-  version "0.17.19"
-  resolved "https://registry.yarnpkg.com/@esbuild/linux-x64/-/linux-x64-0.17.19.tgz#8a0e9738b1635f0c53389e515ae83826dec22aa4"
-  integrity sha512-68ngA9lg2H6zkZcyp22tsVt38mlhWde8l3eJLWkyLrp4HwMUr3c1s/M2t7+kHIhvMjglIBrFpncX1SzMckomGw==
-
-"@esbuild/netbsd-x64@0.17.19":
-  version "0.17.19"
-  resolved "https://registry.yarnpkg.com/@esbuild/netbsd-x64/-/netbsd-x64-0.17.19.tgz#c29fb2453c6b7ddef9a35e2c18b37bda1ae5c462"
-  integrity sha512-CwFq42rXCR8TYIjIfpXCbRX0rp1jo6cPIUPSaWwzbVI4aOfX96OXY8M6KNmtPcg7QjYeDmN+DD0Wp3LaBOLf4Q==
-
-"@esbuild/openbsd-x64@0.17.19":
-  version "0.17.19"
-  resolved "https://registry.yarnpkg.com/@esbuild/openbsd-x64/-/openbsd-x64-0.17.19.tgz#95e75a391403cb10297280d524d66ce04c920691"
-  integrity sha512-cnq5brJYrSZ2CF6c35eCmviIN3k3RczmHz8eYaVlNasVqsNY+JKohZU5MKmaOI+KkllCdzOKKdPs762VCPC20g==
-
-"@esbuild/sunos-x64@0.17.19":
-  version "0.17.19"
-  resolved "https://registry.yarnpkg.com/@esbuild/sunos-x64/-/sunos-x64-0.17.19.tgz#722eaf057b83c2575937d3ffe5aeb16540da7273"
-  integrity sha512-vCRT7yP3zX+bKWFeP/zdS6SqdWB8OIpaRq/mbXQxTGHnIxspRtigpkUcDMlSCOejlHowLqII7K2JKevwyRP2rg==
-
-"@esbuild/win32-arm64@0.17.19":
-  version "0.17.19"
-  resolved "https://registry.yarnpkg.com/@esbuild/win32-arm64/-/win32-arm64-0.17.19.tgz#9aa9dc074399288bdcdd283443e9aeb6b9552b6f"
-  integrity sha512-yYx+8jwowUstVdorcMdNlzklLYhPxjniHWFKgRqH7IFlUEa0Umu3KuYplf1HUZZ422e3NU9F4LGb+4O0Kdcaag==
-
-"@esbuild/win32-ia32@0.17.19":
-  version "0.17.19"
-  resolved "https://registry.yarnpkg.com/@esbuild/win32-ia32/-/win32-ia32-0.17.19.tgz#95ad43c62ad62485e210f6299c7b2571e48d2b03"
-  integrity sha512-eggDKanJszUtCdlVs0RB+h35wNlb5v4TWEkq4vZcmVt5u/HiDZrTXe2bWFQUez3RgNHwx/x4sk5++4NSSicKkw==
-
-"@esbuild/win32-x64@0.17.19":
-  version "0.17.19"
-  resolved "https://registry.yarnpkg.com/@esbuild/win32-x64/-/win32-x64-0.17.19.tgz#8cfaf2ff603e9aabb910e9c0558c26cf32744061"
-  integrity sha512-lAhycmKnVOuRYNtRtatQR1LPQf2oYCkRGkSFnseDAKPl8lu5SOsK/e1sXe5a0Pc5kHIHe6P2I/ilntNv2xf3cA==
-
-"@eslint-community/eslint-utils@^4.2.0":
-  version "4.4.0"
-  resolved "https://registry.yarnpkg.com/@eslint-community/eslint-utils/-/eslint-utils-4.4.0.tgz#a23514e8fb9af1269d5f7788aa556798d61c6b59"
-  integrity sha512-1/sA4dwrzBAyeUoQ6oxahHKmrZvsnLCg4RfxW3ZFGGmQkSNQPFNLV9CUEFQP1x9EYXHTo5p6xdhZM1Ne9p/AfA==
-  dependencies:
-    eslint-visitor-keys "^3.3.0"
-
-"@eslint-community/regexpp@^4.4.0":
-  version "4.5.1"
-  resolved "https://registry.yarnpkg.com/@eslint-community/regexpp/-/regexpp-4.5.1.tgz#cdd35dce4fa1a89a4fd42b1599eb35b3af408884"
-  integrity sha512-Z5ba73P98O1KUYCCJTUeVpja9RcGoMdncZ6T49FCUl2lN38JtCJ+3WgIDBv0AuY4WChU5PmtJmOCTlN6FZTFKQ==
-
-"@eslint/eslintrc@^2.0.3":
-  version "2.0.3"
-  resolved "https://registry.yarnpkg.com/@eslint/eslintrc/-/eslintrc-2.0.3.tgz#4910db5505f4d503f27774bf356e3704818a0331"
-  integrity sha512-+5gy6OQfk+xx3q0d6jGZZC3f3KzAkXc/IanVxd1is/VIIziRqqt3ongQz0FiTUXqTk0c7aDB3OaFuKnuSoJicQ==
-  dependencies:
-    ajv "^6.12.4"
-    debug "^4.3.2"
-    espree "^9.5.2"
-    globals "^13.19.0"
-    ignore "^5.2.0"
-    import-fresh "^3.2.1"
-    js-yaml "^4.1.0"
-    minimatch "^3.1.2"
-    strip-json-comments "^3.1.1"
-
-"@eslint/js@8.43.0":
-  version "8.43.0"
-  resolved "https://registry.yarnpkg.com/@eslint/js/-/js-8.43.0.tgz#559ca3d9ddbd6bf907ad524320a0d14b85586af0"
-  integrity sha512-s2UHCoiXfxMvmfzqoN+vrQ84ahUSYde9qNO1MdxmoEhyHWsfmwOpFlwYV+ePJEVc7gFnATGUi376WowX1N7tFg==
-
-"@humanwhocodes/config-array@^0.11.10":
-  version "0.11.10"
-  resolved "https://registry.yarnpkg.com/@humanwhocodes/config-array/-/config-array-0.11.10.tgz#5a3ffe32cc9306365fb3fd572596cd602d5e12d2"
-  integrity sha512-KVVjQmNUepDVGXNuoRRdmmEjruj0KfiGSbS8LVc12LMsWDQzRXJ0qdhN8L8uUigKpfEHRhlaQFY0ib1tnUbNeQ==
-  dependencies:
-    "@humanwhocodes/object-schema" "^1.2.1"
-    debug "^4.1.1"
-    minimatch "^3.0.5"
-
-"@humanwhocodes/module-importer@^1.0.1":
-  version "1.0.1"
-  resolved "https://registry.yarnpkg.com/@humanwhocodes/module-importer/-/module-importer-1.0.1.tgz#af5b2691a22b44be847b0ca81641c5fb6ad0172c"
-  integrity sha512-bxveV4V8v5Yb4ncFTT3rPSgZBOpCkjfK0y4oVVVJwIuDVBRMDXrPyXRL988i5ap9m9bnyEEjWfm5WkBmtffLfA==
-
-"@humanwhocodes/object-schema@^1.2.1":
-  version "1.2.1"
-  resolved "https://registry.yarnpkg.com/@humanwhocodes/object-schema/-/object-schema-1.2.1.tgz#b520529ec21d8e5945a1851dfd1c32e94e39ff45"
-  integrity sha512-ZnQMnLV4e7hDlUvw8H+U8ASL02SS2Gn6+9Ac3wGGLIe7+je2AeAOxPY+izIPJDfFDb7eDjev0Us8MO1iFRN8hA==
-
-"@jridgewell/gen-mapping@^0.3.0":
-  version "0.3.3"
-  resolved "https://registry.yarnpkg.com/@jridgewell/gen-mapping/-/gen-mapping-0.3.3.tgz#7e02e6eb5df901aaedb08514203b096614024098"
-  integrity sha512-HLhSWOLRi875zjjMG/r+Nv0oCW8umGb0BgEhyX3dDX3egwZtB8PqLnjz3yedt8R5StBrzcg4aBpnh8UA9D1BoQ==
-  dependencies:
-    "@jridgewell/set-array" "^1.0.1"
-    "@jridgewell/sourcemap-codec" "^1.4.10"
-    "@jridgewell/trace-mapping" "^0.3.9"
-
-"@jridgewell/resolve-uri@3.1.0":
-  version "3.1.0"
-  resolved "https://registry.yarnpkg.com/@jridgewell/resolve-uri/-/resolve-uri-3.1.0.tgz#2203b118c157721addfe69d47b70465463066d78"
-  integrity sha512-F2msla3tad+Mfht5cJq7LSXcdudKTWCVYUgw6pLFOOHSTtZlj6SWNYAp+AhuqLmWdBO2X5hPrLcu8cVP8fy28w==
-
-"@jridgewell/set-array@^1.0.1":
-  version "1.1.2"
-  resolved "https://registry.yarnpkg.com/@jridgewell/set-array/-/set-array-1.1.2.tgz#7c6cf998d6d20b914c0a55a91ae928ff25965e72"
-  integrity sha512-xnkseuNADM0gt2bs+BvhO0p78Mk762YnZdsuzFV018NoG1Sj1SCQvpSqa7XUaTam5vAGasABV9qXASMKnFMwMw==
-
-"@jridgewell/source-map@^0.3.3":
-  version "0.3.4"
-  resolved "https://registry.yarnpkg.com/@jridgewell/source-map/-/source-map-0.3.4.tgz#856a142864530d4059dda415659b48d37db2d556"
-  integrity sha512-KE/SxsDqNs3rrWwFHcRh15ZLVFrI0YoZtgAdIyIq9k5hUNmiWRXXThPomIxHuL20sLdgzbDFyvkUMna14bvtrw==
-
-"@jridgewell/sourcemap-codec@1.4.14":
-  version "1.4.14"
-  resolved "https://registry.yarnpkg.com/@jridgewell/sourcemap-codec/-/sourcemap-codec-1.4.14.tgz#add4c98d341472a289190b424efbdb096991bb24"
-  integrity sha512-XPSJHWmi394fuUuzDnGz1wiKqWfo1yXecHQMRf2l6hztTO+nPru658AyDngaBe7isIxEkRsPR3FZh+s7iVa4Uw==
-
-"@jridgewell/sourcemap-codec@^1.4.10", "@jridgewell/sourcemap-codec@^1.4.13", "@jridgewell/sourcemap-codec@^1.4.14", "@jridgewell/sourcemap-codec@^1.4.15":
-  version "1.4.15"
-  resolved "https://registry.yarnpkg.com/@jridgewell/sourcemap-codec/-/sourcemap-codec-1.4.15.tgz#d7c6e6755c78567a951e04ab52ef0fd26de59f32"
-  integrity sha512-eF2rxCRulEKXHTRiDrDy6erMYWqNw4LPdQ8UQA4huuxaQsVeRPFl2oM8oDGxMFhJUWZf9McpLtJasDDZb/Bpeg==
-
-"@jridgewell/trace-mapping@^0.3.17", "@jridgewell/trace-mapping@^0.3.18", "@jridgewell/trace-mapping@^0.3.9":
-  version "0.3.18"
-  resolved "https://registry.yarnpkg.com/@jridgewell/trace-mapping/-/trace-mapping-0.3.18.tgz#25783b2086daf6ff1dcb53c9249ae480e4dd4cd6"
-  integrity sha512-w+niJYzMHdd7USdiH2U6869nqhD2nbfZXND5Yp93qIbEmnDNk7PD48o+YchRVpzMU7M6jVCbenTR7PA1FLQ9pA==
-  dependencies:
-    "@jridgewell/resolve-uri" "3.1.0"
-    "@jridgewell/sourcemap-codec" "1.4.14"
-
-"@lezer/common@^1.0.0":
-  version "1.0.3"
-  resolved "https://registry.yarnpkg.com/@lezer/common/-/common-1.0.3.tgz#1808f70e2b0a7b1fdcbaf5c074723d2d4ed1e4c5"
-  integrity sha512-JH4wAXCgUOcCGNekQPLhVeUtIqjH0yPBs7vvUdSjyQama9618IOKFJwkv2kcqdhF0my8hQEgCTEJU0GIgnahvA==
-
-"@lezer/highlight@^1.0.0", "@lezer/highlight@^1.1.3":
-  version "1.1.6"
-  resolved "https://registry.yarnpkg.com/@lezer/highlight/-/highlight-1.1.6.tgz#87e56468c0f43c2a8b3dc7f0b7c2804b34901556"
-  integrity sha512-cmSJYa2us+r3SePpRCjN5ymCqCPv+zyXmDl0ciWtVaNiORT/MxM7ZgOMQZADD0o51qOaOg24qc/zBViOIwAjJg==
-  dependencies:
-    "@lezer/common" "^1.0.0"
-
-"@lezer/javascript@^1.0.0":
-  version "1.4.3"
-  resolved "https://registry.yarnpkg.com/@lezer/javascript/-/javascript-1.4.3.tgz#f59e764a0578184c6fb86abb5279a9679777c3ba"
-  integrity sha512-k7Eo9z9B1supZ5cCD4ilQv/RZVN30eUQL+gGbr6ybrEY3avBAL5MDiYi2aa23Aj0A79ry4rJRvPAwE2TM8bd+A==
-  dependencies:
-    "@lezer/highlight" "^1.1.3"
-    "@lezer/lr" "^1.3.0"
-
-"@lezer/lr@^1.0.0", "@lezer/lr@^1.3.0":
-  version "1.3.7"
-  resolved "https://registry.yarnpkg.com/@lezer/lr/-/lr-1.3.7.tgz#e3012c74512a063098eb9da86d4cc689170e1f92"
-  integrity sha512-ssHKb3p0MxhJXT2i7UBmgAY1BIM3Uq/D772Qutu3EVmxWIyNMU12nQ0rL3Fhu+MiFtiTzyTmd3xGwEf3ON5PSA==
-  dependencies:
-    "@lezer/common" "^1.0.0"
-
-"@nodelib/fs.scandir@2.1.5":
-  version "2.1.5"
-  resolved "https://registry.yarnpkg.com/@nodelib/fs.scandir/-/fs.scandir-2.1.5.tgz#7619c2eb21b25483f6d167548b4cfd5a7488c3d5"
-  integrity sha512-vq24Bq3ym5HEQm2NKCr3yXDwjc7vTsEThRDnkp2DK9p1uqLR+DHurm/NOTo0KG7HYHU7eppKZj3MyqYuMBf62g==
-  dependencies:
-    "@nodelib/fs.stat" "2.0.5"
-    run-parallel "^1.1.9"
-
-"@nodelib/fs.stat@2.0.5", "@nodelib/fs.stat@^2.0.2":
-  version "2.0.5"
-  resolved "https://registry.yarnpkg.com/@nodelib/fs.stat/-/fs.stat-2.0.5.tgz#5bd262af94e9d25bd1e71b05deed44876a222e8b"
-  integrity sha512-RkhPPp2zrqDAQA/2jNhnztcPAlv64XdhIp7a7454A5ovI7Bukxgt7MX7udwAu3zg1DcpPU0rz3VV1SeaqvY4+A==
-
-"@nodelib/fs.walk@^1.2.3", "@nodelib/fs.walk@^1.2.8":
-  version "1.2.8"
-  resolved "https://registry.yarnpkg.com/@nodelib/fs.walk/-/fs.walk-1.2.8.tgz#e95737e8bb6746ddedf69c556953494f196fe69a"
-  integrity sha512-oGB+UxlgWcgQkgwo8GcEGwemoTFt3FIO9ababBmaGwXIoBKZ+GTy0pP185beGg7Llih/NSHSV2XAs1lnznocSg==
-  dependencies:
-    "@nodelib/fs.scandir" "2.1.5"
-    fastq "^1.6.0"
-
-"@oozcitak/dom@1.15.10":
-  version "1.15.10"
-  resolved "https://registry.yarnpkg.com/@oozcitak/dom/-/dom-1.15.10.tgz#dca7289f2b292cff2a901ea4fbbcc0a1ab0b05c2"
-  integrity sha512-0JT29/LaxVgRcGKvHmSrUTEvZ8BXvZhGl2LASRUgHqDTC1M5g1pLmVv56IYNyt3bG2CUjDkc67wnyZC14pbQrQ==
-  dependencies:
-    "@oozcitak/infra" "1.0.8"
-    "@oozcitak/url" "1.0.4"
-    "@oozcitak/util" "8.3.8"
-
-"@oozcitak/infra@1.0.8":
-  version "1.0.8"
-  resolved "https://registry.yarnpkg.com/@oozcitak/infra/-/infra-1.0.8.tgz#b0b089421f7d0f6878687608301fbaba837a7d17"
-  integrity sha512-JRAUc9VR6IGHOL7OGF+yrvs0LO8SlqGnPAMqyzOuFZPSZSXI7Xf2O9+awQPSMXgIWGtgUf/dA6Hs6X6ySEaWTg==
-  dependencies:
-    "@oozcitak/util" "8.3.8"
-
-"@oozcitak/url@1.0.4":
-  version "1.0.4"
-  resolved "https://registry.yarnpkg.com/@oozcitak/url/-/url-1.0.4.tgz#ca8b1c876319cf5a648dfa1123600a6aa5cda6ba"
-  integrity sha512-kDcD8y+y3FCSOvnBI6HJgl00viO/nGbQoCINmQ0h98OhnGITrWR3bOGfwYCthgcrV8AnTJz8MzslTQbC3SOAmw==
-  dependencies:
-    "@oozcitak/infra" "1.0.8"
-    "@oozcitak/util" "8.3.8"
-
-"@oozcitak/util@8.3.8":
-  version "8.3.8"
-  resolved "https://registry.yarnpkg.com/@oozcitak/util/-/util-8.3.8.tgz#10f65fe1891fd8cde4957360835e78fd1936bfdd"
-  integrity sha512-T8TbSnGsxo6TDBJx/Sgv/BlVJL3tshxZP7Aq5R1mSnM5OcHY2dQaxLMu2+E8u3gN0MLOzdjurqN4ZRVuzQycOQ==
-
-"@playwright/test@^1.28.1":
-  version "1.35.1"
-  resolved "https://registry.yarnpkg.com/@playwright/test/-/test-1.35.1.tgz#a596b61e15b980716696f149cc7a2002f003580c"
-  integrity sha512-b5YoFe6J9exsMYg0pQAobNDR85T1nLumUYgUTtKm4d21iX2L7WqKq9dW8NGJ+2vX0etZd+Y7UeuqsxDXm9+5ZA==
-  dependencies:
-    "@types/node" "*"
-    playwright-core "1.35.1"
-  optionalDependencies:
-    fsevents "2.3.2"
-
-"@polka/url@^1.0.0-next.20":
-  version "1.0.0-next.21"
-  resolved "https://registry.yarnpkg.com/@polka/url/-/url-1.0.0-next.21.tgz#5de5a2385a35309427f6011992b544514d559aa1"
-  integrity sha512-a5Sab1C4/icpTZVzZc5Ghpz88yQtGOyNqYXcZgOssB2uuAr+wF/MvN6bgtW32q7HHrvBki+BsZ0OuNv6EV3K9g==
-
-"@sveltejs/adapter-static@^2.0.1":
-  version "2.0.2"
-  resolved "https://registry.yarnpkg.com/@sveltejs/adapter-static/-/adapter-static-2.0.2.tgz#49afd27787fb73d789017d002a91031088494139"
-  integrity sha512-9wYtf6s6ew7DHUHMrt55YpD1FgV7oWql2IGsW5BXquLxqcY9vjrqCFo0TzzDpo+ZPZkW/v77k0eOP6tsAb8HmQ==
-
-"@sveltejs/kit@^1.5.0":
-  version "1.21.0"
-  resolved "https://registry.yarnpkg.com/@sveltejs/kit/-/kit-1.21.0.tgz#88f73710b2aa4cebc2ecd2cc78ee3752dc68db5c"
-  integrity sha512-CBsYoI34SjtOQp0eG85dmVnvTR3Pjs8VgAQhO0CgQja9BIorKl808F1X8EunPhCcyek5r5lKQE1Mmbi0RuzHqA==
-  dependencies:
-    "@sveltejs/vite-plugin-svelte" "^2.4.1"
-    "@types/cookie" "^0.5.1"
-    cookie "^0.5.0"
-    devalue "^4.3.1"
-    esm-env "^1.0.0"
-    kleur "^4.1.5"
-    magic-string "^0.30.0"
-    mime "^3.0.0"
-    sade "^1.8.1"
-    set-cookie-parser "^2.6.0"
-    sirv "^2.0.2"
-    undici "~5.22.0"
-
-"@sveltejs/vite-plugin-svelte-inspector@^1.0.3":
-  version "1.0.3"
-  resolved "https://registry.yarnpkg.com/@sveltejs/vite-plugin-svelte-inspector/-/vite-plugin-svelte-inspector-1.0.3.tgz#fdbf80b43bfaa20deaa5ff6d0676351aa9aecbcc"
-  integrity sha512-Khdl5jmmPN6SUsVuqSXatKpQTMIifoQPDanaxC84m9JxIibWvSABJyHpyys0Z+1yYrxY5TTEQm+6elh0XCMaOA==
-  dependencies:
-    debug "^4.3.4"
-
-"@sveltejs/vite-plugin-svelte@^2.4.1":
-  version "2.4.2"
-  resolved "https://registry.yarnpkg.com/@sveltejs/vite-plugin-svelte/-/vite-plugin-svelte-2.4.2.tgz#04f9fb698853a6a681a2a7d32016487316c30917"
-  integrity sha512-ePfcC48ftMKhkT0OFGdOyycYKnnkT6i/buzey+vHRTR/JpQvuPzzhf1PtKqCDQfJRgoPSN2vscXs6gLigx/zGw==
-  dependencies:
-    "@sveltejs/vite-plugin-svelte-inspector" "^1.0.3"
-    debug "^4.3.4"
-    deepmerge "^4.3.1"
-    kleur "^4.1.5"
-    magic-string "^0.30.0"
-    svelte-hmr "^0.15.2"
-    vitefu "^0.2.4"
-
-"@types/chai-subset@^1.3.3":
-  version "1.3.3"
-  resolved "https://registry.yarnpkg.com/@types/chai-subset/-/chai-subset-1.3.3.tgz#97893814e92abd2c534de422cb377e0e0bdaac94"
-  integrity sha512-frBecisrNGz+F4T6bcc+NLeolfiojh5FxW2klu669+8BARtyQv2C/GkNW6FUodVe4BroGMP/wER/YDGc7rEllw==
-  dependencies:
-    "@types/chai" "*"
-
-"@types/chai@*", "@types/chai@^4.3.5":
-  version "4.3.5"
-  resolved "https://registry.yarnpkg.com/@types/chai/-/chai-4.3.5.tgz#ae69bcbb1bebb68c4ac0b11e9d8ed04526b3562b"
-  integrity sha512-mEo1sAde+UCE6b2hxn332f1g1E8WfYRu6p5SvTKr2ZKC1f7gFJXk4h5PyGP9Dt6gCaG8y8XhwnXWC6Iy2cmBng==
-
-"@types/cookie@^0.5.1":
-  version "0.5.1"
-  resolved "https://registry.yarnpkg.com/@types/cookie/-/cookie-0.5.1.tgz#b29aa1f91a59f35e29ff8f7cb24faf1a3a750554"
-  integrity sha512-COUnqfB2+ckwXXSFInsFdOAWQzCCx+a5hq2ruyj+Vjund94RJQd4LG2u9hnvJrTgunKAaax7ancBYlDrNYxA0g==
-
-"@types/estree@*", "@types/estree@^1.0.0":
-  version "1.0.1"
-  resolved "https://registry.yarnpkg.com/@types/estree/-/estree-1.0.1.tgz#aa22750962f3bf0e79d753d3cc067f010c95f194"
-  integrity sha512-LG4opVs2ANWZ1TJoKc937iMmNstM/d0ae1vNbnBvBhqCSezgVUOzcLCqbI5elV8Vy6WKwKjaqR+zO9VKirBBCA==
-
-"@types/json-schema@^7.0.9":
-  version "7.0.12"
-  resolved "https://registry.yarnpkg.com/@types/json-schema/-/json-schema-7.0.12.tgz#d70faba7039d5fca54c83c7dbab41051d2b6f6cb"
-  integrity sha512-Hr5Jfhc9eYOQNPYO5WLDq/n4jqijdHNlDXjuAQkkt+mWdQR+XJToOHrsD4cPaMXpn6KO7y2+wM8AZEs8VpBLVA==
-
-"@types/node@*":
-  version "20.3.2"
-  resolved "https://registry.yarnpkg.com/@types/node/-/node-20.3.2.tgz#fa6a90f2600e052a03c18b8cb3fd83dd4e599898"
-  integrity sha512-vOBLVQeCQfIcF/2Y7eKFTqrMnizK5lRNQ7ykML/5RuwVXVWxYkgwS7xbt4B6fKCUPgbSL5FSsjHQpaGQP/dQmw==
-
-"@types/pug@^2.0.6":
-  version "2.0.6"
-  resolved "https://registry.yarnpkg.com/@types/pug/-/pug-2.0.6.tgz#f830323c88172e66826d0bde413498b61054b5a6"
-  integrity sha512-SnHmG9wN1UVmagJOnyo/qkk0Z7gejYxOYYmaAwr5u2yFYfsupN3sg10kyzN8Hep/2zbHxCnsumxOoRIRMBwKCg==
-
-"@types/semver@^7.3.12":
-  version "7.5.0"
-  resolved "https://registry.yarnpkg.com/@types/semver/-/semver-7.5.0.tgz#591c1ce3a702c45ee15f47a42ade72c2fd78978a"
-  integrity sha512-G8hZ6XJiHnuhQKR7ZmysCeJWE08o8T0AXtk5darsCaTVsYZhhgUrq53jizaR2FvsoeCwJhlmwTjkXBY5Pn/ZHw==
-
-"@types/uglify-js@^3.17.1":
-  version "3.17.1"
-  resolved "https://registry.yarnpkg.com/@types/uglify-js/-/uglify-js-3.17.1.tgz#e0ffcef756476410e5bce2cb01384ed878a195b5"
-  integrity sha512-GkewRA4i5oXacU/n4MA9+bLgt5/L3F1mKrYvFGm7r2ouLXhRKjuWwo9XHNnbx6WF3vlGW21S3fCvgqxvxXXc5g==
-  dependencies:
-    source-map "^0.6.1"
-
-"@typescript-eslint/eslint-plugin@^5.45.0":
-  version "5.60.1"
-  resolved "https://registry.yarnpkg.com/@typescript-eslint/eslint-plugin/-/eslint-plugin-5.60.1.tgz#81382d6ecb92b8dda70e91f9035611cb2fecd1c3"
-  integrity sha512-KSWsVvsJsLJv3c4e73y/Bzt7OpqMCADUO846bHcuWYSYM19bldbAeDv7dYyV0jwkbMfJ2XdlzwjhXtuD7OY6bw==
-  dependencies:
-    "@eslint-community/regexpp" "^4.4.0"
-    "@typescript-eslint/scope-manager" "5.60.1"
-    "@typescript-eslint/type-utils" "5.60.1"
-    "@typescript-eslint/utils" "5.60.1"
-    debug "^4.3.4"
-    grapheme-splitter "^1.0.4"
-    ignore "^5.2.0"
-    natural-compare-lite "^1.4.0"
-    semver "^7.3.7"
-    tsutils "^3.21.0"
-
-"@typescript-eslint/parser@^5.45.0":
-  version "5.60.1"
-  resolved "https://registry.yarnpkg.com/@typescript-eslint/parser/-/parser-5.60.1.tgz#0f2f58209c0862a73e3d5a56099abfdfa21d0fd3"
-  integrity sha512-pHWlc3alg2oSMGwsU/Is8hbm3XFbcrb6P5wIxcQW9NsYBfnrubl/GhVVD/Jm/t8HXhA2WncoIRfBtnCgRGV96Q==
-  dependencies:
-    "@typescript-eslint/scope-manager" "5.60.1"
-    "@typescript-eslint/types" "5.60.1"
-    "@typescript-eslint/typescript-estree" "5.60.1"
-    debug "^4.3.4"
-
-"@typescript-eslint/scope-manager@5.60.1":
-  version "5.60.1"
-  resolved "https://registry.yarnpkg.com/@typescript-eslint/scope-manager/-/scope-manager-5.60.1.tgz#35abdb47f500c68c08f2f2b4f22c7c79472854bb"
-  integrity sha512-Dn/LnN7fEoRD+KspEOV0xDMynEmR3iSHdgNsarlXNLGGtcUok8L4N71dxUgt3YvlO8si7E+BJ5Fe3wb5yUw7DQ==
-  dependencies:
-    "@typescript-eslint/types" "5.60.1"
-    "@typescript-eslint/visitor-keys" "5.60.1"
-
-"@typescript-eslint/type-utils@5.60.1":
-  version "5.60.1"
-  resolved "https://registry.yarnpkg.com/@typescript-eslint/type-utils/-/type-utils-5.60.1.tgz#17770540e98d65ab4730c7aac618003f702893f4"
-  integrity sha512-vN6UztYqIu05nu7JqwQGzQKUJctzs3/Hg7E2Yx8rz9J+4LgtIDFWjjl1gm3pycH0P3mHAcEUBd23LVgfrsTR8A==
-  dependencies:
-    "@typescript-eslint/typescript-estree" "5.60.1"
-    "@typescript-eslint/utils" "5.60.1"
-    debug "^4.3.4"
-    tsutils "^3.21.0"
-
-"@typescript-eslint/types@5.60.1":
-  version "5.60.1"
-  resolved "https://registry.yarnpkg.com/@typescript-eslint/types/-/types-5.60.1.tgz#a17473910f6b8d388ea83c9d7051af89c4eb7561"
-  integrity sha512-zDcDx5fccU8BA0IDZc71bAtYIcG9PowaOwaD8rjYbqwK7dpe/UMQl3inJ4UtUK42nOCT41jTSCwg76E62JpMcg==
-
-"@typescript-eslint/typescript-estree@5.60.1":
-  version "5.60.1"
-  resolved "https://registry.yarnpkg.com/@typescript-eslint/typescript-estree/-/typescript-estree-5.60.1.tgz#8c71824b7165b64d5ebd7aa42968899525959834"
-  integrity sha512-hkX70J9+2M2ZT6fhti5Q2FoU9zb+GeZK2SLP1WZlvUDqdMbEKhexZODD1WodNRyO8eS+4nScvT0dts8IdaBzfw==
-  dependencies:
-    "@typescript-eslint/types" "5.60.1"
-    "@typescript-eslint/visitor-keys" "5.60.1"
-    debug "^4.3.4"
-    globby "^11.1.0"
-    is-glob "^4.0.3"
-    semver "^7.3.7"
-    tsutils "^3.21.0"
-
-"@typescript-eslint/utils@5.60.1":
-  version "5.60.1"
-  resolved "https://registry.yarnpkg.com/@typescript-eslint/utils/-/utils-5.60.1.tgz#6861ebedbefba1ac85482d2bdef6f2ff1eb65b80"
-  integrity sha512-tiJ7FFdFQOWssFa3gqb94Ilexyw0JVxj6vBzaSpfN/8IhoKkDuSAenUKvsSHw2A/TMpJb26izIszTXaqygkvpQ==
-  dependencies:
-    "@eslint-community/eslint-utils" "^4.2.0"
-    "@types/json-schema" "^7.0.9"
-    "@types/semver" "^7.3.12"
-    "@typescript-eslint/scope-manager" "5.60.1"
-    "@typescript-eslint/types" "5.60.1"
-    "@typescript-eslint/typescript-estree" "5.60.1"
-    eslint-scope "^5.1.1"
-    semver "^7.3.7"
-
-"@typescript-eslint/visitor-keys@5.60.1":
-  version "5.60.1"
-  resolved "https://registry.yarnpkg.com/@typescript-eslint/visitor-keys/-/visitor-keys-5.60.1.tgz#19a877358bf96318ec35d90bfe6bd1445cce9434"
-  integrity sha512-xEYIxKcultP6E/RMKqube11pGjXH1DCo60mQoWhVYyKfLkwbIVVjYxmOenNMxILx0TjCujPTjjnTIVzm09TXIw==
-  dependencies:
-    "@typescript-eslint/types" "5.60.1"
-    eslint-visitor-keys "^3.3.0"
-
-"@vitest/expect@0.32.2":
-  version "0.32.2"
-  resolved "https://registry.yarnpkg.com/@vitest/expect/-/expect-0.32.2.tgz#8111f6ab1ff3b203efbe3a25e8bb2d160ce4b720"
-  integrity sha512-6q5yzweLnyEv5Zz1fqK5u5E83LU+gOMVBDuxBl2d2Jfx1BAp5M+rZgc5mlyqdnxquyoiOXpXmFNkcGcfFnFH3Q==
-  dependencies:
-    "@vitest/spy" "0.32.2"
-    "@vitest/utils" "0.32.2"
-    chai "^4.3.7"
-
-"@vitest/runner@0.32.2":
-  version "0.32.2"
-  resolved "https://registry.yarnpkg.com/@vitest/runner/-/runner-0.32.2.tgz#18dd979ce4e8766bcc90948d11b4c8ae6ed90b89"
-  integrity sha512-06vEL0C1pomOEktGoLjzZw+1Fb+7RBRhmw/06WkDrd1akkT9i12su0ku+R/0QM69dfkIL/rAIDTG+CSuQVDcKw==
-  dependencies:
-    "@vitest/utils" "0.32.2"
-    concordance "^5.0.4"
-    p-limit "^4.0.0"
-    pathe "^1.1.0"
-
-"@vitest/snapshot@0.32.2":
-  version "0.32.2"
-  resolved "https://registry.yarnpkg.com/@vitest/snapshot/-/snapshot-0.32.2.tgz#500b6453e88e4c50a0aded39839352c16b519b9e"
-  integrity sha512-JwhpeH/PPc7GJX38vEfCy9LtRzf9F4er7i4OsAJyV7sjPwjj+AIR8cUgpMTWK4S3TiamzopcTyLsZDMuldoi5A==
-  dependencies:
-    magic-string "^0.30.0"
-    pathe "^1.1.0"
-    pretty-format "^27.5.1"
-
-"@vitest/spy@0.32.2":
-  version "0.32.2"
-  resolved "https://registry.yarnpkg.com/@vitest/spy/-/spy-0.32.2.tgz#f3ef7afe0d34e863b90df7c959fa5af540a6aaf9"
-  integrity sha512-Q/ZNILJ4ca/VzQbRM8ur3Si5Sardsh1HofatG9wsJY1RfEaw0XKP8IVax2lI1qnrk9YPuG9LA2LkZ0EI/3d4ug==
-  dependencies:
-    tinyspy "^2.1.0"
-
-"@vitest/utils@0.32.2":
-  version "0.32.2"
-  resolved "https://registry.yarnpkg.com/@vitest/utils/-/utils-0.32.2.tgz#809c720cafbf4b35ce651deb8570d57785e77819"
-  integrity sha512-lnJ0T5i03j0IJaeW73hxe2AuVnZ/y1BhhCOuIcl9LIzXnbpXJT9Lrt6brwKHXLOiA7MZ6N5hSJjt0xE1dGNCzQ==
-  dependencies:
-    diff-sequences "^29.4.3"
-    loupe "^2.3.6"
-    pretty-format "^27.5.1"
-
-acorn-jsx@^5.3.2:
-  version "5.3.2"
-  resolved "https://registry.yarnpkg.com/acorn-jsx/-/acorn-jsx-5.3.2.tgz#7ed5bb55908b3b2f1bc55c6af1653bada7f07937"
-  integrity sha512-rq9s+JNhf0IChjtDXxllJ7g41oZk5SlXtp0LHwyA5cejwn7vKmKp4pPri6YEePv2PU65sAsegbXtIinmDFDXgQ==
-
-acorn-walk@^8.2.0:
-  version "8.2.0"
-  resolved "https://registry.yarnpkg.com/acorn-walk/-/acorn-walk-8.2.0.tgz#741210f2e2426454508853a2f44d0ab83b7f69c1"
-  integrity sha512-k+iyHEuPgSw6SbuDpGQM+06HQUa04DZ3o+F6CSzXMvvI5KMvnaEqXe+YVe555R9nn6GPt404fos4wcgpw12SDA==
-
-acorn@^8.8.0, acorn@^8.8.2, acorn@^8.9.0:
-  version "8.9.0"
-  resolved "https://registry.yarnpkg.com/acorn/-/acorn-8.9.0.tgz#78a16e3b2bcc198c10822786fa6679e245db5b59"
-  integrity sha512-jaVNAFBHNLXspO543WnNNPZFRtavh3skAkITqD0/2aeMkKZTN+254PyhwxFYrk3vQ1xfY+2wbesJMs/JC8/PwQ==
-
-ajv@^6.10.0, ajv@^6.12.4:
-  version "6.12.6"
-  resolved "https://registry.yarnpkg.com/ajv/-/ajv-6.12.6.tgz#baf5a62e802b07d977034586f8c3baf5adf26df4"
-  integrity sha512-j3fVLgvTo527anyYyJOGTYJbG+vnnQYvE0m5mmkc1TK+nxAppkCLMIL0aZ4dblVCNoGShhm+kzE4ZUykBoMg4g==
-  dependencies:
-    fast-deep-equal "^3.1.1"
-    fast-json-stable-stringify "^2.0.0"
-    json-schema-traverse "^0.4.1"
-    uri-js "^4.2.2"
-
-ansi-regex@^5.0.1:
-  version "5.0.1"
-  resolved "https://registry.yarnpkg.com/ansi-regex/-/ansi-regex-5.0.1.tgz#082cb2c89c9fe8659a311a53bd6a4dc5301db304"
-  integrity sha512-quJQXlTSUGL2LH9SUXo8VwsY4soanhgo6LNSm84E1LBcE8s3O0wpdiRzyR9z/ZZJMlMWv37qOOb9pdJlMUEKFQ==
-
-ansi-styles@^4.1.0:
-  version "4.3.0"
-  resolved "https://registry.yarnpkg.com/ansi-styles/-/ansi-styles-4.3.0.tgz#edd803628ae71c04c85ae7a0906edad34b648937"
-  integrity sha512-zbB9rCJAT1rbjiVDb2hqKFHNYLxgtk8NURxZ3IZwD3F6NtxbXZQCnnSi1Lkx+IDohdPlFp222wVALIheZJQSEg==
-  dependencies:
-    color-convert "^2.0.1"
-
-ansi-styles@^5.0.0:
-  version "5.2.0"
-  resolved "https://registry.yarnpkg.com/ansi-styles/-/ansi-styles-5.2.0.tgz#07449690ad45777d1924ac2abb2fc8895dba836b"
-  integrity sha512-Cxwpt2SfTzTtXcfOlzGEee8O+c+MmUgGrNiBcXnuWxuFJHe6a5Hz7qwhwe5OgaSYI0IJvkLqWX1ASG+cJOkEiA==
-
-anymatch@~3.1.2:
-  version "3.1.3"
-  resolved "https://registry.yarnpkg.com/anymatch/-/anymatch-3.1.3.tgz#790c58b19ba1720a84205b57c618d5ad8524973e"
-  integrity sha512-KMReFUr0B4t+D+OBkjR3KYqvocp2XaSzO55UcB6mgQMd3KbcE+mWTyvVV7D/zsdEbNnV6acZUutkiHQXvTr1Rw==
-  dependencies:
-    normalize-path "^3.0.0"
-    picomatch "^2.0.4"
-
-argparse@^1.0.7:
-  version "1.0.10"
-  resolved "https://registry.yarnpkg.com/argparse/-/argparse-1.0.10.tgz#bcd6791ea5ae09725e17e5ad988134cd40b3d911"
-  integrity sha512-o5Roy6tNG4SL/FOkCAN6RzjiakZS25RLYFrcMttJqbdd8BWrnA+fGz57iN5Pb06pvBGvl5gQ0B48dJlslXvoTg==
-  dependencies:
-    sprintf-js "~1.0.2"
-
-argparse@^2.0.1:
-  version "2.0.1"
-  resolved "https://registry.yarnpkg.com/argparse/-/argparse-2.0.1.tgz#246f50f3ca78a3240f6c997e8a9bd1eac49e4b38"
-  integrity sha512-8+9WqebbFzpX9OR+Wa6O29asIogeRMzcGtAINdpMHHyAg10f05aSFVBbcEqGf/PXw1EjAZ+q2/bEBg3DvurK3Q==
-
-aria-query@^5.3.0:
-  version "5.3.0"
-  resolved "https://registry.yarnpkg.com/aria-query/-/aria-query-5.3.0.tgz#650c569e41ad90b51b3d7df5e5eed1c7549c103e"
-  integrity sha512-b0P0sZPKtyu8HkeRAfCq0IfURZK+SuwMjY1UXGBU27wpAiTwQAIlq56IbIO+ytk/JjS1fMR14ee5WBBfKi5J6A==
-  dependencies:
-    dequal "^2.0.3"
-
-array-union@^2.1.0:
-  version "2.1.0"
-  resolved "https://registry.yarnpkg.com/array-union/-/array-union-2.1.0.tgz#b798420adbeb1de828d84acd8a2e23d3efe85e8d"
-  integrity sha512-HGyxoOTYUyCM6stUe6EJgnd4EoewAI7zMdfqO+kGjnlZmBDz/cR5pf8r/cR4Wq60sL/p0IkcjUEEPwS3GFrIyw==
-
-assertion-error@^1.1.0:
-  version "1.1.0"
-  resolved "https://registry.yarnpkg.com/assertion-error/-/assertion-error-1.1.0.tgz#e60b6b0e8f301bd97e5375215bda406c85118c0b"
-  integrity sha512-jgsaNduz+ndvGyFt3uSuWqvy4lCnIJiovtouQN5JZHOKCS2QuhEdbcQHFhVksz2N2U9hXJo8odG7ETyWlEeuDw==
-
-axobject-query@^3.2.1:
-  version "3.2.1"
-  resolved "https://registry.yarnpkg.com/axobject-query/-/axobject-query-3.2.1.tgz#39c378a6e3b06ca679f29138151e45b2b32da62a"
-  integrity sha512-jsyHu61e6N4Vbz/v18DHwWYKK0bSWLqn47eeDSKPB7m8tqMHF9YJ+mhIk2lVteyZrY8tnSj/jHOv4YiTCuCJgg==
-  dependencies:
-    dequal "^2.0.3"
-
-balanced-match@^1.0.0:
-  version "1.0.2"
-  resolved "https://registry.yarnpkg.com/balanced-match/-/balanced-match-1.0.2.tgz#e83e3a7e3f300b34cb9d87f615fa0cbf357690ee"
-  integrity sha512-3oSeUO0TMV67hN1AmbXsK4yaqU7tjiHlbxRDZOpH0KW9+CeX4bRAaX0Anxt0tx2MrpRpWwQaPwIlISEJhYU5Pw==
-
-binary-extensions@^2.0.0:
-  version "2.2.0"
-  resolved "https://registry.yarnpkg.com/binary-extensions/-/binary-extensions-2.2.0.tgz#75f502eeaf9ffde42fc98829645be4ea76bd9e2d"
-  integrity sha512-jDctJ/IVQbZoJykoeHbhXpOlNBqGNcwXJKJog42E5HDPUwQTSdjCHdihjj0DlnheQ7blbT6dHOafNAiS8ooQKA==
-
-blueimp-md5@^2.10.0:
-  version "2.19.0"
-  resolved "https://registry.yarnpkg.com/blueimp-md5/-/blueimp-md5-2.19.0.tgz#b53feea5498dcb53dc6ec4b823adb84b729c4af0"
-  integrity sha512-DRQrD6gJyy8FbiE4s+bDoXS9hiW3Vbx5uCdwvcCf3zLHL+Iv7LtGHLpr+GZV8rHG8tK766FGYBwRbu8pELTt+w==
-
-brace-expansion@^1.1.7:
-  version "1.1.11"
-  resolved "https://registry.yarnpkg.com/brace-expansion/-/brace-expansion-1.1.11.tgz#3c7fcbf529d87226f3d2f52b966ff5271eb441dd"
-  integrity sha512-iCuPHDFgrHX7H2vEI/5xpz07zSHB00TpugqhmYtVmMO6518mCuRMoOYFldEBl0g187ufozdaHgWKcYFb61qGiA==
-  dependencies:
-    balanced-match "^1.0.0"
-    concat-map "0.0.1"
-
-braces@^3.0.2, braces@~3.0.2:
-  version "3.0.2"
-  resolved "https://registry.yarnpkg.com/braces/-/braces-3.0.2.tgz#3454e1a462ee8d599e236df336cd9ea4f8afe107"
-  integrity sha512-b8um+L1RzM3WDSzvhm6gIz1yfTbBt6YTlcEKAvsmqCZZFw46z626lVj9j1yEPW33H5H+lBQpZMP1k8l+78Ha0A==
-  dependencies:
-    fill-range "^7.0.1"
-
-buffer-crc32@^0.2.5:
-  version "0.2.13"
-  resolved "https://registry.yarnpkg.com/buffer-crc32/-/buffer-crc32-0.2.13.tgz#0d333e3f00eac50aa1454abd30ef8c2a5d9a7242"
-  integrity sha512-VO9Ht/+p3SN7SKWqcrgEzjGbRSJYTx+Q1pTQC0wrWqHx0vpJraQ6GtHx8tvcg1rlK1byhU5gccxgOgj7B0TDkQ==
-
-buffer-from@^1.0.0:
-  version "1.1.2"
-  resolved "https://registry.yarnpkg.com/buffer-from/-/buffer-from-1.1.2.tgz#2b146a6fd72e80b4f55d255f35ed59a3a9a41bd5"
-  integrity sha512-E+XQCRwSbaaiChtv6k6Dwgc+bx+Bs6vuKJHHl5kox/BaKbhiXzqQOwK4cO22yElGp2OCmjwVhT3HmxgyPGnJfQ==
-
-busboy@^1.6.0:
-  version "1.6.0"
-  resolved "https://registry.yarnpkg.com/busboy/-/busboy-1.6.0.tgz#966ea36a9502e43cdb9146962523b92f531f6893"
-  integrity sha512-8SFQbg/0hQ9xy3UNTB0YEnsNBbWfhf7RtnzpL7TkBiTBRfrQ9Fxcnz7VJsleJpyp6rVLvXiuORqjlHi5q+PYuA==
-  dependencies:
-    streamsearch "^1.1.0"
-
-cac@^6.7.14:
-  version "6.7.14"
-  resolved "https://registry.yarnpkg.com/cac/-/cac-6.7.14.tgz#804e1e6f506ee363cb0e3ccbb09cad5dd9870959"
-  integrity sha512-b6Ilus+c3RrdDk+JhLKUAQfzzgLEPy6wcXqS7f/xe1EETvsDP6GORG7SFuOs6cID5YkqchW/LXZbX5bc8j7ZcQ==
-
-callsites@^3.0.0:
-  version "3.1.0"
-  resolved "https://registry.yarnpkg.com/callsites/-/callsites-3.1.0.tgz#b3630abd8943432f54b3f0519238e33cd7df2f73"
-  integrity sha512-P8BjAsXvZS+VIDUI11hHCQEv74YT67YUi5JJFNWIqL235sBmjX4+qx9Muvls5ivyNENctx46xQLQ3aTuE7ssaQ==
-
-chai@^4.3.7:
-  version "4.3.7"
-  resolved "https://registry.yarnpkg.com/chai/-/chai-4.3.7.tgz#ec63f6df01829088e8bf55fca839bcd464a8ec51"
-  integrity sha512-HLnAzZ2iupm25PlN0xFreAlBA5zaBSv3og0DdeGA4Ar6h6rJ3A0rolRUKJhSF2V10GZKDgWF/VmAEsNWjCRB+A==
-  dependencies:
-    assertion-error "^1.1.0"
-    check-error "^1.0.2"
-    deep-eql "^4.1.2"
-    get-func-name "^2.0.0"
-    loupe "^2.3.1"
-    pathval "^1.1.1"
-    type-detect "^4.0.5"
-
-chalk@^4.0.0:
-  version "4.1.2"
-  resolved "https://registry.yarnpkg.com/chalk/-/chalk-4.1.2.tgz#aac4e2b7734a740867aeb16bf02aad556a1e7a01"
-  integrity sha512-oKnbhFyRIXpUuez8iBMmyEa4nbj4IOQyuhc/wy9kY7/WVPcwIO9VA668Pu8RkO7+0G76SLROeyw9CpQ061i4mA==
-  dependencies:
-    ansi-styles "^4.1.0"
-    supports-color "^7.1.0"
-
-check-error@^1.0.2:
-  version "1.0.2"
-  resolved "https://registry.yarnpkg.com/check-error/-/check-error-1.0.2.tgz#574d312edd88bb5dd8912e9286dd6c0aed4aac82"
-  integrity sha512-BrgHpW9NURQgzoNyjfq0Wu6VFO6D7IZEmJNdtgNqpzGG8RuNFHt2jQxWlAs4HMe119chBnv+34syEZtc6IhLtA==
-
-"chokidar@>=3.0.0 <4.0.0", chokidar@^3.4.1:
-  version "3.5.3"
-  resolved "https://registry.yarnpkg.com/chokidar/-/chokidar-3.5.3.tgz#1cf37c8707b932bd1af1ae22c0432e2acd1903bd"
-  integrity sha512-Dr3sfKRP6oTcjf2JmUmFJfeVMvXBdegxB0iVQ5eb2V10uFJUCAS8OByZdVAyVb8xXNz3GjjTgj9kLWsZTqE6kw==
-  dependencies:
-    anymatch "~3.1.2"
-    braces "~3.0.2"
-    glob-parent "~5.1.2"
-    is-binary-path "~2.1.0"
-    is-glob "~4.0.1"
-    normalize-path "~3.0.0"
-    readdirp "~3.6.0"
-  optionalDependencies:
-    fsevents "~2.3.2"
-
-code-red@^1.0.3:
-  version "1.0.3"
-  resolved "https://registry.yarnpkg.com/code-red/-/code-red-1.0.3.tgz#bbd3b0a27dc53c9af13f6756120a9dbcdd68a5f2"
-  integrity sha512-kVwJELqiILQyG5aeuyKFbdsI1fmQy1Cmf7dQ8eGmVuJoaRVdwey7WaMknr2ZFeVSYSKT0rExsa8EGw0aoI/1QQ==
-  dependencies:
-    "@jridgewell/sourcemap-codec" "^1.4.14"
-    "@types/estree" "^1.0.0"
-    acorn "^8.8.2"
-    estree-walker "^3.0.3"
-    periscopic "^3.1.0"
-
-codemirror@^6.0.1:
-  version "6.0.1"
-  resolved "https://registry.yarnpkg.com/codemirror/-/codemirror-6.0.1.tgz#62b91142d45904547ee3e0e0e4c1a79158035a29"
-  integrity sha512-J8j+nZ+CdWmIeFIGXEFbFPtpiYacFMDR8GlHK3IyHQJMCaVRfGx9NT+Hxivv1ckLWPvNdZqndbr/7lVhrf/Svg==
-  dependencies:
-    "@codemirror/autocomplete" "^6.0.0"
-    "@codemirror/commands" "^6.0.0"
-    "@codemirror/language" "^6.0.0"
-    "@codemirror/lint" "^6.0.0"
-    "@codemirror/search" "^6.0.0"
-    "@codemirror/state" "^6.0.0"
-    "@codemirror/view" "^6.0.0"
-
-color-convert@^2.0.1:
-  version "2.0.1"
-  resolved "https://registry.yarnpkg.com/color-convert/-/color-convert-2.0.1.tgz#72d3a68d598c9bdb3af2ad1e84f21d896abd4de3"
-  integrity sha512-RRECPsj7iu/xb5oKYcsFHSppFNnsj/52OVTRKb4zP5onXwVF3zVmmToNcOfGC+CRDpfK/U584fMg38ZHCaElKQ==
-  dependencies:
-    color-name "~1.1.4"
-
-color-name@~1.1.4:
-  version "1.1.4"
-  resolved "https://registry.yarnpkg.com/color-name/-/color-name-1.1.4.tgz#c2a09a87acbde69543de6f63fa3995c826c536a2"
-  integrity sha512-dOy+3AuW3a2wNbZHIuMZpTcgjGuLU/uBL/ubcZF9OXbDo8ff4O8yVp5Bf0efS8uEoYo5q4Fx7dY9OgQGXgAsQA==
-
-commander@^2.20.0:
-  version "2.20.3"
-  resolved "https://registry.yarnpkg.com/commander/-/commander-2.20.3.tgz#fd485e84c03eb4881c20722ba48035e8531aeb33"
-  integrity sha512-GpVkmM8vF2vQUkj2LvZmD35JxeJOLCwJ9cUkugyk2nuhbv3+mJvpLYYt+0+USMxE+oj+ey/lJEnhZw75x/OMcQ==
-
-concat-map@0.0.1:
-  version "0.0.1"
-  resolved "https://registry.yarnpkg.com/concat-map/-/concat-map-0.0.1.tgz#d8a96bd77fd68df7793a73036a3ba0d5405d477b"
-  integrity sha512-/Srv4dswyQNBfohGpz9o6Yb3Gz3SrUDqBH5rTuhGR7ahtlbYKnVxw2bCFMRljaA7EXHaXZ8wsHdodFvbkhKmqg==
-
-concordance@^5.0.4:
-  version "5.0.4"
-  resolved "https://registry.yarnpkg.com/concordance/-/concordance-5.0.4.tgz#9896073261adced72f88d60e4d56f8efc4bbbbd2"
-  integrity sha512-OAcsnTEYu1ARJqWVGwf4zh4JDfHZEaSNlNccFmt8YjB2l/n19/PF2viLINHc57vO4FKIAFl2FWASIGZZWZ2Kxw==
-  dependencies:
-    date-time "^3.1.0"
-    esutils "^2.0.3"
-    fast-diff "^1.2.0"
-    js-string-escape "^1.0.1"
-    lodash "^4.17.15"
-    md5-hex "^3.0.1"
-    semver "^7.3.2"
-    well-known-symbols "^2.0.0"
-
-cookie@^0.5.0:
-  version "0.5.0"
-  resolved "https://registry.yarnpkg.com/cookie/-/cookie-0.5.0.tgz#d1f5d71adec6558c58f389987c366aa47e994f8b"
-  integrity sha512-YZ3GUyn/o8gfKJlnlX7g7xq4gyO6OSuhGPKaaGssGB2qgDUS0gPgtTvoyZLTt9Ab6dC4hfc9dV5arkvc/OCmrw==
-
-crelt@^1.0.5:
-  version "1.0.6"
-  resolved "https://registry.yarnpkg.com/crelt/-/crelt-1.0.6.tgz#7cc898ea74e190fb6ef9dae57f8f81cf7302df72"
-  integrity sha512-VQ2MBenTq1fWZUH9DJNGti7kKv6EeAuYr3cLwxUWhIu1baTaXh4Ib5W2CqHVqib4/MqbYGJqiL3Zb8GJZr3l4g==
-
-cross-spawn@^7.0.2:
-  version "7.0.3"
-  resolved "https://registry.yarnpkg.com/cross-spawn/-/cross-spawn-7.0.3.tgz#f73a85b9d5d41d045551c177e2882d4ac85728a6"
-  integrity sha512-iRDPJKUPVEND7dHPO8rkbOnPpyDygcDFtWjpeWNCgy8WP2rXcxXL8TskReQl6OrB2G7+UJrags1q15Fudc7G6w==
-  dependencies:
-    path-key "^3.1.0"
-    shebang-command "^2.0.0"
-    which "^2.0.1"
-
-css-tree@^2.3.1:
-  version "2.3.1"
-  resolved "https://registry.yarnpkg.com/css-tree/-/css-tree-2.3.1.tgz#10264ce1e5442e8572fc82fbe490644ff54b5c20"
-  integrity sha512-6Fv1DV/TYw//QF5IzQdqsNDjx/wc8TrMBZsqjL9eW01tWb7R7k/mq+/VXfJCl7SoD5emsJop9cOByJZfs8hYIw==
-  dependencies:
-    mdn-data "2.0.30"
-    source-map-js "^1.0.1"
-
-date-time@^3.1.0:
-  version "3.1.0"
-  resolved "https://registry.yarnpkg.com/date-time/-/date-time-3.1.0.tgz#0d1e934d170579f481ed8df1e2b8ff70ee845e1e"
-  integrity sha512-uqCUKXE5q1PNBXjPqvwhwJf9SwMoAHBgWJ6DcrnS5o+W2JOiIILl0JEdVD8SGujrNS02GGxgwAg2PN2zONgtjg==
-  dependencies:
-    time-zone "^1.0.0"
-
-debug@^4.1.1, debug@^4.3.2, debug@^4.3.4:
-  version "4.3.4"
-  resolved "https://registry.yarnpkg.com/debug/-/debug-4.3.4.tgz#1319f6579357f2338d3337d2cdd4914bb5dcc865"
-  integrity sha512-PRWFHuSU3eDtQJPvnNY7Jcket1j0t5OuOsFzPPzsekD52Zl8qUfFIPEiswXqIvHWGVHOgX+7G/vCNNhehwxfkQ==
-  dependencies:
-    ms "2.1.2"
-
-deep-eql@^4.1.2:
-  version "4.1.3"
-  resolved "https://registry.yarnpkg.com/deep-eql/-/deep-eql-4.1.3.tgz#7c7775513092f7df98d8df9996dd085eb668cc6d"
-  integrity sha512-WaEtAOpRA1MQ0eohqZjpGD8zdI0Ovsm8mmFhaDN8dvDZzyoUMcYDnf5Y6iu7HTXxf8JDS23qWa4a+hKCDyOPzw==
-  dependencies:
-    type-detect "^4.0.0"
-
-deep-is@^0.1.3:
-  version "0.1.4"
-  resolved "https://registry.yarnpkg.com/deep-is/-/deep-is-0.1.4.tgz#a6f2dce612fadd2ef1f519b73551f17e85199831"
-  integrity sha512-oIPzksmTg4/MriiaYGO+okXDT7ztn/w3Eptv/+gSIdMdKsJo0u4CfYNFJPy+4SKMuCqGw2wxnA+URMg3t8a/bQ==
-
-deepmerge@^4.3.1:
-  version "4.3.1"
-  resolved "https://registry.yarnpkg.com/deepmerge/-/deepmerge-4.3.1.tgz#44b5f2147cd3b00d4b56137685966f26fd25dd4a"
-  integrity sha512-3sUqbMEc77XqpdNO7FRyRog+eW3ph+GYCbj+rK+uYyRMuwsVy0rMiVtPn+QJlKFvWP/1PYpapqYn0Me2knFn+A==
-
-dequal@^2.0.3:
-  version "2.0.3"
-  resolved "https://registry.yarnpkg.com/dequal/-/dequal-2.0.3.tgz#2644214f1997d39ed0ee0ece72335490a7ac67be"
-  integrity sha512-0je+qPKHEMohvfRTCEo3CrPG6cAzAYgmzKyxRiYSSDkS6eGJdyVJm7WaYA5ECaAD9wLB2T4EEeymA5aFVcYXCA==
-
-detect-indent@^6.1.0:
-  version "6.1.0"
-  resolved "https://registry.yarnpkg.com/detect-indent/-/detect-indent-6.1.0.tgz#592485ebbbf6b3b1ab2be175c8393d04ca0d57e6"
-  integrity sha512-reYkTUJAZb9gUuZ2RvVCNhVHdg62RHnJ7WJl8ftMi4diZ6NWlciOzQN88pUhSELEwflJht4oQDv0F0BMlwaYtA==
-
-devalue@^4.3.1:
-  version "4.3.2"
-  resolved "https://registry.yarnpkg.com/devalue/-/devalue-4.3.2.tgz#cc44e4cf3872ac5a78229fbce3b77e57032727b5"
-  integrity sha512-KqFl6pOgOW+Y6wJgu80rHpo2/3H07vr8ntR9rkkFIRETewbf5GaYYcakYfiKz89K+sLsuPkQIZaXDMjUObZwWg==
-
-diff-sequences@^29.4.3:
-  version "29.4.3"
-  resolved "https://registry.yarnpkg.com/diff-sequences/-/diff-sequences-29.4.3.tgz#9314bc1fabe09267ffeca9cbafc457d8499a13f2"
-  integrity sha512-ofrBgwpPhCD85kMKtE9RYFFq6OC1A89oW2vvgWZNCwxrUpRUILopY7lsYyMDSjc8g6U6aiO0Qubg6r4Wgt5ZnA==
-
-dir-glob@^3.0.1:
-  version "3.0.1"
-  resolved "https://registry.yarnpkg.com/dir-glob/-/dir-glob-3.0.1.tgz#56dbf73d992a4a93ba1584f4534063fd2e41717f"
-  integrity sha512-WkrWp9GR4KXfKGYzOLmTuGVi1UWFfws377n9cc55/tb6DuqyF6pcQ5AbiHEshaDpY9v6oaSr2XCDidGmMwdzIA==
-  dependencies:
-    path-type "^4.0.0"
-
-doctrine@^3.0.0:
-  version "3.0.0"
-  resolved "https://registry.yarnpkg.com/doctrine/-/doctrine-3.0.0.tgz#addebead72a6574db783639dc87a121773973961"
-  integrity sha512-yS+Q5i3hBf7GBkd4KG8a7eBNNWNGLTaEwwYWUijIYM7zrlYDM0BFXHjjPWlWZ1Rg7UaddZeIDmi9jF3HmqiQ2w==
-  dependencies:
-    esutils "^2.0.2"
-
-es6-promise@^3.1.2:
-  version "3.3.1"
-  resolved "https://registry.yarnpkg.com/es6-promise/-/es6-promise-3.3.1.tgz#a08cdde84ccdbf34d027a1451bc91d4bcd28a613"
-  integrity sha512-SOp9Phqvqn7jtEUxPWdWfWoLmyt2VaJ6MpvP9Comy1MceMXqE6bxvaTu4iaxpYYPzhny28Lc+M87/c2cPK6lDg==
-
-esbuild@^0.17.5:
-  version "0.17.19"
-  resolved "https://registry.yarnpkg.com/esbuild/-/esbuild-0.17.19.tgz#087a727e98299f0462a3d0bcdd9cd7ff100bd955"
-  integrity sha512-XQ0jAPFkK/u3LcVRcvVHQcTIqD6E2H1fvZMA5dQPSOWb3suUbWbfbRf94pjc0bNzRYLfIrDRQXr7X+LHIm5oHw==
-  optionalDependencies:
-    "@esbuild/android-arm" "0.17.19"
-    "@esbuild/android-arm64" "0.17.19"
-    "@esbuild/android-x64" "0.17.19"
-    "@esbuild/darwin-arm64" "0.17.19"
-    "@esbuild/darwin-x64" "0.17.19"
-    "@esbuild/freebsd-arm64" "0.17.19"
-    "@esbuild/freebsd-x64" "0.17.19"
-    "@esbuild/linux-arm" "0.17.19"
-    "@esbuild/linux-arm64" "0.17.19"
-    "@esbuild/linux-ia32" "0.17.19"
-    "@esbuild/linux-loong64" "0.17.19"
-    "@esbuild/linux-mips64el" "0.17.19"
-    "@esbuild/linux-ppc64" "0.17.19"
-    "@esbuild/linux-riscv64" "0.17.19"
-    "@esbuild/linux-s390x" "0.17.19"
-    "@esbuild/linux-x64" "0.17.19"
-    "@esbuild/netbsd-x64" "0.17.19"
-    "@esbuild/openbsd-x64" "0.17.19"
-    "@esbuild/sunos-x64" "0.17.19"
-    "@esbuild/win32-arm64" "0.17.19"
-    "@esbuild/win32-ia32" "0.17.19"
-    "@esbuild/win32-x64" "0.17.19"
-
-escape-string-regexp@^4.0.0:
-  version "4.0.0"
-  resolved "https://registry.yarnpkg.com/escape-string-regexp/-/escape-string-regexp-4.0.0.tgz#14ba83a5d373e3d311e5afca29cf5bfad965bf34"
-  integrity sha512-TtpcNJ3XAzx3Gq8sWRzJaVajRs0uVxA2YAkdb1jm2YkPz4G6egUFAyA3n5vtEIZefPk5Wa4UXbKuS5fKkJWdgA==
-
-eslint-linter-browserify@^8.34.0:
-  version "8.43.0"
-  resolved "https://registry.yarnpkg.com/eslint-linter-browserify/-/eslint-linter-browserify-8.43.0.tgz#6c07453994f9c215c6d7c32d9716a36cd9b8eb46"
-  integrity sha512-p0jzDOkInsp1IdBWH0Ky2/5MkHL/uiHruusGyoo1RJJ3gsNibboWcUYDeV87NjIVMa+DlLmlR5E25ukFebMqDQ==
-
-eslint-plugin-svelte3@^4.0.0:
-  version "4.0.0"
-  resolved "https://registry.yarnpkg.com/eslint-plugin-svelte3/-/eslint-plugin-svelte3-4.0.0.tgz#3d4f3dcaec5761dac8bc697f81de3613b485b4e3"
-  integrity sha512-OIx9lgaNzD02+MDFNLw0GEUbuovNcglg+wnd/UY0fbZmlQSz7GlQiQ1f+yX0XvC07XPcDOnFcichqI3xCwp71g==
-
-eslint-scope@^5.1.1:
-  version "5.1.1"
-  resolved "https://registry.yarnpkg.com/eslint-scope/-/eslint-scope-5.1.1.tgz#e786e59a66cb92b3f6c1fb0d508aab174848f48c"
-  integrity sha512-2NxwbF/hZ0KpepYN0cNbo+FN6XoK7GaHlQhgx/hIZl6Va0bF45RQOOwhLIy8lQDbuCiadSLCBnH2CFYquit5bw==
-  dependencies:
-    esrecurse "^4.3.0"
-    estraverse "^4.1.1"
-
-eslint-scope@^7.2.0:
-  version "7.2.0"
-  resolved "https://registry.yarnpkg.com/eslint-scope/-/eslint-scope-7.2.0.tgz#f21ebdafda02352f103634b96dd47d9f81ca117b"
-  integrity sha512-DYj5deGlHBfMt15J7rdtyKNq/Nqlv5KfU4iodrQ019XESsRnwXH9KAE0y3cwtUHDo2ob7CypAnCqefh6vioWRw==
-  dependencies:
-    esrecurse "^4.3.0"
-    estraverse "^5.2.0"
-
-eslint-visitor-keys@^3.3.0, eslint-visitor-keys@^3.4.1:
-  version "3.4.1"
-  resolved "https://registry.yarnpkg.com/eslint-visitor-keys/-/eslint-visitor-keys-3.4.1.tgz#c22c48f48942d08ca824cc526211ae400478a994"
-  integrity sha512-pZnmmLwYzf+kWaM/Qgrvpen51upAktaaiI01nsJD/Yr3lMOdNtq0cxkrrg16w64VtisN6okbs7Q8AfGqj4c9fA==
-
-eslint@^8.28.0:
-  version "8.43.0"
-  resolved "https://registry.yarnpkg.com/eslint/-/eslint-8.43.0.tgz#3e8c6066a57097adfd9d390b8fc93075f257a094"
-  integrity sha512-aaCpf2JqqKesMFGgmRPessmVKjcGXqdlAYLLC3THM8t5nBRZRQ+st5WM/hoJXkdioEXLLbXgclUpM0TXo5HX5Q==
-  dependencies:
-    "@eslint-community/eslint-utils" "^4.2.0"
-    "@eslint-community/regexpp" "^4.4.0"
-    "@eslint/eslintrc" "^2.0.3"
-    "@eslint/js" "8.43.0"
-    "@humanwhocodes/config-array" "^0.11.10"
-    "@humanwhocodes/module-importer" "^1.0.1"
-    "@nodelib/fs.walk" "^1.2.8"
-    ajv "^6.10.0"
-    chalk "^4.0.0"
-    cross-spawn "^7.0.2"
-    debug "^4.3.2"
-    doctrine "^3.0.0"
-    escape-string-regexp "^4.0.0"
-    eslint-scope "^7.2.0"
-    eslint-visitor-keys "^3.4.1"
-    espree "^9.5.2"
-    esquery "^1.4.2"
-    esutils "^2.0.2"
-    fast-deep-equal "^3.1.3"
-    file-entry-cache "^6.0.1"
-    find-up "^5.0.0"
-    glob-parent "^6.0.2"
-    globals "^13.19.0"
-    graphemer "^1.4.0"
-    ignore "^5.2.0"
-    import-fresh "^3.0.0"
-    imurmurhash "^0.1.4"
-    is-glob "^4.0.0"
-    is-path-inside "^3.0.3"
-    js-yaml "^4.1.0"
-    json-stable-stringify-without-jsonify "^1.0.1"
-    levn "^0.4.1"
-    lodash.merge "^4.6.2"
-    minimatch "^3.1.2"
-    natural-compare "^1.4.0"
-    optionator "^0.9.1"
-    strip-ansi "^6.0.1"
-    strip-json-comments "^3.1.0"
-    text-table "^0.2.0"
-
-esm-env@^1.0.0:
-  version "1.0.0"
-  resolved "https://registry.yarnpkg.com/esm-env/-/esm-env-1.0.0.tgz#b124b40b180711690a4cb9b00d16573391950413"
-  integrity sha512-Cf6VksWPsTuW01vU9Mk/3vRue91Zevka5SjyNf3nEpokFRuqt/KjUQoGAwq9qMmhpLTHmXzSIrFRw8zxWzmFBA==
-
-espree@^9.5.2:
-  version "9.5.2"
-  resolved "https://registry.yarnpkg.com/espree/-/espree-9.5.2.tgz#e994e7dc33a082a7a82dceaf12883a829353215b"
-  integrity sha512-7OASN1Wma5fum5SrNhFMAMJxOUAbhyfQ8dQ//PJaJbNw0URTPWqIghHWt1MmAANKhHZIYOHruW4Kw4ruUWOdGw==
-  dependencies:
-    acorn "^8.8.0"
-    acorn-jsx "^5.3.2"
-    eslint-visitor-keys "^3.4.1"
-
-esprima@^4.0.0:
-  version "4.0.1"
-  resolved "https://registry.yarnpkg.com/esprima/-/esprima-4.0.1.tgz#13b04cdb3e6c5d19df91ab6987a8695619b0aa71"
-  integrity sha512-eGuFFw7Upda+g4p+QHvnW0RyTX/SVeJBDM/gCtMARO0cLuT2HcEKnTPvhjV6aGeqrCB/sbNop0Kszm0jsaWU4A==
-
-esquery@^1.4.2:
-  version "1.5.0"
-  resolved "https://registry.yarnpkg.com/esquery/-/esquery-1.5.0.tgz#6ce17738de8577694edd7361c57182ac8cb0db0b"
-  integrity sha512-YQLXUplAwJgCydQ78IMJywZCceoqk1oH01OERdSAJc/7U2AylwjhSCLDEtqwg811idIS/9fIU5GjG73IgjKMVg==
-  dependencies:
-    estraverse "^5.1.0"
-
-esrecurse@^4.3.0:
-  version "4.3.0"
-  resolved "https://registry.yarnpkg.com/esrecurse/-/esrecurse-4.3.0.tgz#7ad7964d679abb28bee72cec63758b1c5d2c9921"
-  integrity sha512-KmfKL3b6G+RXvP8N1vr3Tq1kL/oCFgn2NYXEtqP8/L3pKapUA4G8cFVaoF3SU323CD4XypR/ffioHmkti6/Tag==
-  dependencies:
-    estraverse "^5.2.0"
-
-estraverse@^4.1.1:
-  version "4.3.0"
-  resolved "https://registry.yarnpkg.com/estraverse/-/estraverse-4.3.0.tgz#398ad3f3c5a24948be7725e83d11a7de28cdbd1d"
-  integrity sha512-39nnKffWz8xN1BU/2c79n9nB9HDzo0niYUqx6xyqUnyoAnQyyWpOTdZEeiCch8BBu515t4wp9ZmgVfVhn9EBpw==
-
-estraverse@^5.1.0, estraverse@^5.2.0:
-  version "5.3.0"
-  resolved "https://registry.yarnpkg.com/estraverse/-/estraverse-5.3.0.tgz#2eea5290702f26ab8fe5370370ff86c965d21123"
-  integrity sha512-MMdARuVEQziNTeJD8DgMqmhwR11BRQ/cBP+pLtYdSTnf3MIO8fFeiINEbX36ZdNlfU/7A9f3gUw49B3oQsvwBA==
-
-estree-walker@^3.0.0, estree-walker@^3.0.3:
-  version "3.0.3"
-  resolved "https://registry.yarnpkg.com/estree-walker/-/estree-walker-3.0.3.tgz#67c3e549ec402a487b4fc193d1953a524752340d"
-  integrity sha512-7RUKfXgSMMkzt6ZuXmqapOurLGPPfgj6l9uRZ7lRGolvk0y2yocc35LdcxKC5PQZdn2DMqioAQ2NoWcrTKmm6g==
-  dependencies:
-    "@types/estree" "^1.0.0"
-
-esutils@^2.0.2, esutils@^2.0.3:
-  version "2.0.3"
-  resolved "https://registry.yarnpkg.com/esutils/-/esutils-2.0.3.tgz#74d2eb4de0b8da1293711910d50775b9b710ef64"
-  integrity sha512-kVscqXk4OCp68SZ0dkgEKVi6/8ij300KBWTJq32P/dYeWTSwK41WyTxalN1eRmA5Z9UU/LX9D7FWSmV9SAYx6g==
-
-fast-deep-equal@^3.1.1, fast-deep-equal@^3.1.3:
-  version "3.1.3"
-  resolved "https://registry.yarnpkg.com/fast-deep-equal/-/fast-deep-equal-3.1.3.tgz#3a7d56b559d6cbc3eb512325244e619a65c6c525"
-  integrity sha512-f3qQ9oQy9j2AhBe/H9VC91wLmKBCCU/gDOnKNAYG5hswO7BLKj09Hc5HYNz9cGI++xlpDCIgDaitVs03ATR84Q==
-
-fast-diff@^1.2.0:
-  version "1.3.0"
-  resolved "https://registry.yarnpkg.com/fast-diff/-/fast-diff-1.3.0.tgz#ece407fa550a64d638536cd727e129c61616e0f0"
-  integrity sha512-VxPP4NqbUjj6MaAOafWeUn2cXWLcCtljklUtZf0Ind4XQ+QPtmA0b18zZy0jIQx+ExRVCR/ZQpBmik5lXshNsw==
-
-fast-glob@^3.2.12, fast-glob@^3.2.7, fast-glob@^3.2.9:
-  version "3.3.0"
-  resolved "https://registry.yarnpkg.com/fast-glob/-/fast-glob-3.3.0.tgz#7c40cb491e1e2ed5664749e87bfb516dbe8727c0"
-  integrity sha512-ChDuvbOypPuNjO8yIDf36x7BlZX1smcUMTTcyoIjycexOxd6DFsKsg21qVBzEmr3G7fUKIRy2/psii+CIUt7FA==
-  dependencies:
-    "@nodelib/fs.stat" "^2.0.2"
-    "@nodelib/fs.walk" "^1.2.3"
-    glob-parent "^5.1.2"
-    merge2 "^1.3.0"
-    micromatch "^4.0.4"
-
-fast-json-stable-stringify@^2.0.0:
-  version "2.1.0"
-  resolved "https://registry.yarnpkg.com/fast-json-stable-stringify/-/fast-json-stable-stringify-2.1.0.tgz#874bf69c6f404c2b5d99c481341399fd55892633"
-  integrity sha512-lhd/wF+Lk98HZoTCtlVraHtfh5XYijIjalXck7saUtuanSDyLMxnHhSXEDJqHxD7msR8D0uCmqlkwjCV8xvwHw==
-
-fast-levenshtein@^2.0.6:
-  version "2.0.6"
-  resolved "https://registry.yarnpkg.com/fast-levenshtein/-/fast-levenshtein-2.0.6.tgz#3d8a5c66883a16a30ca8643e851f19baa7797917"
-  integrity sha512-DCXu6Ifhqcks7TZKY3Hxp3y6qphY5SJZmrWMDrKcERSOXWQdMhU9Ig/PYrzyw/ul9jOIyh0N4M0tbC5hodg8dw==
-
-fastq@^1.6.0:
-  version "1.15.0"
-  resolved "https://registry.yarnpkg.com/fastq/-/fastq-1.15.0.tgz#d04d07c6a2a68fe4599fea8d2e103a937fae6b3a"
-  integrity sha512-wBrocU2LCXXa+lWBt8RoIRD89Fi8OdABODa/kEnyeyjS5aZO5/GNvI5sEINADqP/h8M29UHTHUb53sUu5Ihqdw==
-  dependencies:
-    reusify "^1.0.4"
-
-file-entry-cache@^6.0.1:
-  version "6.0.1"
-  resolved "https://registry.yarnpkg.com/file-entry-cache/-/file-entry-cache-6.0.1.tgz#211b2dd9659cb0394b073e7323ac3c933d522027"
-  integrity sha512-7Gps/XWymbLk2QLYK4NzpMOrYjMhdIxXuIvy2QBsLE6ljuodKvdkWs/cpyJJ3CVIVpH0Oi1Hvg1ovbMzLdFBBg==
-  dependencies:
-    flat-cache "^3.0.4"
-
-fill-range@^7.0.1:
-  version "7.0.1"
-  resolved "https://registry.yarnpkg.com/fill-range/-/fill-range-7.0.1.tgz#1919a6a7c75fe38b2c7c77e5198535da9acdda40"
-  integrity sha512-qOo9F+dMUmC2Lcb4BbVvnKJxTPjCm+RRpe4gDuGrzkL7mEVl/djYSu2OdQ2Pa302N4oqkSg9ir6jaLWJ2USVpQ==
-  dependencies:
-    to-regex-range "^5.0.1"
-
-find-up@^5.0.0:
-  version "5.0.0"
-  resolved "https://registry.yarnpkg.com/find-up/-/find-up-5.0.0.tgz#4c92819ecb7083561e4f4a240a86be5198f536fc"
-  integrity sha512-78/PXT1wlLLDgTzDs7sjq9hzz0vXD+zn+7wypEe4fXQxCmdmqfGsEPQxmiCSQI3ajFV91bVSsvNtrJRiW6nGng==
-  dependencies:
-    locate-path "^6.0.0"
-    path-exists "^4.0.0"
-
-flat-cache@^3.0.4:
-  version "3.0.4"
-  resolved "https://registry.yarnpkg.com/flat-cache/-/flat-cache-3.0.4.tgz#61b0338302b2fe9f957dcc32fc2a87f1c3048b11"
-  integrity sha512-dm9s5Pw7Jc0GvMYbshN6zchCA9RgQlzzEZX3vylR9IqFfS8XciblUXOKfW6SiuJ0e13eDYZoZV5wdrev7P3Nwg==
-  dependencies:
-    flatted "^3.1.0"
-    rimraf "^3.0.2"
-
-flatted@^3.1.0:
-  version "3.2.7"
-  resolved "https://registry.yarnpkg.com/flatted/-/flatted-3.2.7.tgz#609f39207cb614b89d0765b477cb2d437fbf9787"
-  integrity sha512-5nqDSxl8nn5BSNxyR3n4I6eDmbolI6WT+QqR547RwxQapgjQBmtktdP+HTBb/a/zLsbzERTONyUB5pefh5TtjQ==
-
-fs.realpath@^1.0.0:
-  version "1.0.0"
-  resolved "https://registry.yarnpkg.com/fs.realpath/-/fs.realpath-1.0.0.tgz#1504ad2523158caa40db4a2787cb01411994ea4f"
-  integrity sha512-OO0pH2lK6a0hZnAdau5ItzHPI6pUlvI7jMVnxUQRtw4owF2wk8lOSabtGDCTP4Ggrg2MbGnWO9X8K1t4+fGMDw==
-
-fsevents@2.3.2, fsevents@~2.3.2:
-  version "2.3.2"
-  resolved "https://registry.yarnpkg.com/fsevents/-/fsevents-2.3.2.tgz#8a526f78b8fdf4623b709e0b975c52c24c02fd1a"
-  integrity sha512-xiqMQR4xAeHTuB9uWm+fFRcIOgKBMiOBP+eXiyT7jsgVCq1bkVygt00oASowB7EdtpOHaaPgKt812P9ab+DDKA==
-
-get-func-name@^2.0.0:
-  version "2.0.0"
-  resolved "https://registry.yarnpkg.com/get-func-name/-/get-func-name-2.0.0.tgz#ead774abee72e20409433a066366023dd6887a41"
-  integrity sha512-Hm0ixYtaSZ/V7C8FJrtZIuBBI+iSgL+1Aq82zSu8VQNB4S3Gk8e7Qs3VwBDJAhmRZcFqkl3tQu36g/Foh5I5ig==
-
-glob-parent@^5.1.2, glob-parent@~5.1.2:
-  version "5.1.2"
-  resolved "https://registry.yarnpkg.com/glob-parent/-/glob-parent-5.1.2.tgz#869832c58034fe68a4093c17dc15e8340d8401c4"
-  integrity sha512-AOIgSQCepiJYwP3ARnGx+5VnTu2HBYdzbGP45eLw1vr3zB3vZLeyed1sC9hnbcOc9/SrMyM5RPQrkGz4aS9Zow==
-  dependencies:
-    is-glob "^4.0.1"
-
-glob-parent@^6.0.2:
-  version "6.0.2"
-  resolved "https://registry.yarnpkg.com/glob-parent/-/glob-parent-6.0.2.tgz#6d237d99083950c79290f24c7642a3de9a28f9e3"
-  integrity sha512-XxwI8EOhVQgWp6iDL+3b0r86f4d6AX6zSU55HfB4ydCEuXLXc5FcYeOu+nnGftS4TEju/11rt4KJPTMgbfmv4A==
-  dependencies:
-    is-glob "^4.0.3"
-
-glob@^7.1.3:
-  version "7.2.3"
-  resolved "https://registry.yarnpkg.com/glob/-/glob-7.2.3.tgz#b8df0fb802bbfa8e89bd1d938b4e16578ed44f2b"
-  integrity sha512-nFR0zLpU2YCaRxwoCJvL6UvCH2JFyFVIvwTLsIf21AuHlMskA1hhTdk+LlYJtOlYt9v6dvszD2BGRqBL+iQK9Q==
-  dependencies:
-    fs.realpath "^1.0.0"
-    inflight "^1.0.4"
-    inherits "2"
-    minimatch "^3.1.1"
-    once "^1.3.0"
-    path-is-absolute "^1.0.0"
-
-globals@^13.19.0:
-  version "13.20.0"
-  resolved "https://registry.yarnpkg.com/globals/-/globals-13.20.0.tgz#ea276a1e508ffd4f1612888f9d1bad1e2717bf82"
-  integrity sha512-Qg5QtVkCy/kv3FUSlu4ukeZDVf9ee0iXLAUYX13gbR17bnejFTzr4iS9bY7kwCf1NztRNm1t91fjOiyx4CSwPQ==
-  dependencies:
-    type-fest "^0.20.2"
-
-globby@^11.1.0:
-  version "11.1.0"
-  resolved "https://registry.yarnpkg.com/globby/-/globby-11.1.0.tgz#bd4be98bb042f83d796f7e3811991fbe82a0d34b"
-  integrity sha512-jhIXaOzy1sb8IyocaruWSn1TjmnBVs8Ayhcy83rmxNJ8q2uWKCAj3CnJY+KpGSXCueAPc0i05kVvVKtP1t9S3g==
-  dependencies:
-    array-union "^2.1.0"
-    dir-glob "^3.0.1"
-    fast-glob "^3.2.9"
-    ignore "^5.2.0"
-    merge2 "^1.4.1"
-    slash "^3.0.0"
-
-graceful-fs@^4.1.3:
-  version "4.2.11"
-  resolved "https://registry.yarnpkg.com/graceful-fs/-/graceful-fs-4.2.11.tgz#4183e4e8bf08bb6e05bbb2f7d2e0c8f712ca40e3"
-  integrity sha512-RbJ5/jmFcNNCcDV5o9eTnBLJ/HszWV0P73bc+Ff4nS/rJj+YaS6IGyiOL0VoBYX+l1Wrl3k63h/KrH+nhJ0XvQ==
-
-grapheme-splitter@^1.0.4:
-  version "1.0.4"
-  resolved "https://registry.yarnpkg.com/grapheme-splitter/-/grapheme-splitter-1.0.4.tgz#9cf3a665c6247479896834af35cf1dbb4400767e"
-  integrity sha512-bzh50DW9kTPM00T8y4o8vQg89Di9oLJVLW/KaOGIXJWP/iqCN6WKYkbNOF04vFLJhwcpYUh9ydh/+5vpOqV4YQ==
-
-graphemer@^1.4.0:
-  version "1.4.0"
-  resolved "https://registry.yarnpkg.com/graphemer/-/graphemer-1.4.0.tgz#fb2f1d55e0e3a1849aeffc90c4fa0dd53a0e66c6"
-  integrity sha512-EtKwoO6kxCL9WO5xipiHTZlSzBm7WLT627TqC/uVRd0HKmq8NXyebnNYxDoBi7wt8eTWrUrKXCOVaFq9x1kgag==
-
-has-flag@^4.0.0:
-  version "4.0.0"
-  resolved "https://registry.yarnpkg.com/has-flag/-/has-flag-4.0.0.tgz#944771fd9c81c81265c4d6941860da06bb59479b"
-  integrity sha512-EykJT/Q1KjTWctppgIAgfSO0tKVuZUjhgMr17kqTumMl6Afv3EISleU7qZUzoXDFTAHTDC4NOoG/ZxU3EvlMPQ==
-
-ignore@^5.2.0:
-  version "5.2.4"
-  resolved "https://registry.yarnpkg.com/ignore/-/ignore-5.2.4.tgz#a291c0c6178ff1b960befe47fcdec301674a6324"
-  integrity sha512-MAb38BcSbH0eHNBxn7ql2NH/kX33OkB3lZ1BNdh7ENeRChHTYsTvWrMubiIAMNS2llXEEgZ1MUOBtXChP3kaFQ==
-
-immutable@^4.0.0:
-  version "4.3.0"
-  resolved "https://registry.yarnpkg.com/immutable/-/immutable-4.3.0.tgz#eb1738f14ffb39fd068b1dbe1296117484dd34be"
-  integrity sha512-0AOCmOip+xgJwEVTQj1EfiDDOkPmuyllDuTuEX+DDXUgapLAsBIfkg3sxCYyCEA8mQqZrrxPUGjcOQ2JS3WLkg==
-
-import-fresh@^3.0.0, import-fresh@^3.2.1:
-  version "3.3.0"
-  resolved "https://registry.yarnpkg.com/import-fresh/-/import-fresh-3.3.0.tgz#37162c25fcb9ebaa2e6e53d5b4d88ce17d9e0c2b"
-  integrity sha512-veYYhQa+D1QBKznvhUHxb8faxlrwUnxseDAbAp457E0wLNio2bOSKnjYDhMj+YiAq61xrMGhQk9iXVk5FzgQMw==
-  dependencies:
-    parent-module "^1.0.0"
-    resolve-from "^4.0.0"
-
-imurmurhash@^0.1.4:
-  version "0.1.4"
-  resolved "https://registry.yarnpkg.com/imurmurhash/-/imurmurhash-0.1.4.tgz#9218b9b2b928a238b13dc4fb6b6d576f231453ea"
-  integrity sha512-JmXMZ6wuvDmLiHEml9ykzqO6lwFbof0GG4IkcGaENdCRDDmMVnny7s5HsIgHCbaq0w2MyPhDqkhTUgS2LU2PHA==
-
-inflight@^1.0.4:
-  version "1.0.6"
-  resolved "https://registry.yarnpkg.com/inflight/-/inflight-1.0.6.tgz#49bd6331d7d02d0c09bc910a1075ba8165b56df9"
-  integrity sha512-k92I/b08q4wvFscXCLvqfsHCrjrF7yiXsQuIVvVE7N82W3+aqpzuUdBbfhWcy/FZR3/4IgflMgKLOsvPDrGCJA==
-  dependencies:
-    once "^1.3.0"
-    wrappy "1"
-
-inherits@2:
-  version "2.0.4"
-  resolved "https://registry.yarnpkg.com/inherits/-/inherits-2.0.4.tgz#0fa2c64f932917c3433a0ded55363aae37416b7c"
-  integrity sha512-k/vGaX4/Yla3WzyMCvTQOXYeIHvqOKtnqBduzTHpzpQZzAskKMhZ2K+EnBiSM9zGSoIFeMpXKxa4dYeZIQqewQ==
-
-is-binary-path@~2.1.0:
-  version "2.1.0"
-  resolved "https://registry.yarnpkg.com/is-binary-path/-/is-binary-path-2.1.0.tgz#ea1f7f3b80f064236e83470f86c09c254fb45b09"
-  integrity sha512-ZMERYes6pDydyuGidse7OsHxtbI7WVeUEozgR/g7rd0xUimYNlvZRE/K2MgZTjWy725IfelLeVcEM97mmtRGXw==
-  dependencies:
-    binary-extensions "^2.0.0"
-
-is-extglob@^2.1.1:
-  version "2.1.1"
-  resolved "https://registry.yarnpkg.com/is-extglob/-/is-extglob-2.1.1.tgz#a88c02535791f02ed37c76a1b9ea9773c833f8c2"
-  integrity sha512-SbKbANkN603Vi4jEZv49LeVJMn4yGwsbzZworEoyEiutsN3nJYdbO36zfhGJ6QEDpOZIFkDtnq5JRxmvl3jsoQ==
-
-is-glob@^4.0.0, is-glob@^4.0.1, is-glob@^4.0.3, is-glob@~4.0.1:
-  version "4.0.3"
-  resolved "https://registry.yarnpkg.com/is-glob/-/is-glob-4.0.3.tgz#64f61e42cbbb2eec2071a9dac0b28ba1e65d5084"
-  integrity sha512-xelSayHH36ZgE7ZWhli7pW34hNbNl8Ojv5KVmkJD4hBdD3th8Tfk9vYasLM+mXWOZhFkgZfxhLSnrwRr4elSSg==
-  dependencies:
-    is-extglob "^2.1.1"
-
-is-number@^7.0.0:
-  version "7.0.0"
-  resolved "https://registry.yarnpkg.com/is-number/-/is-number-7.0.0.tgz#7535345b896734d5f80c4d06c50955527a14f12b"
-  integrity sha512-41Cifkg6e8TylSpdtTpeLVMqvSBEVzTttHvERD741+pnZ8ANv0004MRL43QKPDlK9cGvNp6NZWZUBlbGXYxxng==
-
-is-path-inside@^3.0.3:
-  version "3.0.3"
-  resolved "https://registry.yarnpkg.com/is-path-inside/-/is-path-inside-3.0.3.tgz#d231362e53a07ff2b0e0ea7fed049161ffd16283"
-  integrity sha512-Fd4gABb+ycGAmKou8eMftCupSir5lRxqf4aD/vd0cD2qc4HL07OjCeuHMr8Ro4CoMaeCKDB0/ECBOVWjTwUvPQ==
-
-is-reference@^3.0.0, is-reference@^3.0.1:
-  version "3.0.1"
-  resolved "https://registry.yarnpkg.com/is-reference/-/is-reference-3.0.1.tgz#d400f4260f7e55733955e60d361d827eb4d3b831"
-  integrity sha512-baJJdQLiYaJdvFbJqXrcGv3WU3QCzBlUcI5QhbesIm6/xPsvmO+2CDoi/GMOFBQEQm+PXkwOPrp9KK5ozZsp2w==
-  dependencies:
-    "@types/estree" "*"
-
-isexe@^2.0.0:
-  version "2.0.0"
-  resolved "https://registry.yarnpkg.com/isexe/-/isexe-2.0.0.tgz#e8fbf374dc556ff8947a10dcb0572d633f2cfa10"
-  integrity sha512-RHxMLp9lnKHGHRng9QFhRCMbYAcVpn69smSGcq3f36xjgVVWThj4qqLbTLlq7Ssj8B+fIQ1EuCEGI2lKsyQeIw==
-
-js-string-escape@^1.0.1:
-  version "1.0.1"
-  resolved "https://registry.yarnpkg.com/js-string-escape/-/js-string-escape-1.0.1.tgz#e2625badbc0d67c7533e9edc1068c587ae4137ef"
-  integrity sha512-Smw4xcfIQ5LVjAOuJCvN/zIodzA/BBSsluuoSykP+lUvScIi4U6RJLfwHet5cxFnCswUjISV8oAXaqaJDY3chg==
-
-js-yaml@3.14.1:
-  version "3.14.1"
-  resolved "https://registry.yarnpkg.com/js-yaml/-/js-yaml-3.14.1.tgz#dae812fdb3825fa306609a8717383c50c36a0537"
-  integrity sha512-okMH7OXXJ7YrN9Ok3/SXrnu4iX9yOk+25nqX4imS2npuvTYDmo/QEZoqwZkYaIDk3jVvBOTOIEgEhaLOynBS9g==
-  dependencies:
-    argparse "^1.0.7"
-    esprima "^4.0.0"
-
-js-yaml@^4.1.0:
-  version "4.1.0"
-  resolved "https://registry.yarnpkg.com/js-yaml/-/js-yaml-4.1.0.tgz#c1fb65f8f5017901cdd2c951864ba18458a10602"
-  integrity sha512-wpxZs9NoxZaJESJGIZTyDEaYpl0FKSA+FB9aJiyemKhMwkxQg63h4T1KJgUGHpTqPDNRcmmYLugrRjJlBtWvRA==
-  dependencies:
-    argparse "^2.0.1"
-
-json-schema-traverse@^0.4.1:
-  version "0.4.1"
-  resolved "https://registry.yarnpkg.com/json-schema-traverse/-/json-schema-traverse-0.4.1.tgz#69f6a87d9513ab8bb8fe63bdb0979c448e684660"
-  integrity sha512-xbbCH5dCYU5T8LcEhhuh7HJ88HXuW3qsI3Y0zOZFKfZEHcpWiHU/Jxzk629Brsab/mMiHQti9wMP+845RPe3Vg==
-
-json-stable-stringify-without-jsonify@^1.0.1:
-  version "1.0.1"
-  resolved "https://registry.yarnpkg.com/json-stable-stringify-without-jsonify/-/json-stable-stringify-without-jsonify-1.0.1.tgz#9db7b59496ad3f3cfef30a75142d2d930ad72651"
-  integrity sha512-Bdboy+l7tA3OGW6FjyFHWkP5LuByj1Tk33Ljyq0axyzdk9//JSi2u3fP1QSmd1KNwq6VOKYGlAu87CisVir6Pw==
-
-jsonc-parser@^3.2.0:
-  version "3.2.0"
-  resolved "https://registry.yarnpkg.com/jsonc-parser/-/jsonc-parser-3.2.0.tgz#31ff3f4c2b9793f89c67212627c51c6394f88e76"
-  integrity sha512-gfFQZrcTc8CnKXp6Y4/CBT3fTc0OVuDofpre4aEeEpSBPV5X5v4+Vmx+8snU7RLPrNHPKSgLxGo9YuQzz20o+w==
-
-kleur@^4.1.5:
-  version "4.1.5"
-  resolved "https://registry.yarnpkg.com/kleur/-/kleur-4.1.5.tgz#95106101795f7050c6c650f350c683febddb1780"
-  integrity sha512-o+NO+8WrRiQEE4/7nwRJhN1HWpVmJm511pBHUxPLtp0BUISzlBplORYSmTclCnJvQq2tKu/sgl3xVpkc7ZWuQQ==
-
-levn@^0.4.1:
-  version "0.4.1"
-  resolved "https://registry.yarnpkg.com/levn/-/levn-0.4.1.tgz#ae4562c007473b932a6200d403268dd2fffc6ade"
-  integrity sha512-+bT2uH4E5LGE7h/n3evcS/sQlJXCpIp6ym8OWJ5eV6+67Dsql/LaaT7qJBAt2rzfoa/5QBGBhxDix1dMt2kQKQ==
-  dependencies:
-    prelude-ls "^1.2.1"
-    type-check "~0.4.0"
-
-local-pkg@^0.4.3:
-  version "0.4.3"
-  resolved "https://registry.yarnpkg.com/local-pkg/-/local-pkg-0.4.3.tgz#0ff361ab3ae7f1c19113d9bb97b98b905dbc4963"
-  integrity sha512-SFppqq5p42fe2qcZQqqEOiVRXl+WCP1MdT6k7BDEW1j++sp5fIY+/fdRQitvKgB5BrBcmrs5m/L0v2FrU5MY1g==
-
-locate-character@^3.0.0:
-  version "3.0.0"
-  resolved "https://registry.yarnpkg.com/locate-character/-/locate-character-3.0.0.tgz#0305c5b8744f61028ef5d01f444009e00779f974"
-  integrity sha512-SW13ws7BjaeJ6p7Q6CO2nchbYEc3X3J6WrmTTDto7yMPqVSZTUyY5Tjbid+Ab8gLnATtygYtiDIJGQRRn2ZOiA==
-
-locate-path@^6.0.0:
-  version "6.0.0"
-  resolved "https://registry.yarnpkg.com/locate-path/-/locate-path-6.0.0.tgz#55321eb309febbc59c4801d931a72452a681d286"
-  integrity sha512-iPZK6eYjbxRu3uB4/WZ3EsEIMJFMqAoopl3R+zuq0UjcAm/MO6KCweDgPfP3elTztoKP3KtnVHxTn2NHBSDVUw==
-  dependencies:
-    p-locate "^5.0.0"
-
-lodash.merge@^4.6.2:
-  version "4.6.2"
-  resolved "https://registry.yarnpkg.com/lodash.merge/-/lodash.merge-4.6.2.tgz#558aa53b43b661e1925a0afdfa36a9a1085fe57a"
-  integrity sha512-0KpjqXRVvrYyCsX1swR/XTK0va6VQkQM6MNo7PqW77ByjAhoARA8EfrP1N4+KlKj8YS0ZUCtRT/YUuhyYDujIQ==
-
-lodash@^4.17.15:
-  version "4.17.21"
-  resolved "https://registry.yarnpkg.com/lodash/-/lodash-4.17.21.tgz#679591c564c3bffaae8454cf0b3df370c3d6911c"
-  integrity sha512-v2kDEe57lecTulaDIuNTPy3Ry4gLGJ6Z1O3vE1krgXZNrsQ+LFTGHVxVjcXPs17LhbZVGedAJv8XZ1tvj5FvSg==
-
-loupe@^2.3.1, loupe@^2.3.6:
-  version "2.3.6"
-  resolved "https://registry.yarnpkg.com/loupe/-/loupe-2.3.6.tgz#76e4af498103c532d1ecc9be102036a21f787b53"
-  integrity sha512-RaPMZKiMy8/JruncMU5Bt6na1eftNoo++R4Y+N2FrxkDVTrGvcyzFTsaGif4QTeKESheMGegbhw6iUAq+5A8zA==
-  dependencies:
-    get-func-name "^2.0.0"
-
-lru-cache@^6.0.0:
-  version "6.0.0"
-  resolved "https://registry.yarnpkg.com/lru-cache/-/lru-cache-6.0.0.tgz#6d6fe6570ebd96aaf90fcad1dafa3b2566db3a94"
-  integrity sha512-Jo6dJ04CmSjuznwJSS3pUeWmd/H0ffTlkXXgwZi+eq1UCmqQwCh+eLsYOYCwY991i2Fah4h1BEMCx4qThGbsiA==
-  dependencies:
-    yallist "^4.0.0"
-
-magic-string@^0.27.0:
-  version "0.27.0"
-  resolved "https://registry.yarnpkg.com/magic-string/-/magic-string-0.27.0.tgz#e4a3413b4bab6d98d2becffd48b4a257effdbbf3"
-  integrity sha512-8UnnX2PeRAPZuN12svgR9j7M1uWMovg/CEnIwIG0LFkXSJJe4PdfUGiTGl8V9bsBHFUtfVINcSyYxd7q+kx9fA==
-  dependencies:
-    "@jridgewell/sourcemap-codec" "^1.4.13"
-
-magic-string@^0.30.0:
-  version "0.30.0"
-  resolved "https://registry.yarnpkg.com/magic-string/-/magic-string-0.30.0.tgz#fd58a4748c5c4547338a424e90fa5dd17f4de529"
-  integrity sha512-LA+31JYDJLs82r2ScLrlz1GjSgu66ZV518eyWT+S8VhyQn/JL0u9MeBOvQMGYiPk1DBiSN9DDMOcXvigJZaViQ==
-  dependencies:
-    "@jridgewell/sourcemap-codec" "^1.4.13"
-
-md5-hex@^3.0.1:
-  version "3.0.1"
-  resolved "https://registry.yarnpkg.com/md5-hex/-/md5-hex-3.0.1.tgz#be3741b510591434b2784d79e556eefc2c9a8e5c"
-  integrity sha512-BUiRtTtV39LIJwinWBjqVsU9xhdnz7/i889V859IBFpuqGAj6LuOvHv5XLbgZ2R7ptJoJaEcxkv88/h25T7Ciw==
-  dependencies:
-    blueimp-md5 "^2.10.0"
-
-mdn-data@2.0.30:
-  version "2.0.30"
-  resolved "https://registry.yarnpkg.com/mdn-data/-/mdn-data-2.0.30.tgz#ce4df6f80af6cfbe218ecd5c552ba13c4dfa08cc"
-  integrity sha512-GaqWWShW4kv/G9IEucWScBx9G1/vsFZZJUO+tD26M8J8z3Kw5RDQjaoZe03YAClgeS/SWPOcb4nkFBTEi5DUEA==
-
-merge2@^1.3.0, merge2@^1.4.1:
-  version "1.4.1"
-  resolved "https://registry.yarnpkg.com/merge2/-/merge2-1.4.1.tgz#4368892f885e907455a6fd7dc55c0c9d404990ae"
-  integrity sha512-8q7VEgMJW4J8tcfVPy8g09NcQwZdbwFEqhe/WZkoIzjn/3TGDwtOCYtXGxA3O8tPzpczCCDgv+P2P5y00ZJOOg==
-
-micromatch@^4.0.4:
-  version "4.0.5"
-  resolved "https://registry.yarnpkg.com/micromatch/-/micromatch-4.0.5.tgz#bc8999a7cbbf77cdc89f132f6e467051b49090c6"
-  integrity sha512-DMy+ERcEW2q8Z2Po+WNXuw3c5YaUSFjAO5GsJqfEl7UjvtIuFKO6ZrKvcItdy98dwFI2N1tg3zNIdKaQT+aNdA==
-  dependencies:
-    braces "^3.0.2"
-    picomatch "^2.3.1"
-
-mime@^3.0.0:
-  version "3.0.0"
-  resolved "https://registry.yarnpkg.com/mime/-/mime-3.0.0.tgz#b374550dca3a0c18443b0c950a6a58f1931cf7a7"
-  integrity sha512-jSCU7/VB1loIWBZe14aEYHU/+1UMEHoaO7qxCOVJOw9GgH72VAWppxNcjU+x9a2k3GSIBXNKxXQFqRvvZ7vr3A==
-
-min-indent@^1.0.0:
-  version "1.0.1"
-  resolved "https://registry.yarnpkg.com/min-indent/-/min-indent-1.0.1.tgz#a63f681673b30571fbe8bc25686ae746eefa9869"
-  integrity sha512-I9jwMn07Sy/IwOj3zVkVik2JTvgpaykDZEigL6Rx6N9LbMywwUSMtxET+7lVoDLLd3O3IXwJwvuuns8UB/HeAg==
-
-minimatch@^3.0.5, minimatch@^3.1.1, minimatch@^3.1.2:
-  version "3.1.2"
-  resolved "https://registry.yarnpkg.com/minimatch/-/minimatch-3.1.2.tgz#19cd194bfd3e428f049a70817c038d89ab4be35b"
-  integrity sha512-J7p63hRiAjw1NDEww1W7i37+ByIrOWO5XQQAzZ3VOcL0PNybwpfmV/N05zFAzwQ9USyEcX6t3UO+K5aqBQOIHw==
-  dependencies:
-    brace-expansion "^1.1.7"
-
-minimist@^1.2.0, minimist@^1.2.6, minimist@^1.2.8:
-  version "1.2.8"
-  resolved "https://registry.yarnpkg.com/minimist/-/minimist-1.2.8.tgz#c1a464e7693302e082a075cee0c057741ac4772c"
-  integrity sha512-2yyAR8qBkN3YuheJanUpWC5U3bb5osDywNB8RzDVlDwDHbocAJveqqj1u8+SVD7jkWT4yvsHCpWqqWqAxb0zCA==
-
-mkdirp@^0.5.1:
-  version "0.5.6"
-  resolved "https://registry.yarnpkg.com/mkdirp/-/mkdirp-0.5.6.tgz#7def03d2432dcae4ba1d611445c48396062255f6"
-  integrity sha512-FP+p8RB8OWpF3YZBCrP5gtADmtXApB5AMLn+vdyA+PyxCjrCs00mjyUozssO33cwDeT3wNGdLxJ5M//YqtHAJw==
-  dependencies:
-    minimist "^1.2.6"
-
-mlly@^1.2.0:
-  version "1.4.0"
-  resolved "https://registry.yarnpkg.com/mlly/-/mlly-1.4.0.tgz#830c10d63f1f97bd8785377b24dc2a15d972832b"
-  integrity sha512-ua8PAThnTwpprIaU47EPeZ/bPUVp2QYBbWMphUQpVdBI3Lgqzm5KZQ45Agm3YJedHXaIHl6pBGabaLSUPPSptg==
-  dependencies:
-    acorn "^8.9.0"
-    pathe "^1.1.1"
-    pkg-types "^1.0.3"
-    ufo "^1.1.2"
-
-mri@^1.1.0:
-  version "1.2.0"
-  resolved "https://registry.yarnpkg.com/mri/-/mri-1.2.0.tgz#6721480fec2a11a4889861115a48b6cbe7cc8f0b"
-  integrity sha512-tzzskb3bG8LvYGFF/mDTpq3jpI6Q9wc3LEmBaghu+DdCssd1FakN7Bc0hVNmEyGq1bq3RgfkCb3cmQLpNPOroA==
-
-mrmime@^1.0.0:
-  version "1.0.1"
-  resolved "https://registry.yarnpkg.com/mrmime/-/mrmime-1.0.1.tgz#5f90c825fad4bdd41dc914eff5d1a8cfdaf24f27"
-  integrity sha512-hzzEagAgDyoU1Q6yg5uI+AorQgdvMCur3FcKf7NhMKWsaYg+RnbTyHRa/9IlLF9rf455MOCtcqqrQQ83pPP7Uw==
-
-ms@2.1.2:
-  version "2.1.2"
-  resolved "https://registry.yarnpkg.com/ms/-/ms-2.1.2.tgz#d09d1f357b443f493382a8eb3ccd183872ae6009"
-  integrity sha512-sGkPx+VjMtmA6MX27oA4FBFELFCZZ4S4XqeGOXCv68tT+jb3vk/RyaKWP0PTKyWtmLSM0b+adUTEvbs1PEaH2w==
-
-nanoid@^3.3.6:
-  version "3.3.6"
-  resolved "https://registry.yarnpkg.com/nanoid/-/nanoid-3.3.6.tgz#443380c856d6e9f9824267d960b4236ad583ea4c"
-  integrity sha512-BGcqMMJuToF7i1rt+2PWSNVnWIkGCU78jBG3RxO/bZlnZPK2Cmi2QaffxGO/2RvWi9sL+FAiRiXMgsyxQ1DIDA==
-
-natural-compare-lite@^1.4.0:
-  version "1.4.0"
-  resolved "https://registry.yarnpkg.com/natural-compare-lite/-/natural-compare-lite-1.4.0.tgz#17b09581988979fddafe0201e931ba933c96cbb4"
-  integrity sha512-Tj+HTDSJJKaZnfiuw+iaF9skdPpTo2GtEly5JHnWV/hfv2Qj/9RKsGISQtLh2ox3l5EAGw487hnBee0sIJ6v2g==
-
-natural-compare@^1.4.0:
-  version "1.4.0"
-  resolved "https://registry.yarnpkg.com/natural-compare/-/natural-compare-1.4.0.tgz#4abebfeed7541f2c27acfb29bdbbd15c8d5ba4f7"
-  integrity sha512-OWND8ei3VtNC9h7V60qff3SVobHr996CTwgxubgyQYEpg290h9J0buyECNNJexkFm5sOajh5G116RYA1c8ZMSw==
-
-normalize-path@^3.0.0, normalize-path@~3.0.0:
-  version "3.0.0"
-  resolved "https://registry.yarnpkg.com/normalize-path/-/normalize-path-3.0.0.tgz#0dcd69ff23a1c9b11fd0978316644a0388216a65"
-  integrity sha512-6eZs5Ls3WtCisHWp9S2GUy8dqkpGi4BVSz3GaqiE6ezub0512ESztXUwUB6C6IKbQkY2Pnb/mD4WYojCRwcwLA==
-
-once@^1.3.0:
-  version "1.4.0"
-  resolved "https://registry.yarnpkg.com/once/-/once-1.4.0.tgz#583b1aa775961d4b113ac17d9c50baef9dd76bd1"
-  integrity sha512-lNaJgI+2Q5URQBkccEKHTQOPaXdUxnZZElQTZY0MFUAuaEqe1E+Nyvgdz/aIyNi6Z9MzO5dv1H8n58/GELp3+w==
-  dependencies:
-    wrappy "1"
-
-optionator@^0.9.1:
-  version "0.9.3"
-  resolved "https://registry.yarnpkg.com/optionator/-/optionator-0.9.3.tgz#007397d44ed1872fdc6ed31360190f81814e2c64"
-  integrity sha512-JjCoypp+jKn1ttEFExxhetCKeJt9zhAgAve5FXHixTvFDW/5aEktX9bufBKLRRMdU7bNtpLfcGu94B3cdEJgjg==
-  dependencies:
-    "@aashutoshrathi/word-wrap" "^1.2.3"
-    deep-is "^0.1.3"
-    fast-levenshtein "^2.0.6"
-    levn "^0.4.1"
-    prelude-ls "^1.2.1"
-    type-check "^0.4.0"
-
-p-limit@^3.0.2:
-  version "3.1.0"
-  resolved "https://registry.yarnpkg.com/p-limit/-/p-limit-3.1.0.tgz#e1daccbe78d0d1388ca18c64fea38e3e57e3706b"
-  integrity sha512-TYOanM3wGwNGsZN2cVTYPArw454xnXj5qmWF1bEoAc4+cU/ol7GVh7odevjp1FNHduHc3KZMcFduxU5Xc6uJRQ==
-  dependencies:
-    yocto-queue "^0.1.0"
-
-p-limit@^4.0.0:
-  version "4.0.0"
-  resolved "https://registry.yarnpkg.com/p-limit/-/p-limit-4.0.0.tgz#914af6544ed32bfa54670b061cafcbd04984b644"
-  integrity sha512-5b0R4txpzjPWVw/cXXUResoD4hb6U/x9BH08L7nw+GN1sezDzPdxeRvpc9c433fZhBan/wusjbCsqwqm4EIBIQ==
-  dependencies:
-    yocto-queue "^1.0.0"
-
-p-locate@^5.0.0:
-  version "5.0.0"
-  resolved "https://registry.yarnpkg.com/p-locate/-/p-locate-5.0.0.tgz#83c8315c6785005e3bd021839411c9e110e6d834"
-  integrity sha512-LaNjtRWUBY++zB5nE/NwcaoMylSPk+S+ZHNB1TzdbMJMny6dynpAGt7X/tl/QYq3TIeE6nxHppbo2LGymrG5Pw==
-  dependencies:
-    p-limit "^3.0.2"
-
-parent-module@^1.0.0:
-  version "1.0.1"
-  resolved "https://registry.yarnpkg.com/parent-module/-/parent-module-1.0.1.tgz#691d2709e78c79fae3a156622452d00762caaaa2"
-  integrity sha512-GQ2EWRpQV8/o+Aw8YqtfZZPfNRWZYkbidE9k5rpl/hC3vtHHBfGm2Ifi6qWV+coDGkrUKZAxE3Lot5kcsRlh+g==
-  dependencies:
-    callsites "^3.0.0"
-
-path-exists@^4.0.0:
-  version "4.0.0"
-  resolved "https://registry.yarnpkg.com/path-exists/-/path-exists-4.0.0.tgz#513bdbe2d3b95d7762e8c1137efa195c6c61b5b3"
-  integrity sha512-ak9Qy5Q7jYb2Wwcey5Fpvg2KoAc/ZIhLSLOSBmRmygPsGwkVVt0fZa0qrtMz+m6tJTAHfZQ8FnmB4MG4LWy7/w==
-
-path-is-absolute@^1.0.0:
-  version "1.0.1"
-  resolved "https://registry.yarnpkg.com/path-is-absolute/-/path-is-absolute-1.0.1.tgz#174b9268735534ffbc7ace6bf53a5a9e1b5c5f5f"
-  integrity sha512-AVbw3UJ2e9bq64vSaS9Am0fje1Pa8pbGqTTsmXfaIiMpnr5DlDhfJOuLj9Sf95ZPVDAUerDfEk88MPmPe7UCQg==
-
-path-key@^3.1.0:
-  version "3.1.1"
-  resolved "https://registry.yarnpkg.com/path-key/-/path-key-3.1.1.tgz#581f6ade658cbba65a0d3380de7753295054f375"
-  integrity sha512-ojmeN0qd+y0jszEtoY48r0Peq5dwMEkIlCOu6Q5f41lfkswXuKtYrhgoTpLnyIcHm24Uhqx+5Tqm2InSwLhE6Q==
-
-path-type@^4.0.0:
-  version "4.0.0"
-  resolved "https://registry.yarnpkg.com/path-type/-/path-type-4.0.0.tgz#84ed01c0a7ba380afe09d90a8c180dcd9d03043b"
-  integrity sha512-gDKb8aZMDeD/tZWs9P6+q0J9Mwkdl6xMV8TjnGP3qJVJ06bdMgkbBlLU8IdfOsIsFz2BW1rNVT3XuNEl8zPAvw==
-
-pathe@^1.1.0, pathe@^1.1.1:
-  version "1.1.1"
-  resolved "https://registry.yarnpkg.com/pathe/-/pathe-1.1.1.tgz#1dd31d382b974ba69809adc9a7a347e65d84829a"
-  integrity sha512-d+RQGp0MAYTIaDBIMmOfMwz3E+LOZnxx1HZd5R18mmCZY0QBlK0LDZfPc8FW8Ed2DlvsuE6PRjroDY+wg4+j/Q==
-
-pathval@^1.1.1:
-  version "1.1.1"
-  resolved "https://registry.yarnpkg.com/pathval/-/pathval-1.1.1.tgz#8534e77a77ce7ac5a2512ea21e0fdb8fcf6c3d8d"
-  integrity sha512-Dp6zGqpTdETdR63lehJYPeIOqpiNBNtc7BpWSLrOje7UaIsE5aY92r/AunQA7rsXvet3lrJ3JnZX29UPTKXyKQ==
-
-periscopic@^3.1.0:
-  version "3.1.0"
-  resolved "https://registry.yarnpkg.com/periscopic/-/periscopic-3.1.0.tgz#7e9037bf51c5855bd33b48928828db4afa79d97a"
-  integrity sha512-vKiQ8RRtkl9P+r/+oefh25C3fhybptkHKCZSPlcXiJux2tJF55GnEj3BVn4A5gKfq9NWWXXrxkHBwVPUfH0opw==
-  dependencies:
-    "@types/estree" "^1.0.0"
-    estree-walker "^3.0.0"
-    is-reference "^3.0.0"
-
-picocolors@^1.0.0:
-  version "1.0.0"
-  resolved "https://registry.yarnpkg.com/picocolors/-/picocolors-1.0.0.tgz#cb5bdc74ff3f51892236eaf79d68bc44564ab81c"
-  integrity sha512-1fygroTLlHu66zi26VoTDv8yRgm0Fccecssto+MhsZ0D/DGW2sm8E8AjW7NU5VVTRt5GxbeZ5qBuJr+HyLYkjQ==
-
-picomatch@^2.0.4, picomatch@^2.2.1, picomatch@^2.3.1:
-  version "2.3.1"
-  resolved "https://registry.yarnpkg.com/picomatch/-/picomatch-2.3.1.tgz#3ba3833733646d9d3e4995946c1365a67fb07a42"
-  integrity sha512-JU3teHTNjmE2VCGFzuY8EXzCDVwEqB2a8fsIvwaStHhAWJEeVd1o1QD80CU6+ZdEXXSLbSsuLwJjkCBWqRQUVA==
-
-pkg-types@^1.0.3:
-  version "1.0.3"
-  resolved "https://registry.yarnpkg.com/pkg-types/-/pkg-types-1.0.3.tgz#988b42ab19254c01614d13f4f65a2cfc7880f868"
-  integrity sha512-nN7pYi0AQqJnoLPC9eHFQ8AcyaixBUOwvqc5TDnIKCMEE6I0y8P7OKA7fPexsXGCGxQDl/cmrLAp26LhcwxZ4A==
-  dependencies:
-    jsonc-parser "^3.2.0"
-    mlly "^1.2.0"
-    pathe "^1.1.0"
-
-playwright-core@1.35.1:
-  version "1.35.1"
-  resolved "https://registry.yarnpkg.com/playwright-core/-/playwright-core-1.35.1.tgz#52c1e6ffaa6a8c29de1a5bdf8cce0ce290ffb81d"
-  integrity sha512-pNXb6CQ7OqmGDRspEjlxE49w+4YtR6a3X6mT1hZXeJHWmsEz7SunmvZeiG/+y1yyMZdHnnn73WKYdtV1er0Xyg==
-
-postcss@^8.4.23:
-  version "8.4.24"
-  resolved "https://registry.yarnpkg.com/postcss/-/postcss-8.4.24.tgz#f714dba9b2284be3cc07dbd2fc57ee4dc972d2df"
-  integrity sha512-M0RzbcI0sO/XJNucsGjvWU9ERWxb/ytp1w6dKtxTKgixdtQDq4rmx/g8W1hnaheq9jgwL/oyEdH5Bc4WwJKMqg==
-  dependencies:
-    nanoid "^3.3.6"
-    picocolors "^1.0.0"
-    source-map-js "^1.0.2"
-
-prelude-ls@^1.2.1:
-  version "1.2.1"
-  resolved "https://registry.yarnpkg.com/prelude-ls/-/prelude-ls-1.2.1.tgz#debc6489d7a6e6b0e7611888cec880337d316396"
-  integrity sha512-vkcDPrRZo1QZLbn5RLGPpg/WmIQ65qoWWhcGKf/b5eplkkarX0m9z8ppCat4mlOqUsWpyNuYgO3VRyrYHSzX5g==
-
-pretty-format@^27.5.1:
-  version "27.5.1"
-  resolved "https://registry.yarnpkg.com/pretty-format/-/pretty-format-27.5.1.tgz#2181879fdea51a7a5851fb39d920faa63f01d88e"
-  integrity sha512-Qb1gy5OrP5+zDf2Bvnzdl3jsTf1qXVMazbvCoKhtKqVs4/YK4ozX4gKQJJVyNe+cajNPn0KoC0MC3FUmaHWEmQ==
-  dependencies:
-    ansi-regex "^5.0.1"
-    ansi-styles "^5.0.0"
-    react-is "^17.0.1"
-
-punycode@^2.1.0:
-  version "2.3.0"
-  resolved "https://registry.yarnpkg.com/punycode/-/punycode-2.3.0.tgz#f67fa67c94da8f4d0cfff981aee4118064199b8f"
-  integrity sha512-rRV+zQD8tVFys26lAGR9WUuS4iUAngJScM+ZRSKtvl5tKeZ2t5bvdNFdNHBW9FWR4guGHlgmsZ1G7BSm2wTbuA==
-
-queue-microtask@^1.2.2:
-  version "1.2.3"
-  resolved "https://registry.yarnpkg.com/queue-microtask/-/queue-microtask-1.2.3.tgz#4929228bbc724dfac43e0efb058caf7b6cfb6243"
-  integrity sha512-NuaNSa6flKT5JaSYQzJok04JzTL1CA6aGhv5rfLW3PgqA+M2ChpZQnAC8h8i4ZFkBS8X5RqkDBHA7r4hej3K9A==
-
-react-is@^17.0.1:
-  version "17.0.2"
-  resolved "https://registry.yarnpkg.com/react-is/-/react-is-17.0.2.tgz#e691d4a8e9c789365655539ab372762b0efb54f0"
-  integrity sha512-w2GsyukL62IJnlaff/nRegPQR94C/XXamvMWmSHRJ4y7Ts/4ocGRmTHvOs8PSE6pB3dWOrD/nueuU5sduBsQ4w==
-
-readdirp@~3.6.0:
-  version "3.6.0"
-  resolved "https://registry.yarnpkg.com/readdirp/-/readdirp-3.6.0.tgz#74a370bd857116e245b29cc97340cd431a02a6c7"
-  integrity sha512-hOS089on8RduqdbhvQ5Z37A0ESjsqz6qnRcffsMU3495FuTdqSm+7bhJ29JvIOsBDEEnan5DPu9t3To9VRlMzA==
-  dependencies:
-    picomatch "^2.2.1"
-
-resolve-from@^4.0.0:
-  version "4.0.0"
-  resolved "https://registry.yarnpkg.com/resolve-from/-/resolve-from-4.0.0.tgz#4abcd852ad32dd7baabfe9b40e00a36db5f392e6"
-  integrity sha512-pb/MYmXstAkysRFx8piNI1tGFNQIFA3vkE3Gq4EuA1dF6gHp/+vgZqsCGJapvy8N3Q+4o7FwvquPJcnZ7RYy4g==
-
-reusify@^1.0.4:
-  version "1.0.4"
-  resolved "https://registry.yarnpkg.com/reusify/-/reusify-1.0.4.tgz#90da382b1e126efc02146e90845a88db12925d76"
-  integrity sha512-U9nH88a3fc/ekCF1l0/UP1IosiuIjyTh7hBvXVMHYgVcfGvt897Xguj2UOLDeI5BG2m7/uwyaLVT6fbtCwTyzw==
-
-rimraf@^2.5.2:
-  version "2.7.1"
-  resolved "https://registry.yarnpkg.com/rimraf/-/rimraf-2.7.1.tgz#35797f13a7fdadc566142c29d4f07ccad483e3ec"
-  integrity sha512-uWjbaKIK3T1OSVptzX7Nl6PvQ3qAGtKEtVRjRuazjfL3Bx5eI409VZSqgND+4UNnmzLVdPj9FqFJNPqBZFve4w==
-  dependencies:
-    glob "^7.1.3"
-
-rimraf@^3.0.2:
-  version "3.0.2"
-  resolved "https://registry.yarnpkg.com/rimraf/-/rimraf-3.0.2.tgz#f1a5402ba6220ad52cc1282bac1ae3aa49fd061a"
-  integrity sha512-JZkJMZkAGFFPP2YqXZXPbMlMBgsxzE8ILs4lMIX/2o0L9UBw9O/Y3o6wFw/i9YLapcUJWwqbi3kdxIPdC62TIA==
-  dependencies:
-    glob "^7.1.3"
-
-rollup@^3.21.0:
-  version "3.26.0"
-  resolved "https://registry.yarnpkg.com/rollup/-/rollup-3.26.0.tgz#9f2e0316a4ca641911cefd8515c562a9124e6130"
-  integrity sha512-YzJH0eunH2hr3knvF3i6IkLO/jTjAEwU4HoMUbQl4//Tnl3ou0e7P5SjxdDr8HQJdeUJShlbEHXrrnEHy1l7Yg==
-  optionalDependencies:
-    fsevents "~2.3.2"
-
-run-parallel@^1.1.9:
-  version "1.2.0"
-  resolved "https://registry.yarnpkg.com/run-parallel/-/run-parallel-1.2.0.tgz#66d1368da7bdf921eb9d95bd1a9229e7f21a43ee"
-  integrity sha512-5l4VyZR86LZ/lDxZTR6jqL8AFE2S0IFLMP26AbjsLVADxHdhB/c0GUsH+y39UfCi3dzz8OlQuPmnaJOMoDHQBA==
-  dependencies:
-    queue-microtask "^1.2.2"
-
-sade@^1.7.4, sade@^1.8.1:
-  version "1.8.1"
-  resolved "https://registry.yarnpkg.com/sade/-/sade-1.8.1.tgz#0a78e81d658d394887be57d2a409bf703a3b2701"
-  integrity sha512-xal3CZX1Xlo/k4ApwCFrHVACi9fBqJ7V+mwhBsuf/1IOKbBy098Fex+Wa/5QMubw09pSZ/u8EY8PWgevJsXp1A==
-  dependencies:
-    mri "^1.1.0"
-
-sander@^0.5.0:
-  version "0.5.1"
-  resolved "https://registry.yarnpkg.com/sander/-/sander-0.5.1.tgz#741e245e231f07cafb6fdf0f133adfa216a502ad"
-  integrity sha512-3lVqBir7WuKDHGrKRDn/1Ye3kwpXaDOMsiRP1wd6wpZW56gJhsbp5RqQpA6JG/P+pkXizygnr1dKR8vzWaVsfA==
-  dependencies:
-    es6-promise "^3.1.2"
-    graceful-fs "^4.1.3"
-    mkdirp "^0.5.1"
-    rimraf "^2.5.2"
-
-sass@^1.58.2:
-  version "1.63.6"
-  resolved "https://registry.yarnpkg.com/sass/-/sass-1.63.6.tgz#481610e612902e0c31c46b46cf2dad66943283ea"
-  integrity sha512-MJuxGMHzaOW7ipp+1KdELtqKbfAWbH7OLIdoSMnVe3EXPMTmxTmlaZDCTsgIpPCs3w99lLo9/zDKkOrJuT5byw==
-  dependencies:
-    chokidar ">=3.0.0 <4.0.0"
-    immutable "^4.0.0"
-    source-map-js ">=0.6.2 <2.0.0"
-
-semver@^7.3.2, semver@^7.3.7:
-  version "7.5.3"
-  resolved "https://registry.yarnpkg.com/semver/-/semver-7.5.3.tgz#161ce8c2c6b4b3bdca6caadc9fa3317a4c4fe88e"
-  integrity sha512-QBlUtyVk/5EeHbi7X0fw6liDZc7BBmEaSYn01fMU1OUYbf6GPsbTtd8WmnqbI20SeycoHSeiybkE/q1Q+qlThQ==
-  dependencies:
-    lru-cache "^6.0.0"
-
-set-cookie-parser@^2.6.0:
-  version "2.6.0"
-  resolved "https://registry.yarnpkg.com/set-cookie-parser/-/set-cookie-parser-2.6.0.tgz#131921e50f62ff1a66a461d7d62d7b21d5d15a51"
-  integrity sha512-RVnVQxTXuerk653XfuliOxBP81Sf0+qfQE73LIYKcyMYHG94AuH0kgrQpRDuTZnSmjpysHmzxJXKNfa6PjFhyQ==
-
-shebang-command@^2.0.0:
-  version "2.0.0"
-  resolved "https://registry.yarnpkg.com/shebang-command/-/shebang-command-2.0.0.tgz#ccd0af4f8835fbdc265b82461aaf0c36663f34ea"
-  integrity sha512-kHxr2zZpYtdmrN1qDjrrX/Z1rR1kG8Dx+gkpK1G4eXmvXswmcE1hTWBWYUzlraYw1/yZp6YuDY77YtvbN0dmDA==
-  dependencies:
-    shebang-regex "^3.0.0"
-
-shebang-regex@^3.0.0:
-  version "3.0.0"
-  resolved "https://registry.yarnpkg.com/shebang-regex/-/shebang-regex-3.0.0.tgz#ae16f1644d873ecad843b0307b143362d4c42172"
-  integrity sha512-7++dFhtcx3353uBaq8DDR4NuxBetBzC7ZQOhmTQInHEd6bSrXdiEyzCvG07Z44UYdLShWUyXt5M/yhz8ekcb1A==
-
-siginfo@^2.0.0:
-  version "2.0.0"
-  resolved "https://registry.yarnpkg.com/siginfo/-/siginfo-2.0.0.tgz#32e76c70b79724e3bb567cb9d543eb858ccfaf30"
-  integrity sha512-ybx0WO1/8bSBLEWXZvEd7gMW3Sn3JFlW3TvX1nREbDLRNQNaeNN8WK0meBwPdAaOI7TtRRRJn/Es1zhrrCHu7g==
-
-sirv@^2.0.2:
-  version "2.0.3"
-  resolved "https://registry.yarnpkg.com/sirv/-/sirv-2.0.3.tgz#ca5868b87205a74bef62a469ed0296abceccd446"
-  integrity sha512-O9jm9BsID1P+0HOi81VpXPoDxYP374pkOLzACAoyUQ/3OUVndNpsz6wMnY2z+yOxzbllCKZrM+9QrWsv4THnyA==
-  dependencies:
-    "@polka/url" "^1.0.0-next.20"
-    mrmime "^1.0.0"
-    totalist "^3.0.0"
-
-slash@^3.0.0:
-  version "3.0.0"
-  resolved "https://registry.yarnpkg.com/slash/-/slash-3.0.0.tgz#6539be870c165adbd5240220dbe361f1bc4d4634"
-  integrity sha512-g9Q1haeby36OSStwb4ntCGGGaKsaVSjQ68fBxoQcutl5fS1vuY18H3wSt3jFyFtrkx+Kz0V1G85A4MyAdDMi2Q==
-
-sorcery@^0.11.0:
-  version "0.11.0"
-  resolved "https://registry.yarnpkg.com/sorcery/-/sorcery-0.11.0.tgz#310c80ee993433854bb55bb9aa4003acd147fca8"
-  integrity sha512-J69LQ22xrQB1cIFJhPfgtLuI6BpWRiWu1Y3vSsIwK/eAScqJxd/+CJlUuHQRdX2C9NGFamq+KqNywGgaThwfHw==
-  dependencies:
-    "@jridgewell/sourcemap-codec" "^1.4.14"
-    buffer-crc32 "^0.2.5"
-    minimist "^1.2.0"
-    sander "^0.5.0"
-
-"source-map-js@>=0.6.2 <2.0.0", source-map-js@^1.0.1, source-map-js@^1.0.2:
-  version "1.0.2"
-  resolved "https://registry.yarnpkg.com/source-map-js/-/source-map-js-1.0.2.tgz#adbc361d9c62df380125e7f161f71c826f1e490c"
-  integrity sha512-R0XvVJ9WusLiqTCEiGCmICCMplcCkIwwR11mOSD9CR5u+IXYdiseeEuXCVAjS54zqwkLcPNnmU4OeJ6tUrWhDw==
-
-source-map-support@~0.5.20:
-  version "0.5.21"
-  resolved "https://registry.yarnpkg.com/source-map-support/-/source-map-support-0.5.21.tgz#04fe7c7f9e1ed2d662233c28cb2b35b9f63f6e4f"
-  integrity sha512-uBHU3L3czsIyYXKX88fdrGovxdSCoTGDRZ6SYXtSRxLZUzHg5P/66Ht6uoUlHu9EZod+inXhKo3qQgwXUT/y1w==
-  dependencies:
-    buffer-from "^1.0.0"
-    source-map "^0.6.0"
-
-source-map@^0.6.0, source-map@^0.6.1:
-  version "0.6.1"
-  resolved "https://registry.yarnpkg.com/source-map/-/source-map-0.6.1.tgz#74722af32e9614e9c287a8d0bbde48b5e2f1a263"
-  integrity sha512-UjgapumWlbMhkBgzT7Ykc5YXUT46F0iKu8SGXq0bcwP5dz/h0Plj6enJqjz1Zbq2l5WaqYnrVbwWOWMyF3F47g==
-
-sprintf-js@~1.0.2:
-  version "1.0.3"
-  resolved "https://registry.yarnpkg.com/sprintf-js/-/sprintf-js-1.0.3.tgz#04e6926f662895354f3dd015203633b857297e2c"
-  integrity sha512-D9cPgkvLlV3t3IzL0D0YLvGA9Ahk4PcvVwUbN0dSGr1aP0Nrt4AEnTUbuGvquEC0mA64Gqt1fzirlRs5ibXx8g==
-
-stackback@0.0.2:
-  version "0.0.2"
-  resolved "https://registry.yarnpkg.com/stackback/-/stackback-0.0.2.tgz#1ac8a0d9483848d1695e418b6d031a3c3ce68e3b"
-  integrity sha512-1XMJE5fQo1jGH6Y/7ebnwPOBEkIEnT4QF32d5R1+VXdXveM0IBMJt8zfaxX1P3QhVwrYe+576+jkANtSS2mBbw==
-
-std-env@^3.3.2:
-  version "3.3.3"
-  resolved "https://registry.yarnpkg.com/std-env/-/std-env-3.3.3.tgz#a54f06eb245fdcfef53d56f3c0251f1d5c3d01fe"
-  integrity sha512-Rz6yejtVyWnVjC1RFvNmYL10kgjC49EOghxWn0RFqlCHGFpQx+Xe7yW3I4ceK1SGrWIGMjD5Kbue8W/udkbMJg==
-
-streamsearch@^1.1.0:
-  version "1.1.0"
-  resolved "https://registry.yarnpkg.com/streamsearch/-/streamsearch-1.1.0.tgz#404dd1e2247ca94af554e841a8ef0eaa238da764"
-  integrity sha512-Mcc5wHehp9aXz1ax6bZUyY5afg9u2rv5cqQI3mRrYkGC8rW2hM02jWuwjtL++LS5qinSyhj2QfLyNsuc+VsExg==
-
-strip-ansi@^6.0.1:
-  version "6.0.1"
-  resolved "https://registry.yarnpkg.com/strip-ansi/-/strip-ansi-6.0.1.tgz#9e26c63d30f53443e9489495b2105d37b67a85d9"
-  integrity sha512-Y38VPSHcqkFrCpFnQ9vuSXmquuv5oXOKpGeT6aGrr3o3Gc9AlVa6JBfUSOCnbxGGZF+/0ooI7KrPuUSztUdU5A==
-  dependencies:
-    ansi-regex "^5.0.1"
-
-strip-indent@^3.0.0:
-  version "3.0.0"
-  resolved "https://registry.yarnpkg.com/strip-indent/-/strip-indent-3.0.0.tgz#c32e1cee940b6b3432c771bc2c54bcce73cd3001"
-  integrity sha512-laJTa3Jb+VQpaC6DseHhF7dXVqHTfJPCRDaEbid/drOhgitgYku/letMUqOXFoWV0zIIUbjpdH2t+tYj4bQMRQ==
-  dependencies:
-    min-indent "^1.0.0"
-
-strip-json-comments@^3.1.0, strip-json-comments@^3.1.1:
-  version "3.1.1"
-  resolved "https://registry.yarnpkg.com/strip-json-comments/-/strip-json-comments-3.1.1.tgz#31f1281b3832630434831c310c01cccda8cbe006"
-  integrity sha512-6fPc+R4ihwqP6N/aIv2f1gMH8lOVtWQHoqC4yK6oSDVVocumAsfCqjkXnqiYMhmMwS/mEHLp7Vehlt3ql6lEig==
-
-strip-literal@^1.0.1:
-  version "1.0.1"
-  resolved "https://registry.yarnpkg.com/strip-literal/-/strip-literal-1.0.1.tgz#0115a332710c849b4e46497891fb8d585e404bd2"
-  integrity sha512-QZTsipNpa2Ppr6v1AmJHESqJ3Uz247MUS0OjrnnZjFAvEoWqxuyFuXn2xLgMtRnijJShAa1HL0gtJyUs7u7n3Q==
-  dependencies:
-    acorn "^8.8.2"
-
-style-mod@^4.0.0:
-  version "4.0.3"
-  resolved "https://registry.yarnpkg.com/style-mod/-/style-mod-4.0.3.tgz#136c4abc905f82a866a18b39df4dc08ec762b1ad"
-  integrity sha512-78Jv8kYJdjbvRwwijtCevYADfsI0lGzYJe4mMFdceO8l75DFFDoqBhR1jVDicDRRaX4//g1u9wKeo+ztc2h1Rw==
-
-supports-color@^7.1.0:
-  version "7.2.0"
-  resolved "https://registry.yarnpkg.com/supports-color/-/supports-color-7.2.0.tgz#1b7dcdcb32b8138801b3e478ba6a51caa89648da"
-  integrity sha512-qpCAvRl9stuOHveKsn7HncJRvv501qIacKzQlO/+Lwxc9+0q2wLyv4Dfvt80/DPn2pqOBsJdDiogXGR9+OvwRw==
-  dependencies:
-    has-flag "^4.0.0"
-
-svelte-check@^3.0.1:
-  version "3.4.4"
-  resolved "https://registry.yarnpkg.com/svelte-check/-/svelte-check-3.4.4.tgz#201850747f8b5ec3b104f69a69a034b1a742a40f"
-  integrity sha512-Uys9+R65cj8TmP8f5UpS7B2xKpNLYNxEWJsA5ZoKcWq/uwvABFF7xS6iPQGLoa7hxz0DS6xU60YFpmq06E4JxA==
-  dependencies:
-    "@jridgewell/trace-mapping" "^0.3.17"
-    chokidar "^3.4.1"
-    fast-glob "^3.2.7"
-    import-fresh "^3.2.1"
-    picocolors "^1.0.0"
-    sade "^1.7.4"
-    svelte-preprocess "^5.0.3"
-    typescript "^5.0.3"
-
-svelte-codemirror-editor@^1.1.0:
-  version "1.1.0"
-  resolved "https://registry.yarnpkg.com/svelte-codemirror-editor/-/svelte-codemirror-editor-1.1.0.tgz#97796abb60bb22241f3e69708ba096d73894496f"
-  integrity sha512-wFdMIsZds5qzn3x2NbFUxDVU6Cn3rwFdq0035ypaFVgzTjJ90bnPm6IbrFA4OJz1ngIyfbIuPAPDjm7rJIr0gg==
-
-svelte-hmr@^0.15.2:
-  version "0.15.2"
-  resolved "https://registry.yarnpkg.com/svelte-hmr/-/svelte-hmr-0.15.2.tgz#d2f6fc82e040f2734abd54cea5cbef46828f2538"
-  integrity sha512-q/bAruCvFLwvNbeE1x3n37TYFb3mTBJ6TrCq6p2CoFbSTNhDE9oAtEfpy+wmc9So8AG0Tja+X0/mJzX9tSfvIg==
-
-svelte-preprocess@^5.0.3:
-  version "5.0.4"
-  resolved "https://registry.yarnpkg.com/svelte-preprocess/-/svelte-preprocess-5.0.4.tgz#2123898e079a074f7f4ef1799e10e037f5bcc55b"
-  integrity sha512-ABia2QegosxOGsVlsSBJvoWeXy1wUKSfF7SWJdTjLAbx/Y3SrVevvvbFNQqrSJw89+lNSsM58SipmZJ5SRi5iw==
-  dependencies:
-    "@types/pug" "^2.0.6"
-    detect-indent "^6.1.0"
-    magic-string "^0.27.0"
-    sorcery "^0.11.0"
-    strip-indent "^3.0.0"
-
-svelte-sitemap@^2.6.0:
-  version "2.6.0"
-  resolved "https://registry.yarnpkg.com/svelte-sitemap/-/svelte-sitemap-2.6.0.tgz#90723cf8bb300543d450a9b63367baa2746efef6"
-  integrity sha512-WcwsuIeo8iJFG9a5cgvXwXEGoyjk6Zowb6JmL5BbwfnFXMzakGa1+mQjthw5Ni3UV/gGbE0PgJvc7Ygir3LmFg==
-  dependencies:
-    fast-glob "^3.2.12"
-    minimist "^1.2.8"
-    xmlbuilder2 "^3.0.2"
-
-svelte@^4.0.0:
-  version "4.0.1"
-  resolved "https://registry.yarnpkg.com/svelte/-/svelte-4.0.1.tgz#5c01f5f7cb05ac21ffe3a741e0c942972dc47c05"
-  integrity sha512-7n2u7A5cu8xCY6MBiXh/Mg6Lh3+Mw2qXlTDBYhzvCvmSM4L4gc4MVo540UtGcjqBiA48E1VDW+EUpBr7iuBlPg==
-  dependencies:
-    "@ampproject/remapping" "^2.2.1"
-    "@jridgewell/sourcemap-codec" "^1.4.15"
-    "@jridgewell/trace-mapping" "^0.3.18"
-    acorn "^8.9.0"
-    aria-query "^5.3.0"
-    axobject-query "^3.2.1"
-    code-red "^1.0.3"
-    css-tree "^2.3.1"
-    estree-walker "^3.0.3"
-    is-reference "^3.0.1"
-    locate-character "^3.0.0"
-    magic-string "^0.30.0"
-    periscopic "^3.1.0"
-
-terser@^5.16.3:
-  version "5.18.2"
-  resolved "https://registry.yarnpkg.com/terser/-/terser-5.18.2.tgz#ff3072a0faf21ffd38f99acc9a0ddf7b5f07b948"
-  integrity sha512-Ah19JS86ypbJzTzvUCX7KOsEIhDaRONungA4aYBjEP3JZRf4ocuDzTg4QWZnPn9DEMiMYGJPiSOy7aykoCc70w==
-  dependencies:
-    "@jridgewell/source-map" "^0.3.3"
-    acorn "^8.8.2"
-    commander "^2.20.0"
-    source-map-support "~0.5.20"
-
-text-table@^0.2.0:
-  version "0.2.0"
-  resolved "https://registry.yarnpkg.com/text-table/-/text-table-0.2.0.tgz#7f5ee823ae805207c00af2df4a84ec3fcfa570b4"
-  integrity sha512-N+8UisAXDGk8PFXP4HAzVR9nbfmVJ3zYLAWiTIoqC5v5isinhr+r5uaO8+7r3BMfuNIufIsA7RdpVgacC2cSpw==
-
-time-zone@^1.0.0:
-  version "1.0.0"
-  resolved "https://registry.yarnpkg.com/time-zone/-/time-zone-1.0.0.tgz#99c5bf55958966af6d06d83bdf3800dc82faec5d"
-  integrity sha512-TIsDdtKo6+XrPtiTm1ssmMngN1sAhyKnTO2kunQWqNPWIVvCm15Wmw4SWInwTVgJ5u/Tr04+8Ei9TNcw4x4ONA==
-
-tinybench@^2.5.0:
-  version "2.5.0"
-  resolved "https://registry.yarnpkg.com/tinybench/-/tinybench-2.5.0.tgz#4711c99bbf6f3e986f67eb722fed9cddb3a68ba5"
-  integrity sha512-kRwSG8Zx4tjF9ZiyH4bhaebu+EDz1BOx9hOigYHlUW4xxI/wKIUQUqo018UlU4ar6ATPBsaMrdbKZ+tmPdohFA==
-
-tinypool@^0.5.0:
-  version "0.5.0"
-  resolved "https://registry.yarnpkg.com/tinypool/-/tinypool-0.5.0.tgz#3861c3069bf71e4f1f5aa2d2e6b3aaacc278961e"
-  integrity sha512-paHQtnrlS1QZYKF/GnLoOM/DN9fqaGOFbCbxzAhwniySnzl9Ebk8w73/dd34DAhe/obUbPAOldTyYXQZxnPBPQ==
-
-tinyspy@^2.1.0:
-  version "2.1.1"
-  resolved "https://registry.yarnpkg.com/tinyspy/-/tinyspy-2.1.1.tgz#9e6371b00c259e5c5b301917ca18c01d40ae558c"
-  integrity sha512-XPJL2uSzcOyBMky6OFrusqWlzfFrXtE0hPuMgW8A2HmaqrPo4ZQHRN/V0QXN3FSjKxpsbRrFc5LI7KOwBsT1/w==
-
-to-regex-range@^5.0.1:
-  version "5.0.1"
-  resolved "https://registry.yarnpkg.com/to-regex-range/-/to-regex-range-5.0.1.tgz#1648c44aae7c8d988a326018ed72f5b4dd0392e4"
-  integrity sha512-65P7iz6X5yEr1cwcgvQxbbIw7Uk3gOy5dIdtZ4rDveLqhrdJP+Li/Hx6tyK0NEb+2GCyneCMJiGqrADCSNk8sQ==
-  dependencies:
-    is-number "^7.0.0"
-
-totalist@^3.0.0:
-  version "3.0.1"
-  resolved "https://registry.yarnpkg.com/totalist/-/totalist-3.0.1.tgz#ba3a3d600c915b1a97872348f79c127475f6acf8"
-  integrity sha512-sf4i37nQ2LBx4m3wB74y+ubopq6W/dIzXg0FDGjsYnZHVa1Da8FH853wlL2gtUhg+xJXjfk3kUZS3BRoQeoQBQ==
-
-tslib@^1.8.1:
-  version "1.14.1"
-  resolved "https://registry.yarnpkg.com/tslib/-/tslib-1.14.1.tgz#cf2d38bdc34a134bcaf1091c41f6619e2f672d00"
-  integrity sha512-Xni35NKzjgMrwevysHTCArtLDpPvye8zV/0E4EyYn43P7/7qvQwPh9BGkHewbMulVntbigmcT7rdX3BNo9wRJg==
-
-tslib@^2.4.1:
-  version "2.6.0"
-  resolved "https://registry.yarnpkg.com/tslib/-/tslib-2.6.0.tgz#b295854684dbda164e181d259a22cd779dcd7bc3"
-  integrity sha512-7At1WUettjcSRHXCyYtTselblcHl9PJFFVKiCAy/bY97+BPZXSQ2wbq0P9s8tK2G7dFQfNnlJnPAiArVBVBsfA==
-
-tsutils@^3.21.0:
-  version "3.21.0"
-  resolved "https://registry.yarnpkg.com/tsutils/-/tsutils-3.21.0.tgz#b48717d394cea6c1e096983eed58e9d61715b623"
-  integrity sha512-mHKK3iUXL+3UF6xL5k0PEhKRUBKPBCv/+RkEOpjRWxxx27KKRBmmA60A9pgOUvMi8GKhRMPEmjBRPzs2W7O1OA==
-  dependencies:
-    tslib "^1.8.1"
-
-type-check@^0.4.0, type-check@~0.4.0:
-  version "0.4.0"
-  resolved "https://registry.yarnpkg.com/type-check/-/type-check-0.4.0.tgz#07b8203bfa7056c0657050e3ccd2c37730bab8f1"
-  integrity sha512-XleUoc9uwGXqjWwXaUTZAmzMcFZ5858QA2vvx1Ur5xIcixXIP+8LnFDgRplU30us6teqdlskFfu+ae4K79Ooew==
-  dependencies:
-    prelude-ls "^1.2.1"
-
-type-detect@^4.0.0, type-detect@^4.0.5:
-  version "4.0.8"
-  resolved "https://registry.yarnpkg.com/type-detect/-/type-detect-4.0.8.tgz#7646fb5f18871cfbb7749e69bd39a6388eb7450c"
-  integrity sha512-0fr/mIH1dlO+x7TlcMy+bIDqKPsw/70tVyeHW787goQjhmqaZe10uwLujubK9q9Lg6Fiho1KUKDYz0Z7k7g5/g==
-
-type-fest@^0.20.2:
-  version "0.20.2"
-  resolved "https://registry.yarnpkg.com/type-fest/-/type-fest-0.20.2.tgz#1bf207f4b28f91583666cb5fbd327887301cd5f4"
-  integrity sha512-Ne+eE4r0/iWnpAxD852z3A+N0Bt5RN//NjJwRd2VFHEmrywxf5vsZlh4R6lixl6B+wz/8d+maTSAkN1FIkI3LQ==
-
-typescript@^5.0.0, typescript@^5.0.3:
-  version "5.1.6"
-  resolved "https://registry.yarnpkg.com/typescript/-/typescript-5.1.6.tgz#02f8ac202b6dad2c0dd5e0913745b47a37998274"
-  integrity sha512-zaWCozRZ6DLEWAWFrVDz1H6FVXzUSfTy5FUMWsQlU8Ym5JP9eO4xkTIROFCQvhQf61z6O/G6ugw3SgAnvvm+HA==
-
-ufo@^1.1.2:
-  version "1.1.2"
-  resolved "https://registry.yarnpkg.com/ufo/-/ufo-1.1.2.tgz#d0d9e0fa09dece0c31ffd57bd363f030a35cfe76"
-  integrity sha512-TrY6DsjTQQgyS3E3dBaOXf0TpPD8u9FVrVYmKVegJuFw51n/YB9XPt+U6ydzFG5ZIN7+DIjPbNmXoBj9esYhgQ==
-
-undici@~5.22.0:
-  version "5.22.1"
-  resolved "https://registry.yarnpkg.com/undici/-/undici-5.22.1.tgz#877d512effef2ac8be65e695f3586922e1a57d7b"
-  integrity sha512-Ji2IJhFXZY0x/0tVBXeQwgPlLWw13GVzpsWPQ3rV50IFMMof2I55PZZxtm4P6iNq+L5znYN9nSTAq0ZyE6lSJw==
-  dependencies:
-    busboy "^1.6.0"
-
-uri-js@^4.2.2:
-  version "4.4.1"
-  resolved "https://registry.yarnpkg.com/uri-js/-/uri-js-4.4.1.tgz#9b1a52595225859e55f669d928f88c6c57f2a77e"
-  integrity sha512-7rKUyy33Q1yc98pQ1DAmLtwX109F7TIfWlW1Ydo8Wl1ii1SeHieeh0HHfPeL2fMXK6z0s8ecKs9frCuLJvndBg==
-  dependencies:
-    punycode "^2.1.0"
-
-vite-node@0.32.2:
-  version "0.32.2"
-  resolved "https://registry.yarnpkg.com/vite-node/-/vite-node-0.32.2.tgz#bfccdfeb708b2309ea9e5fe424951c75bb9c0096"
-  integrity sha512-dTQ1DCLwl2aEseov7cfQ+kDMNJpM1ebpyMMMwWzBvLbis8Nla/6c9WQcqpPssTwS6Rp/+U6KwlIj8Eapw4bLdA==
-  dependencies:
-    cac "^6.7.14"
-    debug "^4.3.4"
-    mlly "^1.2.0"
-    pathe "^1.1.0"
-    picocolors "^1.0.0"
-    vite "^3.0.0 || ^4.0.0"
-
-"vite@^3.0.0 || ^4.0.0", vite@^4.0.0:
-  version "4.3.9"
-  resolved "https://registry.yarnpkg.com/vite/-/vite-4.3.9.tgz#db896200c0b1aa13b37cdc35c9e99ee2fdd5f96d"
-  integrity sha512-qsTNZjO9NoJNW7KnOrgYwczm0WctJ8m/yqYAMAK9Lxt4SoySUfS5S8ia9K7JHpa3KEeMfyF8LoJ3c5NeBJy6pg==
-  dependencies:
-    esbuild "^0.17.5"
-    postcss "^8.4.23"
-    rollup "^3.21.0"
-  optionalDependencies:
-    fsevents "~2.3.2"
-
-vitefu@^0.2.4:
-  version "0.2.4"
-  resolved "https://registry.yarnpkg.com/vitefu/-/vitefu-0.2.4.tgz#212dc1a9d0254afe65e579351bed4e25d81e0b35"
-  integrity sha512-fanAXjSaf9xXtOOeno8wZXIhgia+CZury481LsDaV++lSvcU2R9Ch2bPh3PYFyoHW+w9LqAeYRISVQjUIew14g==
-
-vitest@^0.32.0:
-  version "0.32.2"
-  resolved "https://registry.yarnpkg.com/vitest/-/vitest-0.32.2.tgz#758ce2220f609e240ac054eca7ad11a5140679ab"
-  integrity sha512-hU8GNNuQfwuQmqTLfiKcqEhZY72Zxb7nnN07koCUNmntNxbKQnVbeIS6sqUgR3eXSlbOpit8+/gr1KpqoMgWCQ==
-  dependencies:
-    "@types/chai" "^4.3.5"
-    "@types/chai-subset" "^1.3.3"
-    "@types/node" "*"
-    "@vitest/expect" "0.32.2"
-    "@vitest/runner" "0.32.2"
-    "@vitest/snapshot" "0.32.2"
-    "@vitest/spy" "0.32.2"
-    "@vitest/utils" "0.32.2"
-    acorn "^8.8.2"
-    acorn-walk "^8.2.0"
-    cac "^6.7.14"
-    chai "^4.3.7"
-    concordance "^5.0.4"
-    debug "^4.3.4"
-    local-pkg "^0.4.3"
-    magic-string "^0.30.0"
-    pathe "^1.1.0"
-    picocolors "^1.0.0"
-    std-env "^3.3.2"
-    strip-literal "^1.0.1"
-    tinybench "^2.5.0"
-    tinypool "^0.5.0"
-    vite "^3.0.0 || ^4.0.0"
-    vite-node "0.32.2"
-    why-is-node-running "^2.2.2"
-
-w3c-keyname@^2.2.4:
-  version "2.2.8"
-  resolved "https://registry.yarnpkg.com/w3c-keyname/-/w3c-keyname-2.2.8.tgz#7b17c8c6883d4e8b86ac8aba79d39e880f8869c5"
-  integrity sha512-dpojBhNsCNN7T82Tm7k26A6G9ML3NkhDsnw9n/eoxSRlVBB4CEtIQ/KTCLI2Fwf3ataSXRhYFkQi3SlnFwPvPQ==
-
-well-known-symbols@^2.0.0:
-  version "2.0.0"
-  resolved "https://registry.yarnpkg.com/well-known-symbols/-/well-known-symbols-2.0.0.tgz#e9c7c07dbd132b7b84212c8174391ec1f9871ba5"
-  integrity sha512-ZMjC3ho+KXo0BfJb7JgtQ5IBuvnShdlACNkKkdsqBmYw3bPAaJfPeYUo6tLUaT5tG/Gkh7xkpBhKRQ9e7pyg9Q==
-
-which@^2.0.1:
-  version "2.0.2"
-  resolved "https://registry.yarnpkg.com/which/-/which-2.0.2.tgz#7c6a8dd0a636a0327e10b59c9286eee93f3f51b1"
-  integrity sha512-BLI3Tl1TW3Pvl70l3yq3Y64i+awpwXqsGBYWkkqMtnbXgrMD+yj7rhW0kuEDxzJaYXGjEW5ogapKNMEKNMjibA==
-  dependencies:
-    isexe "^2.0.0"
-
-why-is-node-running@^2.2.2:
-  version "2.2.2"
-  resolved "https://registry.yarnpkg.com/why-is-node-running/-/why-is-node-running-2.2.2.tgz#4185b2b4699117819e7154594271e7e344c9973e"
-  integrity sha512-6tSwToZxTOcotxHeA+qGCq1mVzKR3CwcJGmVcY+QE8SHy6TnpFnh8PAvPNHYr7EcuVeG0QSMxtYCuO1ta/G/oA==
-  dependencies:
-    siginfo "^2.0.0"
-    stackback "0.0.2"
-
-wrappy@1:
-  version "1.0.2"
-  resolved "https://registry.yarnpkg.com/wrappy/-/wrappy-1.0.2.tgz#b5243d8f3ec1aa35f1364605bc0d1036e30ab69f"
-  integrity sha512-l4Sp/DRseor9wL6EvV2+TuQn63dMkPjZ/sp9XkghTEbV9KlPS1xUsZ3u7/IQO4wxtcFB4bgpQPRcR3QCvezPcQ==
-
-xmlbuilder2@^3.0.2:
-  version "3.1.1"
-  resolved "https://registry.yarnpkg.com/xmlbuilder2/-/xmlbuilder2-3.1.1.tgz#b977ef8a6fb27a1ea7ffa7d850d2c007ff343bc0"
-  integrity sha512-WCSfbfZnQDdLQLiMdGUQpMxxckeQ4oZNMNhLVkcekTu7xhD4tuUDyAPoY8CwXvBYE6LwBHd6QW2WZXlOWr1vCw==
-  dependencies:
-    "@oozcitak/dom" "1.15.10"
-    "@oozcitak/infra" "1.0.8"
-    "@oozcitak/util" "8.3.8"
-    js-yaml "3.14.1"
-
-yallist@^4.0.0:
-  version "4.0.0"
-  resolved "https://registry.yarnpkg.com/yallist/-/yallist-4.0.0.tgz#9bb92790d9c0effec63be73519e11a35019a3a72"
-  integrity sha512-3wdGidZyq5PB084XLES5TpOSRA3wjXAlIWMhum2kRcv/41Sn2emQ0dycQW4uZXLejwKvg6EsvbdlVL+FYEct7A==
-
-yocto-queue@^0.1.0:
-  version "0.1.0"
-  resolved "https://registry.yarnpkg.com/yocto-queue/-/yocto-queue-0.1.0.tgz#0294eb3dee05028d31ee1a5fa2c556a6aaf10a1b"
-  integrity sha512-rVksvsnNCdJ/ohGc6xgPwyN8eheCxsiLM8mxuE/t/mOVqJewPuO1miLpTHQiRgTKCLexL4MeAFVagts7HmNZ2Q==
-
-yocto-queue@^1.0.0:
-  version "1.0.0"
-  resolved "https://registry.yarnpkg.com/yocto-queue/-/yocto-queue-1.0.0.tgz#7f816433fb2cbc511ec8bf7d263c3b58a1a3c251"
-  integrity sha512-9bnSc/HEW2uRy67wc+T8UwauLuPJVn28jb+GtJY16iiKWyvmYJRXVT4UamsAEGQfPohgr2q4Tq0sQbQlxTfi1g==

From 97bec46b467ee4b23760b76feb2fead882fe3e49 Mon Sep 17 00:00:00 2001
From: blumed <cullan.luther@gmail.com>
Date: Sat, 20 Apr 2024 17:54:10 -0500
Subject: [PATCH 3/4] cleaning up footer, dialogs, layouts

---
 package.json                                  |   6 +-
 .../{constants.ts => code-snippets.ts}        |  40 +--
 src/lib/components/dialogs/contact.svelte     |  90 ++++++
 src/lib/components/dialogs/privacy.svelte     |  69 +++++
 .../js-editor.svelte => editor.svelte}        |  25 +-
 src/lib/components/footer.svelte              |  86 ++++++
 src/routes/(app)/+layout.svelte               | 226 +--------------
 src/routes/(app)/+page.svelte                 | 103 ++-----
 src/routes/+layout.ts                         |   3 +-
 src/routes/bookmarklets/+layout.svelte        | 271 +-----------------
 src/routes/bookmarklets/[slug]/+page.svelte   |   2 +-
 vite.config.ts                                |   9 +-
 12 files changed, 317 insertions(+), 613 deletions(-)
 rename src/lib/components/{constants.ts => code-snippets.ts} (81%)
 create mode 100644 src/lib/components/dialogs/contact.svelte
 create mode 100644 src/lib/components/dialogs/privacy.svelte
 rename src/lib/components/{editors/js-editor.svelte => editor.svelte} (94%)
 create mode 100644 src/lib/components/footer.svelte

diff --git a/package.json b/package.json
index 555669e..7a47b25 100644
--- a/package.json
+++ b/package.json
@@ -20,20 +20,20 @@
 		"@codemirror/lint": "^6.1.0",
 		"@codemirror/theme-one-dark": "^6.1.0",
 		"@sveltejs/adapter-static": "^2.0.1",
-		"@sveltejs/kit": "^1.5.0",
+		"@sveltejs/kit": "^1.30.4",
 		"@types/uglify-js": "^3.17.1",
 		"@typescript-eslint/eslint-plugin": "^5.45.0",
 		"@typescript-eslint/parser": "^5.45.0",
 		"codemirror": "^6.0.1",
 		"eslint": "^8.56.0",
-		"eslint-linter-browserify": "^8.34.0",
+		"eslint-linter-browserify": "^8.57.0",
 		"eslint-plugin-svelte3": "^4.0.0",
 		"sass": "^1.70.0",
 		"svelte": "^4.2.10",
 		"svelte-check": "^3.0.1",
 		"svelte-codemirror-editor": "^1.1.0",
 		"svelte-sitemap": "^2.6.0",
-		"terser": "^5.16.3",
+		"terser": "^5.30.3",
 		"tslib": "^2.6.2",
 		"typescript": "^5.0.0",
 		"vite": "^5.1.1",
diff --git a/src/lib/components/constants.ts b/src/lib/components/code-snippets.ts
similarity index 81%
rename from src/lib/components/constants.ts
rename to src/lib/components/code-snippets.ts
index b2512ee..06dcfbb 100644
--- a/src/lib/components/constants.ts
+++ b/src/lib/components/code-snippets.ts
@@ -1,4 +1,4 @@
-export const useExampleBookmarklet1 = `const source = "https://assets.make-bookmarklets.com/thanks-ac42db36.mp3";
+export const playMP3Recording = `const source = "https://assets.make-bookmarklets.com/thanks-ac42db36.mp3";
 const audio = new Audio();
 
 audio.addEventListener("load", () => {
@@ -8,7 +8,7 @@ audio.addEventListener("load", () => {
 audio.src = source;
 audio.autoplay = true;`;
 
-export const useExampleBookmarklet2 = `const capture = async () => {
+export const fullWebpageScreenShot = `const capture = async () => {
     const canvas = document.createElement("canvas");
     const context = canvas.getContext("2d");
     const video = document.createElement("video");
@@ -26,7 +26,8 @@ export const useExampleBookmarklet2 = `const capture = async () => {
   };
   
   capture();`;
-export const useExampleBookmarklet3 = `function pageSpeedInsights(currentSite){
+
+export const openCurrentPageGooglePageSpeedInsights = `function pageSpeedInsights(currentSite){
     try {
      window.open('https://pagespeed.web.dev/report?url=' + currentSite, '_blank', 'noopener,noreferrer'); 
     } catch (error){
@@ -34,18 +35,21 @@ export const useExampleBookmarklet3 = `function pageSpeedInsights(currentSite){
     }
   };
   pageSpeedInsights(window.location.href);`;
-export const useExampleBookmarklet4 = `try {   
+
+export const copyToClipboard = `try {   
     navigator.clipboard.writeText('ADD WHAT EVER TEXT YOU WANT HERE');
   } catch(error) {
     console.log('Copy To Clipboard Bookmarklet did not work: ', error);
-}`;  
-export const useExampleBookmarklet5 = `try {
+}`;
+
+export const googleHighlightedText = `try {
   const highlightedText = window.getSelection().toString();
    window.open('http://google.com/search?q=site:' + window.location.hostname + ' "' + highlightedText + '"');
 }  catch(error) {
   console.log('Google If Text Indexed Bookmarklet did not work: ', error);
 }`;
-export const useExampleSnippet1 = `const container = document.createElement('div');
+
+export const tippyTopUI = `const container = document.createElement('div');
 container.className = 'xxxxxx_wraper_xxxxx';
 container.textContent = 'Give me some data, or maybe some buttons?';
 container.styles = 'width: 100%;letter-spacing:1px;background-color:pink;text-align:right;font-family:helvetica !important;font-weight:100;padding-inline: 60px;color:#161613;margin:auto;top:0;right:0;left:0;position:fixed;z-index:2147483647;font-size:18px;text-rendering:optimizeLegibility;text-align:center;line-height:36px;';
@@ -59,7 +63,8 @@ close.textContent = 'x';
 close.setAttribute('style', 'position:absolute;left:30px;top:8px !important;background-color:white;border-radius:50%;color:black;z-index:30;padding:0;font-size:15px;font-weight:100;width:20px;height:20px;cursor:pointer;display:flex;justify-content:center;align-items:flex-start;border:1px solid black;line-height:16px;');
 close.onclick = () => container.remove();
 container.appendChild(close);`;
-export const useExampleSnippet2 = `const container = document.createElement('dialog');
+
+export const dialogUI = `const container = document.createElement('dialog');
 
 function createDialog() {
   const close = document.createElement('button');
@@ -95,25 +100,6 @@ function createContent(header) {
 }
 
 createDialog();`;
-export const config = {
-  parserOptions: {
-      ecmaVersion: 2019,
-      sourceType: "module",
-  },
-  env: {
-      browser: true,
-      node: true,
-  },
-  rules: {
-      semi: ["warn", "always"],
-      "valid-typeof": ["error", "always"],
-      "no-unused-vars": ["error", "always"],
-      "no-unreachable": ["error", "always"],
-      "no-dupe-args": ["error", "always"],
-      "no-dupe-else-if": ["error", "always"],
-      "no-console": ["warn", "always"],
-  },
-};
 
 export const colorPicker = `const abortController = new AbortController();
 async function sampleColorFromScreen(abortController) {
diff --git a/src/lib/components/dialogs/contact.svelte b/src/lib/components/dialogs/contact.svelte
new file mode 100644
index 0000000..3d916e8
--- /dev/null
+++ b/src/lib/components/dialogs/contact.svelte
@@ -0,0 +1,90 @@
+<button
+type="button"
+class="button fill-white"
+on:click={() => document.getElementById("dialog-contact").showModal()}>Contact</button
+>
+
+<dialog id="dialog-contact" class="dialog">
+    <button
+        type="button"
+        class="button-close"
+        title="Close Dialog"
+        on:click={() => document.getElementById("dialog-contact").close()}
+    />
+    <form action="https://formspree.io/f/xeqwzrkq" method="POST">
+        <label for="name">Full Name</label>
+        <input
+            type="text"
+            id="name"
+            class="input"
+            name="name"
+            required
+            autocomplete="name"
+        />
+        <label for="email">Email</label>
+        <input
+            type="email"
+            id="email"
+            class="input"
+            name="email"
+            required
+            autocomplete="email"
+        />
+        <label for="message">Message</label>
+        <textarea name="message" id="message" class="input" required />
+        <button type="submit" class="button fill-white">Send</button>
+    </form>
+    <p>
+        Found an issue? Reach out on
+        <a
+            href="https://github.com/Blumed/make-bookmarklets/issues/new"
+            target="_blank"
+            rel="noopener noreferrer">Github</a
+        >.
+    </p>
+</dialog>
+
+<style lang="scss">
+    .dialog {
+        background-color: var(--color-clay);
+        border-color: var(--color-pink);
+        border-radius: 0.25rem;
+        color: var(--color-black);
+        max-width: 400px;
+
+        &::backdrop {
+            position: fixed;
+            inset: 0px;
+            background: rgba(0, 0, 0, 0.1);
+        }
+
+        form {
+            display: grid;
+            padding: 20px;
+        }
+        label {
+            margin-bottom: 5px;
+        }
+        .input {
+            margin-bottom: 15px;
+        }
+        .button {
+            max-width: 130px;
+            background-color: #f78da7;
+        }
+        p {
+            margin: 0;
+            padding-inline: 20px;
+        }
+
+        @media (max-width: 768px) {
+            margin-inline: 15px;
+        }
+    }
+
+    .button-close {
+        position: absolute;
+        top: 16px;
+        right: 32px;
+    }
+</style>
\ No newline at end of file
diff --git a/src/lib/components/dialogs/privacy.svelte b/src/lib/components/dialogs/privacy.svelte
new file mode 100644
index 0000000..1293800
--- /dev/null
+++ b/src/lib/components/dialogs/privacy.svelte
@@ -0,0 +1,69 @@
+<button
+    type="button"
+    class="button-inline"
+    on:click={() => document.getElementById("dialog-privacy-policy").showModal()}
+    >Privacy Policy</button>
+
+<dialog id="dialog-privacy-policy" class="dialog">
+    <button
+        type="button"
+        class="button-close"
+        title="Close Dialog"
+        on:click={() => document.getElementById("dialog-privacy-policy").close()}
+    />
+    <aside>
+        <h2>Make Bookmarklets doesn't:</h2>
+        <ul>
+            <li>Collect any user data what so ever</li>
+            <li>Collect any personal information of any kind</li>
+            <li>Use 3rd-party tracking or ad server technology</li>
+            <li>Use cookies, local storage, or a backend to store data</li>
+        </ul>
+    </aside>
+    <aside>
+        <h2>Make Bookmarklets does:</h2>
+        <p>
+            Use <a
+                href="https://withcabin.com/"
+                target="_blank"
+                rel="noopener noreferrer">Cabin Analytics</a
+            > which is a service for anonymous analytics. Cabin doesn't store cookies
+            on your computer. I use it for analyzing basic site traffic. They're
+            data isn't pooled in a way in which it is even useful for them to sell,
+            so they don't. They are a paid services which is how they make their
+            money.
+        </p>
+    </aside>
+</dialog>
+
+<style lang="scss">
+    .dialog {
+        background-color: var(--color-clay);
+        border-color: var(--color-pink);
+        border-radius: 0.25rem;
+        color: var(--color-black);
+        max-width: 900px;
+        &::backdrop {
+            position: fixed;
+            inset: 0px;
+            background: rgba(0, 0, 0, 0.1);
+        }
+
+        h2 {
+            margin-bottom: 0;
+            + :is(p, ul) {
+                margin-top: 5px;
+            }
+        }
+
+        @media (max-width: 768px) {
+            margin-inline: 15px;
+        }
+    }
+
+    .button-close {
+        position: absolute;
+        top: 16px;
+        right: 32px;
+    }
+</style>
\ No newline at end of file
diff --git a/src/lib/components/editors/js-editor.svelte b/src/lib/components/editor.svelte
similarity index 94%
rename from src/lib/components/editors/js-editor.svelte
rename to src/lib/components/editor.svelte
index be07779..4f326a8 100644
--- a/src/lib/components/editors/js-editor.svelte
+++ b/src/lib/components/editor.svelte
@@ -4,12 +4,11 @@
     import { linter, lintGutter } from "@codemirror/lint";
     import * as eslint from "eslint-linter-browserify";
     import { oneDark } from "@codemirror/theme-one-dark";
-    import { config } from "$lib/components/constants";
     import { slide } from "svelte/transition";
     import { minify } from "terser";
 
     export let codeEditor: string = "";
-console.log('codeEditor', codeEditor);
+
     let errorMessage = "";
     let gistMultipleFiles = false;
     let gistValid = true;
@@ -91,6 +90,27 @@ console.log('codeEditor', codeEditor);
 
     $: if (gistUrl === "") gistMultipleFiles = false;
     $: selectedGist, selectedGist !== "" && createGistBookmarklet();
+
+    // Code merrior config
+    const config = {
+        parserOptions: {
+            ecmaVersion: 2019,
+            sourceType: "module",
+        },
+        env: {
+            browser: true,
+            node: true,
+        },
+        rules: {
+            semi: ["warn", "always"],
+            "valid-typeof": ["error", "always"],
+            "no-unused-vars": ["error", "always"],
+            "no-unreachable": ["error", "always"],
+            "no-dupe-args": ["error", "always"],
+            "no-dupe-else-if": ["error", "always"],
+            "no-console": ["warn", "always"],
+        },
+    };
 </script>
 
 <CodeMirror
@@ -103,6 +123,7 @@ console.log('codeEditor', codeEditor);
         linter(esLint(new eslint.Linter(), config)),
     ]}
 />
+
 {#if errorMessage !== ""}
     <div
         class={`editor-drawer error-message ${codeInputGist && "gist-message"}`}
diff --git a/src/lib/components/footer.svelte b/src/lib/components/footer.svelte
new file mode 100644
index 0000000..2ba1718
--- /dev/null
+++ b/src/lib/components/footer.svelte
@@ -0,0 +1,86 @@
+<script lang="ts">
+    import { browser } from "$app/environment";
+    import Heart from "$lib/components/heart-icon/heart.svelte";
+    import DialogContact from '$lib/components/dialogs/contact.svelte';
+    import DialogPrivacy from '$lib/components/dialogs/privacy.svelte';
+</script>
+
+<footer class="footer-section section">
+    <div class="container">
+        <div class="contact-section">
+            <h2>Say Hello</h2>
+            <p>
+                Let me know if you have any questions, or if you just want to
+                say hi.
+            </p>
+            <DialogContact />
+        </div>
+        <div class="boring-section">
+            <p>
+                Copyright &copy;{new Date().getFullYear()} All Rights Reserved | <DialogPrivacy />
+            </p>
+
+            <p>
+                Made with lots of <Heart /> by
+                <a
+                    href="https://cullanluther.com"
+                    target="_blank"
+                    rel="noopener">Cullan Luther</a
+                >
+            </p>
+        </div>
+    </div>
+</footer>
+
+<style lang="scss">
+    .footer-section {
+        padding-block: 10px;
+    }
+
+    .contact-section {
+        padding: 0 40px 40px;
+        text-align: center;
+        h2 {
+            text-align: right;
+            max-width: 360px;
+            margin-bottom: 0;
+        }
+        p {
+            display: inline-block;
+        }
+        .button {
+            margin-left: 20px;
+        }
+    }
+
+    .boring-section {
+        display: flex;
+        justify-content: space-between;
+    }
+
+    @media (max-width: 768px) {
+        .contact-section {
+            padding-inline: 0;
+            text-align: left;
+            h2 {
+                margin-left: 0;
+                max-width: 100%;
+                text-align: left;
+            }
+            .button {
+                margin-left: 0;
+            }
+        }
+        
+        .boring-section {
+            flex-direction: column;
+            justify-content: flex-start;
+            p {
+                margin-top: 0;
+                &:first-child {
+                    margin-bottom: 0;
+                }
+            }
+        }
+    }
+</style>
\ No newline at end of file
diff --git a/src/routes/(app)/+layout.svelte b/src/routes/(app)/+layout.svelte
index 9fc8185..376f49b 100644
--- a/src/routes/(app)/+layout.svelte
+++ b/src/routes/(app)/+layout.svelte
@@ -2,20 +2,7 @@
     import "$lib/styles/global.scss";
     import Heart from "$lib/components/heart-icon/heart.svelte";
     import MainNavigation from "$lib/components/main-navigation.svelte";
-    import { browser } from "$app/environment";
-    let dialog: any;
-    function toggleDialog(state: boolean, dialogName: string) {
-        if (browser) {
-            const dialogPrivacy = document.getElementById(
-                "dialog-privacy-policy",
-            );
-            const dialogContact = document.getElementById("dialog-contact");
-            if (dialogName === "privacy") dialog = dialogPrivacy;
-            if (dialogName === "contact") dialog = dialogContact;
-
-            state === true ? dialog?.showModal() : dialog?.close();
-        }
-    }
+    import Footer from "$lib/components/footer.svelte";
 </script>
 
 <MainNavigation />
@@ -24,213 +11,4 @@
     <slot />
 </main>
 
-<footer class="footer-section section">
-    <div class="container">
-        <div class="contact-section">
-            <h2>Say Hello</h2>
-            <p>
-                Let me know if you have any questions, or if you just want to
-                say hi.
-            </p>
-            <button
-                type="button"
-                class="button fill-white"
-                on:click={() => toggleDialog(true, "contact")}>Contact</button
-            >
-        </div>
-        <div class="boring-section">
-            <p>
-                Copyright &copy;{new Date().getFullYear()} All Rights Reserved |
-                <button
-                    type="button"
-                    class="button-inline"
-                    on:click={() => toggleDialog(true, "privacy")}
-                    >Privacy Policy</button
-                >
-            </p>
-
-            <p>
-                Made with lots of <Heart /> by
-                <a
-                    href="https://cullanluther.com"
-                    target="_blank"
-                    rel="noopener">CullanLuther</a
-                >
-            </p>
-        </div>
-    </div>
-</footer>
-
-<dialog id="dialog-privacy-policy" class="dialog">
-    <button
-        type="button"
-        class="button-close"
-        title="Close Dialog"
-        on:click={() => toggleDialog(false, "privacy")}
-    />
-    <aside>
-        <h2>Make Bookmarklets doesn't:</h2>
-        <ul>
-            <li>Collect any user data what so ever</li>
-            <li>Collect any personal information of any kind</li>
-            <li>Use 3rd-party tracking or ad server technology</li>
-            <li>Use cookies, local storage, or a backend to store data</li>
-        </ul>
-    </aside>
-    <aside>
-        <h2>Make Bookmarklets does:</h2>
-        <p>
-            Use <a
-                href="https://withcabin.com/"
-                target="_blank"
-                rel="noopener noreferrer">Cabin Analytics</a
-            > which is a service for anonymous analytics. Cabin doesn't store cookies
-            on your computer. I use it for analyzing basic site traffic. They're
-            data isn't pooled in a way in which it is even useful for them to sell,
-            so they don't. They are a paid services which is how they make their
-            money.
-        </p>
-    </aside>
-</dialog>
-
-<dialog id="dialog-contact" class="dialog">
-    <button
-        type="button"
-        class="button-close"
-        title="Close Dialog"
-        on:click={() => toggleDialog(false, "contact")}
-    />
-    <form action="https://formspree.io/f/xeqwzrkq" method="POST">
-        <label for="name">Full Name</label>
-        <input
-            type="text"
-            id="name"
-            class="input"
-            name="name"
-            required
-            autocomplete="name"
-        />
-        <label for="email">Email</label>
-        <input
-            type="email"
-            id="email"
-            class="input"
-            name="email"
-            required
-            autocomplete="email"
-        />
-        <label for="message">Message</label>
-        <textarea name="message" id="message" class="input" required />
-        <button type="submit" class="button fill-white">Send</button>
-    </form>
-    <p>
-        Found an issue? Reach out on
-        <a
-            href="https://github.com/Blumed/make-bookmarklets/issues/new"
-            target="_blank"
-            rel="noopener noreferrer">Github</a
-        >.
-    </p>
-</dialog>
-
-<style lang="scss">
-    .footer-section {
-        padding-block: 10px;
-    }
-
-    .contact-section {
-        padding: 0 40px 40px;
-        text-align: center;
-        h2 {
-            text-align: right;
-            max-width: 360px;
-            margin-bottom: 0;
-        }
-        p {
-            display: inline-block;
-        }
-        .button {
-            margin-left: 20px;
-        }
-    }
-    .boring-section {
-        display: flex;
-        justify-content: space-between;
-    }
-
-    .button-close {
-        position: absolute;
-        top: 16px;
-        right: 32px;
-    }
-    #dialog-privacy-policy {
-        max-width: 900px;
-        h2 {
-            margin-bottom: 0;
-            + :is(p, ul) {
-                margin-top: 5px;
-            }
-        }
-    }
-
-    #dialog-contact {
-        max-width: 400px;
-        form {
-            display: grid;
-            padding: 20px;
-        }
-        label {
-            margin-bottom: 5px;
-        }
-        .input {
-            margin-bottom: 15px;
-        }
-        .button {
-            max-width: 130px;
-            background-color: #f78da7;
-        }
-        p {
-            margin: 0;
-            padding-inline: 20px;
-        }
-    }
-
-    .dialog {
-        background-color: var(--color-clay);
-        border-color: var(--color-pink);
-        border-radius: 0.25rem;
-        color: var(--color-black);
-        &::backdrop {
-            position: fixed;
-            inset: 0px;
-            background: rgba(0, 0, 0, 0.1);
-        }
-    }
-    @media (max-width: 768px) {
-        .dialog {
-            margin-inline: 15px;
-        }
-        .contact-section {
-            padding-inline: 0;
-            text-align: left;
-            h2 {
-                margin-left: 0;
-                max-width: 100%;
-                text-align: left;
-            }
-            .button {
-                margin-left: 0;
-            }
-        }
-        .boring-section {
-            flex-direction: column;
-            justify-content: flex-start;
-            p {
-                margin-top: 0;
-                &:first-child {
-                    margin-bottom: 0;
-                }
-            }
-        }
-    }
-</style>
+<Footer />
diff --git a/src/routes/(app)/+page.svelte b/src/routes/(app)/+page.svelte
index a47ab1a..5225150 100644
--- a/src/routes/(app)/+page.svelte
+++ b/src/routes/(app)/+page.svelte
@@ -2,18 +2,18 @@
     import { browser } from "$app/environment";
     import Seo from "$lib/components/page-meta.svelte";
     import AccordionItem from "$lib/components/accordion.svelte";
-    import CodeEditor from "$lib/components/editors/js-editor.svelte";
+    import CodeEditor from "$lib/components/editor.svelte";
 
     import { slide } from "svelte/transition";
     import {
-        useExampleBookmarklet1,
-        useExampleBookmarklet2,
-        useExampleBookmarklet3,
-        useExampleBookmarklet4,
-        useExampleBookmarklet5,
-        useExampleSnippet1,
-        useExampleSnippet2,
-    } from "$lib/components/constants";
+        playMP3Recording,
+        fullWebpageScreenShot,
+        openCurrentPageGooglePageSpeedInsights,
+        copyToClipboard,
+        googleHighlightedText,
+        tippyTopUI,
+        dialogUI,
+    } from "$lib/components/code-snippets";
 
     import { minify } from "terser";
     import Accordion from "$lib/components/accordion.svelte";
@@ -38,58 +38,6 @@
     let clickedMobileInstructions = false;
     let files: any;
 
-    async function minification(str: string) {
-        const result = await minify(str, {});
-        return result.code;
-    }
-
-    function result() {
-        if (codeInputGist !== "") {
-            return minification(codeInputGist)
-                .then((result) => {
-                    errorMessage = "";
-                    if (result === "") {
-                        errorMessage =
-                            "Sorry something went wrong creating your gist bookmarklet 😅";
-                    } else {
-                        codeOutput =
-                            "javascript:(function(){" + result + "}());";
-                    }
-
-                    return;
-                })
-                .catch((err) => {
-                    codeOutput = "";
-                    return (errorMessage = err);
-                });
-        }
-
-        return minification(codeInput)
-            .then((result) => {
-                errorMessage = "";
-                if (result === "") {
-                    errorMessage = "Put some code in there!";
-                } else {
-                    codeOutput = "javascript:(function(){" + result + "}());";
-                }
-                return;
-            })
-            .catch((err) => {
-                codeOutput = "";
-                return (errorMessage = err);
-            });
-    }
-
-    function reset() {
-        codeOutput = "";
-        codeInput = "";
-        errorMessage = "";
-        codeInputGist = "";
-        gistUrl = "";
-        selectedGist = "";
-        gistEditorMessage = "";
-        clickedMobileInstructions = false;
-    }
 
     function toggleSidebar(id: string) {
         if (browser) {
@@ -508,7 +456,7 @@ getGist('https://gist.githubusercontent.com/${
             name="webpage-editable"
             id="webpage-editable"
             class="example-code"
-            value={useExampleBookmarklet1}
+            value={playMP3Recording}
             rows="8"
             readonly
         />
@@ -516,7 +464,7 @@ getGist('https://gist.githubusercontent.com/${
             type="button"
             class="button button-small fill-white"
             on:click={() =>
-                addToCodeEditor(useExampleBookmarklet1, true, "examples-menu")}
+                addToCodeEditor(playMP3Recording, true, "examples-menu")}
             >Add To Editor</button
         >
     </aside>
@@ -531,7 +479,7 @@ getGist('https://gist.githubusercontent.com/${
             name="webpage-editable"
             id="webpage-editable"
             class="example-code"
-            value={useExampleBookmarklet2}
+            value={fullWebpageScreenShot}
             rows="8"
             readonly
         />
@@ -539,7 +487,7 @@ getGist('https://gist.githubusercontent.com/${
             type="button"
             class="button button-small fill-white"
             on:click={() =>
-                addToCodeEditor(useExampleBookmarklet2, true, "examples-menu")}
+                addToCodeEditor(fullWebpageScreenShot, true, "examples-menu")}
             >Add To Editor</button
         >
     </aside>
@@ -554,7 +502,7 @@ getGist('https://gist.githubusercontent.com/${
             name="webpage-editable"
             id="webpage-editable"
             class="example-code"
-            value={useExampleBookmarklet3}
+            value={openCurrentPageGooglePageSpeedInsights}
             rows="8"
             readonly
         />
@@ -562,7 +510,7 @@ getGist('https://gist.githubusercontent.com/${
             type="button"
             class="button button-small fill-white"
             on:click={() =>
-                addToCodeEditor(useExampleBookmarklet3, true, "examples-menu")}
+                addToCodeEditor(openCurrentPageGooglePageSpeedInsights, true, "examples-menu")}
             >Add To Editor</button
         >
     </aside>
@@ -576,7 +524,7 @@ getGist('https://gist.githubusercontent.com/${
             name="webpage-editable"
             id="webpage-editable"
             class="example-code"
-            value={useExampleBookmarklet4}
+            value={copyToClipboard}
             rows="8"
             readonly
         />
@@ -584,7 +532,7 @@ getGist('https://gist.githubusercontent.com/${
             type="button"
             class="button button-small fill-white"
             on:click={() =>
-                addToCodeEditor(useExampleBookmarklet4, true, "examples-menu")}
+                addToCodeEditor(copyToClipboard, true, "examples-menu")}
             >Add To Editor</button
         >
     </aside>
@@ -600,7 +548,7 @@ getGist('https://gist.githubusercontent.com/${
             name="webpage-editable"
             id="webpage-editable"
             class="example-code"
-            value={useExampleBookmarklet5}
+            value={googleHighlightedText}
             rows="8"
             readonly
         />
@@ -608,7 +556,7 @@ getGist('https://gist.githubusercontent.com/${
             type="button"
             class="button button-small fill-white"
             on:click={() =>
-                addToCodeEditor(useExampleBookmarklet5, true, "examples-menu")}
+                addToCodeEditor(googleHighlightedText, true, "examples-menu")}
             >Add To Editor</button
         >
     </aside>
@@ -642,8 +590,7 @@ getGist('https://gist.githubusercontent.com/${
                     role="button"
                     class="button fill-white"
                     tabindex="0"
-                    >{`${toggleSnippets ? "Hide" : "Show"} Snippets`}</label
-                >
+                    >{`${toggleSnippets ? "Hide" : "Show"} Snippets`}</label>
             </div>
         </div>
     </div>
@@ -669,7 +616,7 @@ getGist('https://gist.githubusercontent.com/${
             name="webpage-editable"
             id="webpage-editable"
             class="example-code"
-            value={useExampleSnippet1}
+            value={tippyTopUI}
             rows="8"
             readonly
         />
@@ -677,7 +624,7 @@ getGist('https://gist.githubusercontent.com/${
             type="button"
             class="button button-small fill-white"
             on:click={() =>
-                addToCodeEditor(useExampleSnippet1, true, "snippets-menu")}
+                addToCodeEditor(tippyTopUI, true, "snippets-menu")}
             >Add To Editor</button
         >
     </aside>
@@ -692,7 +639,7 @@ getGist('https://gist.githubusercontent.com/${
             name="webpage-editable"
             id="webpage-editable"
             class="example-code"
-            value={useExampleSnippet2}
+            value={dialogUI}
             rows="8"
             readonly
         />
@@ -700,7 +647,7 @@ getGist('https://gist.githubusercontent.com/${
             type="button"
             class="button button-small fill-white"
             on:click={() =>
-                addToCodeEditor(useExampleSnippet2, true, "snippets-menu")}
+                addToCodeEditor(dialogUI, true, "snippets-menu")}
             >Add To Editor</button
         >
     </aside>
@@ -821,7 +768,7 @@ getGist('https://gist.githubusercontent.com/${
                     class="button-inline"
                     on:click={() =>
                         addToCodeEditor(
-                            useExampleBookmarklet4,
+                            copyToClipboard,
                             false,
                             "examples-menu",
                         )}>Example</button
diff --git a/src/routes/+layout.ts b/src/routes/+layout.ts
index a0a46f8..c8cacf0 100644
--- a/src/routes/+layout.ts
+++ b/src/routes/+layout.ts
@@ -1,2 +1 @@
-export const prerender = true;
-export const trailingSlash = 'never';
\ No newline at end of file
+export const prerender = true;
\ No newline at end of file
diff --git a/src/routes/bookmarklets/+layout.svelte b/src/routes/bookmarklets/+layout.svelte
index 774d826..376f49b 100644
--- a/src/routes/bookmarklets/+layout.svelte
+++ b/src/routes/bookmarklets/+layout.svelte
@@ -1,21 +1,8 @@
 <script lang="ts">
     import "$lib/styles/global.scss";
     import Heart from "$lib/components/heart-icon/heart.svelte";
-    import { browser } from "$app/environment";
     import MainNavigation from "$lib/components/main-navigation.svelte";
-    let dialog: any;
-    function toggleDialog(state: boolean, dialogName: string) {
-        if (browser) {
-            const dialogPrivacy = document.getElementById(
-                "dialog-privacy-policy",
-            );
-            const dialogContact = document.getElementById("dialog-contact");
-            if (dialogName === "privacy") dialog = dialogPrivacy;
-            if (dialogName === "contact") dialog = dialogContact;
-
-            state === true ? dialog?.showModal() : dialog?.close();
-        }
-    }
+    import Footer from "$lib/components/footer.svelte";
 </script>
 
 <MainNavigation />
@@ -24,258 +11,4 @@
     <slot />
 </main>
 
-<footer class="footer-section section">
-    <div class="container">
-        <div class="contact-section">
-            <h2>Say Hello</h2>
-            <p>
-                Let me know if you have any questions, or if you just want to
-                say hi.
-            </p>
-            <button
-                type="button"
-                class="button fill-white"
-                on:click={() => toggleDialog(true, "contact")}>Contact</button
-            >
-        </div>
-        <div class="boring-section">
-            <p>
-                Copyright &copy;{new Date().getFullYear()} All Rights Reserved |
-                <button
-                    type="button"
-                    class="button-inline"
-                    on:click={() => toggleDialog(true, "privacy")}
-                    >Privacy Policy</button
-                >
-            </p>
-
-            <p>
-                Made with lots of <Heart /> by
-                <a
-                    href="https://cullanluther.com"
-                    target="_blank"
-                    rel="noopener">CullanLuther</a
-                >
-            </p>
-        </div>
-    </div>
-</footer>
-
-<dialog id="dialog-privacy-policy" class="dialog">
-    <button
-        type="button"
-        class="button-close"
-        title="Close Dialog"
-        on:click={() => toggleDialog(false, "privacy")}
-    />
-    <aside>
-        <h2>Make Bookmarklets doesn't:</h2>
-        <ul>
-            <li>Collect any user data what so ever</li>
-            <li>Collect any personal information of any kind</li>
-            <li>Use 3rd-party tracking or ad server technology</li>
-            <li>Use cookies, local storage, or a backend to store data</li>
-        </ul>
-    </aside>
-    <aside>
-        <h2>Make Bookmarklets does:</h2>
-        <p>
-            Use <a
-                href="https://withcabin.com/"
-                target="_blank"
-                rel="noopener noreferrer">Cabin Analytics</a
-            > which is a service for anonymous analytics. Cabin doesn't store cookies
-            on your computer. I use it for analyzing basic site traffic. They're
-            data isn't pooled in a way in which it is even useful for them to sell,
-            so they don't. They are a paid services which is how they make their
-            money.
-        </p>
-    </aside>
-</dialog>
-
-<dialog id="dialog-contact" class="dialog">
-    <button
-        type="button"
-        class="button-close"
-        title="Close Dialog"
-        on:click={() => toggleDialog(false, "contact")}
-    />
-    <form action="https://formspree.io/f/xeqwzrkq" method="POST">
-        <label for="name">Full Name</label>
-        <input
-            type="text"
-            id="name"
-            class="input"
-            name="name"
-            required
-            autocomplete="name"
-        />
-        <label for="email">Email</label>
-        <input
-            type="email"
-            id="email"
-            class="input"
-            name="email"
-            required
-            autocomplete="email"
-        />
-        <label for="message">Message</label>
-        <textarea name="message" id="message" class="input" required />
-        <button type="submit" class="button fill-white">Send</button>
-    </form>
-    <p>
-        Found an issue? Reach out on
-        <a
-            href="https://github.com/Blumed/make-bookmarklets/issues/new"
-            target="_blank"
-            rel="noopener noreferrer">Github</a
-        >.
-    </p>
-</dialog>
-
-<style lang="scss">
-    .footer-section {
-        padding-block: 10px;
-    }
-
-    .contact-section {
-        padding: 0 40px 40px;
-        text-align: center;
-        h2 {
-            text-align: right;
-            max-width: 360px;
-            margin-bottom: 0;
-        }
-        p {
-            display: inline-block;
-        }
-        .button {
-            margin-left: 20px;
-        }
-    }
-    .boring-section {
-        display: flex;
-        justify-content: space-between;
-    }
-
-    .button-close {
-        position: absolute;
-        top: 16px;
-        right: 32px;
-    }
-    #dialog-privacy-policy {
-        max-width: 900px;
-        h2 {
-            margin-bottom: 0;
-            + :is(p, ul) {
-                margin-top: 5px;
-            }
-        }
-    }
-
-    #dialog-contact {
-        max-width: 400px;
-        form {
-            display: grid;
-            padding: 20px;
-        }
-        label {
-            margin-bottom: 5px;
-        }
-        .input {
-            margin-bottom: 15px;
-        }
-        .button {
-            max-width: 130px;
-            background-color: #f78da7;
-        }
-        p {
-            margin: 0;
-            padding-inline: 20px;
-        }
-    }
-
-    .dialog {
-        background-color: var(--color-clay);
-        border-color: var(--color-pink);
-        border-radius: 0.25rem;
-        color: var(--color-black);
-        &::backdrop {
-            position: fixed;
-            inset: 0px;
-            background: rgba(0, 0, 0, 0.1);
-        }
-    }
-    @media (max-width: 768px) {
-        // .ribbon {
-        //     width: 100%;
-        //     inset: 0;
-        //     object-fit: cover;
-        //     height: 100%;
-        //     top: 342px;
-        //     overflow: inherit;
-        // }
-        // .hero {
-        //     height: auto;
-        //     text-align: left;
-        //     padding-bottom: 0;
-        //     background-color: var(--color-pink);
-        //     overflow: inherit;
-        //     header::after {
-        //         content: "";
-        //         background-color: var(--color-pink);
-        //         z-index: -1;
-        //         height: 100px;
-        //         width: 100%;
-        //         display: block;
-        //         left: 0;
-        //         position: absolute;
-        //     }
-        //     .container {
-        //         position: static;
-        //     }
-        // }
-        // .features-section {
-        //     padding-right: 0;
-        //     h2 {
-        //         font-size: 1.1rem;
-        //         margin-bottom: 0;
-        //     }
-        // }
-        // h1 {
-        //     font-size: 2.4rem;
-        //     line-height: 46px;
-        //     margin-bottom: 20px;
-        //     padding-right: 0;
-        //     span {
-        //         letter-spacing: 1.5px;
-        //         font-size: 2.7rem;
-        //     }
-        // }
-        .dialog {
-            margin-inline: 15px;
-        }
-        .contact-section {
-            padding-inline: 0;
-            text-align: left;
-            h2 {
-                margin-left: 0;
-                max-width: 100%;
-                text-align: left;
-            }
-            .button {
-                margin-left: 0;
-            }
-        }
-        .boring-section {
-            flex-direction: column;
-            justify-content: flex-start;
-            p {
-                margin-top: 0;
-                &:first-child {
-                    margin-bottom: 0;
-                }
-            }
-        }
-    }
-</style>
+<Footer />
diff --git a/src/routes/bookmarklets/[slug]/+page.svelte b/src/routes/bookmarklets/[slug]/+page.svelte
index 0352009..9e68765 100644
--- a/src/routes/bookmarklets/[slug]/+page.svelte
+++ b/src/routes/bookmarklets/[slug]/+page.svelte
@@ -1,6 +1,6 @@
 <script>
     import Hero from "$lib/components/hero.svelte";
-    import CodeEditor from "$lib/components/editors/js-editor.svelte";
+    import CodeEditor from "$lib/components/editor.svelte";
 
     export let data;
     export let codeEditor;
diff --git a/vite.config.ts b/vite.config.ts
index 734d825..1f3db99 100644
--- a/vite.config.ts
+++ b/vite.config.ts
@@ -17,18 +17,13 @@ export default defineConfig(({command}: any) => {
 			},
 			plugins: [
 				sveltekit(),
-			],	test: {
-				include: ['src/**/*.{test,spec}.{js,ts}']
-			}
+			]
 		}
 	} else {
 		return {
 			plugins: [
 				sveltekit(),
-			],
-			test: {
-				include: ['src/**/*.{test,spec}.{js,ts}']
-			}
+			]
 		}
 	}
 }) as UserConfig;
\ No newline at end of file

From c403f657034c53544b9f4c12d37a461120c15a71 Mon Sep 17 00:00:00 2001
From: blumed <cullan.luther@gmail.com>
Date: Mon, 22 Apr 2024 08:03:22 -0500
Subject: [PATCH 4/4] updating styles, updating packages

---
 .eslintrc.cjs                                | 15 +++-
 package.json                                 | 26 +++----
 src/lib/components/dialogs/contact.svelte    | 20 ++++-
 src/lib/components/editor.svelte             | 71 +++++++++++++++++-
 src/lib/components/footer.svelte             |  1 -
 src/lib/components/heart-icon/heart.svelte   |  9 ++-
 src/lib/components/hero.svelte               | 21 +++---
 src/lib/components/main-navigation.svelte    |  4 -
 src/lib/styles/global.scss                   |  5 +-
 src/routes/+error.svelte                     | 41 +---------
 src/routes/{(app) => }/+layout.svelte        |  3 +-
 src/routes/{(app) => }/+page.svelte          | 78 --------------------
 src/routes/bookmarklets/+layout.svelte       | 14 ----
 src/routes/bookmarklets/[slug]/+page.svelte  |  5 +-
 src/routes/bookmarklets/[slug]/+page.ts      | 48 +-----------
 src/routes/bookmarklets/esseeoh/+page.svelte |  8 +-
 tsconfig.json                                |  8 +-
 17 files changed, 141 insertions(+), 236 deletions(-)
 rename src/routes/{(app) => }/+layout.svelte (78%)
 rename src/routes/{(app) => }/+page.svelte (95%)
 delete mode 100644 src/routes/bookmarklets/+layout.svelte

diff --git a/.eslintrc.cjs b/.eslintrc.cjs
index 13b6414..ca4f0bc 100644
--- a/.eslintrc.cjs
+++ b/.eslintrc.cjs
@@ -1,10 +1,17 @@
 module.exports = {
 	root: true,
 	parser: '@typescript-eslint/parser',
-	extends: ['eslint:recommended', 'plugin:@typescript-eslint/recommended'],
-	plugins: ['svelte3', '@typescript-eslint'],
-	ignorePatterns: ['*.cjs'],
-	overrides: [{ files: ['*.svelte'], processor: 'svelte3/svelte3' }],
+	extends: ['eslint:recommended', 'plugin:@typescript-eslint/recommended'
+	],
+	plugins: ['@typescript-eslint'
+	],
+	ignorePatterns: ['*.cjs'
+	],
+	overrides: [
+		{ files: ['*.svelte'
+			], processor: 'svelte-eslint-parser'
+		}
+	],
 	settings: {
 		'svelte3/typescript': () => require('typescript')
 	},
diff --git a/package.json b/package.json
index 7a47b25..2f0730b 100644
--- a/package.json
+++ b/package.json
@@ -7,7 +7,6 @@
 		"dev": "vite dev",
 		"build": "vite build && terser ./build/esseeoh.js -c -m -o ./build/esseeoh.js",
 		"preview": "vite preview",
-		"test": "vite test",
 		"check": "svelte-kit sync && svelte-check --tsconfig ./tsconfig.json",
 		"check:watch": "svelte-kit sync && svelte-check --tsconfig ./tsconfig.json --watch",
 		"test:unit": "vitest",
@@ -16,28 +15,27 @@
 		"postbuild": "svelte-sitemap --domain https://make-bookmarklets.com --change-freq weekly --reset-time -i '404.html'"
 	},
 	"devDependencies": {
-		"@codemirror/lang-javascript": "^6.1.4",
-		"@codemirror/lint": "^6.1.0",
-		"@codemirror/theme-one-dark": "^6.1.0",
-		"@sveltejs/adapter-static": "^2.0.1",
+		"@codemirror/lang-javascript": "^6.2.2",
+		"@codemirror/lint": "^6.5.0",
+		"@codemirror/theme-one-dark": "^6.1.2",
+		"@sveltejs/adapter-static": "^2.0.3",
 		"@sveltejs/kit": "^1.30.4",
-		"@types/uglify-js": "^3.17.1",
-		"@typescript-eslint/eslint-plugin": "^5.45.0",
-		"@typescript-eslint/parser": "^5.45.0",
+		"@types/uglify-js": "^3.17.5",
+		"@typescript-eslint/eslint-plugin": "^5.60.1",
+		"@typescript-eslint/parser": "^5.62.0",
 		"codemirror": "^6.0.1",
-		"eslint": "^8.56.0",
+		"eslint": "^8.57.0",
 		"eslint-linter-browserify": "^8.57.0",
-		"eslint-plugin-svelte3": "^4.0.0",
+		"eslint-plugin-svelte": "^2.37.0",
 		"sass": "^1.70.0",
 		"svelte": "^4.2.10",
-		"svelte-check": "^3.0.1",
+		"svelte-check": "^3.4.4",
 		"svelte-codemirror-editor": "^1.1.0",
 		"svelte-sitemap": "^2.6.0",
 		"terser": "^5.30.3",
 		"tslib": "^2.6.2",
-		"typescript": "^5.0.0",
-		"vite": "^5.1.1",
-		"vitest": "^1.2.2"
+		"typescript": "^5.4.5",
+		"vite": "^5.2.10"
 	},
 	"type": "module"
 }
\ No newline at end of file
diff --git a/src/lib/components/dialogs/contact.svelte b/src/lib/components/dialogs/contact.svelte
index 3d916e8..6b61684 100644
--- a/src/lib/components/dialogs/contact.svelte
+++ b/src/lib/components/dialogs/contact.svelte
@@ -1,6 +1,6 @@
 <button
 type="button"
-class="button fill-white"
+class="button fill-white button-contact"
 on:click={() => document.getElementById("dialog-contact").showModal()}>Contact</button
 >
 
@@ -45,6 +45,10 @@ on:click={() => document.getElementById("dialog-contact").showModal()}>Contact</
 </dialog>
 
 <style lang="scss">
+    .button-contact {
+            margin-left: 20px;
+    }
+
     .dialog {
         background-color: var(--color-clay);
         border-color: var(--color-pink);
@@ -77,9 +81,7 @@ on:click={() => document.getElementById("dialog-contact").showModal()}>Contact</
             padding-inline: 20px;
         }
 
-        @media (max-width: 768px) {
-            margin-inline: 15px;
-        }
+
     }
 
     .button-close {
@@ -87,4 +89,14 @@ on:click={() => document.getElementById("dialog-contact").showModal()}>Contact</
         top: 16px;
         right: 32px;
     }
+
+    @media (max-width: 768px) {
+        .dialog {
+            margin-inline: 15px;
+        }
+        
+        .button-contact {
+            margin-left: 0;
+        }
+    }
 </style>
\ No newline at end of file
diff --git a/src/lib/components/editor.svelte b/src/lib/components/editor.svelte
index 4f326a8..3669eac 100644
--- a/src/lib/components/editor.svelte
+++ b/src/lib/components/editor.svelte
@@ -7,7 +7,7 @@
     import { slide } from "svelte/transition";
     import { minify } from "terser";
 
-    export let codeEditor: string = "";
+    export let codeEditor = "";
 
     let errorMessage = "";
     let gistMultipleFiles = false;
@@ -384,4 +384,73 @@
         flex-direction: column;
         margin-left: auto;
     }
+
+    @media (max-width: 768px) {
+        .code-input-controls {
+            margin-block: 20px;
+            .buttons {
+                display: flex;
+                flex-wrap: wrap;
+            }
+        }
+        .button-create {
+            margin-top: 20px;
+        }
+        .button-reset {
+            margin-right: 20px;
+        }
+        .button-upload {
+            width: fit-content;
+            margin-left: 0;
+            display: inline-flex;
+            margin-top: 20px;
+            margin-right: 20px;
+        }
+        .button-download {
+            margin-right: 20px;
+        }
+        :global(.button-create) {
+            margin-right: 20px;
+        }
+        .button-copy {
+            top: 23px;
+        }
+        .button-mobile-instructions {
+            order: 2;
+            line-height: 22px;
+        }
+        .button-bookmarklet {
+            display: none;
+            margin-right: 0;
+        }
+        :global(.button.button-toggle-code) {
+            order: 2;
+            margin-top: 0;
+        }
+        #output {
+            width: 100%;
+        }
+        .inline-field-group {
+            position: relative;
+            flex-direction: column;
+            width: 100%;
+            margin-right: 0;
+            margin-bottom: 20px;
+            align-items: flex-start;
+            order: 1;
+            label {
+                display: block;
+                margin-bottom: 3px;
+            }
+            .input {
+                margin-top: 0 !important;
+            }
+            #name {
+                min-width: inherit;
+                width: -moz-available;
+                width: -webkit-fill-available;
+                width: fill-available;
+            }
+        }
+    }
 </style>
\ No newline at end of file
diff --git a/src/lib/components/footer.svelte b/src/lib/components/footer.svelte
index 2ba1718..02c4659 100644
--- a/src/lib/components/footer.svelte
+++ b/src/lib/components/footer.svelte
@@ -1,5 +1,4 @@
 <script lang="ts">
-    import { browser } from "$app/environment";
     import Heart from "$lib/components/heart-icon/heart.svelte";
     import DialogContact from '$lib/components/dialogs/contact.svelte';
     import DialogPrivacy from '$lib/components/dialogs/privacy.svelte';
diff --git a/src/lib/components/heart-icon/heart.svelte b/src/lib/components/heart-icon/heart.svelte
index 289a9a7..a69c2ff 100644
--- a/src/lib/components/heart-icon/heart.svelte
+++ b/src/lib/components/heart-icon/heart.svelte
@@ -5,10 +5,9 @@
     const increaseLove = () => (dimension = (Number(dimension) * 2).toString());
 </script>
 
-<span
+<button
     on:click={() => increaseLove()}
     tabindex="0"
-    role="button"
     aria-label="Click and my heart grows"
 >
     <svg
@@ -24,10 +23,10 @@
             fill="#ec6e89"
         /></svg
     >
-</span>
+</button>
 
 <style lang="scss">
-    span {
+    button {
         position: relative;
         width: 24px;
         display: inline-block;
@@ -36,6 +35,8 @@
         border: 0;
         box-shadow: none;
         padding: 0;
+        background-color: transparent;
+        
         &:hover {
             box-shadow: none !important;
         }
diff --git a/src/lib/components/hero.svelte b/src/lib/components/hero.svelte
index 50a7cc9..7fc0ae3 100644
--- a/src/lib/components/hero.svelte
+++ b/src/lib/components/hero.svelte
@@ -40,8 +40,7 @@
             padding-right: 115px;
         }
     }
-    .container,
-    .code-editor {
+    .container {
         position: relative;
         z-index: 1;
     }
@@ -76,15 +75,15 @@
             font-size: 1.3rem;
             margin-bottom: 10px;
         }
-        ul {
-            padding-left: 23px;
-            margin-top: 10px;
-            margin-bottom: 0;
-        }
-        li {
-            list-style: circle;
-            line-height: 24px;
-        }
+        // ul {
+        //     padding-left: 23px;
+        //     margin-top: 10px;
+        //     margin-bottom: 0;
+        // }
+        // li {
+        //     list-style: circle;
+        //     line-height: 24px;
+        // }
     }
     @media (max-width: 768px) {
         .ribbon {
diff --git a/src/lib/components/main-navigation.svelte b/src/lib/components/main-navigation.svelte
index da5fd0c..68835bc 100644
--- a/src/lib/components/main-navigation.svelte
+++ b/src/lib/components/main-navigation.svelte
@@ -1,7 +1,3 @@
-<script lang="ts">
-    let toggleNavigation = false;
-</script>
-
 <a href="#skip-main-navigation" class="sr-only">Skip Main Navigation</a>
 <nav>
     <ul id="main-navigation" class="list-unstyled">
diff --git a/src/lib/styles/global.scss b/src/lib/styles/global.scss
index 75deb26..00cee9a 100644
--- a/src/lib/styles/global.scss
+++ b/src/lib/styles/global.scss
@@ -268,7 +268,10 @@ a {
         margin-top: 20px;
         margin-left: 0;
     }
-
+    
+    .mobile-only {
+        display: inline-block;
+    }
     .desktop-only {
         display: none;
     }
diff --git a/src/routes/+error.svelte b/src/routes/+error.svelte
index 778deb4..af81e28 100644
--- a/src/routes/+error.svelte
+++ b/src/routes/+error.svelte
@@ -1,11 +1,6 @@
 <script>
     import { browser } from "$app/environment";
     import "$lib/styles/global.scss";
-    // if (browser) {
-    //     setTimeout(() => {
-    //         window.location.href = "https://make-bookmarklets.com";
-    //     }, 1000);
-    // }
 </script>
 
 <svelte:head>
@@ -35,13 +30,6 @@
             alt="Goat Head"
             class="the-goat"
         />
-        <!-- <div class="chat-bubble">
-            <p>
-                Sorry but <strong>{browser && window.location.pathname}</strong>
-                does not exist..... but I do.
-                <span>I'll send you on home.</span>
-            </p>
-        </div> -->
     </div>
 </div>
 
@@ -79,27 +67,7 @@
         position: relative;
         z-index: -1;
     }
-    .chat-bubble {
-        background-image: url(/chat-bubble.svg);
-        background-size: contain;
-        background-repeat: no-repeat;
-        position: absolute;
-        width: 410px;
-        height: 407px;
-        top: 45%;
-        left: 18%;
-        p {
-            padding-inline: 49px;
-            text-align: left;
-            font-size: 2rem;
-            margin-top: 130px;
-            line-height: 35px;
-            span {
-                margin-top: 5px;
-                display: block;
-            }
-        }
-    }
+
     @keyframes four {
         0% {
             transform: rotate(0);
@@ -127,11 +95,4 @@
             transform: rotate(-1800deg);
         }
     }
-    @media (max-width: 768px) {
-        .chat-bubble {
-            display: none;
-            left: 0;
-            width: 100%;
-        }
-    }
 </style>
diff --git a/src/routes/(app)/+layout.svelte b/src/routes/+layout.svelte
similarity index 78%
rename from src/routes/(app)/+layout.svelte
rename to src/routes/+layout.svelte
index 376f49b..8e6cc4e 100644
--- a/src/routes/(app)/+layout.svelte
+++ b/src/routes/+layout.svelte
@@ -1,6 +1,5 @@
 <script lang="ts">
     import "$lib/styles/global.scss";
-    import Heart from "$lib/components/heart-icon/heart.svelte";
     import MainNavigation from "$lib/components/main-navigation.svelte";
     import Footer from "$lib/components/footer.svelte";
 </script>
@@ -11,4 +10,4 @@
     <slot />
 </main>
 
-<Footer />
+<Footer />
\ No newline at end of file
diff --git a/src/routes/(app)/+page.svelte b/src/routes/+page.svelte
similarity index 95%
rename from src/routes/(app)/+page.svelte
rename to src/routes/+page.svelte
index 5225150..6698460 100644
--- a/src/routes/(app)/+page.svelte
+++ b/src/routes/+page.svelte
@@ -426,7 +426,6 @@ getGist('https://gist.githubusercontent.com/${
                 </p>
                 <label
                     for="examples-menu"
-                    role="button"
                     class="button fill-white"
                     tabindex="0"
                     >{`${toggleExamples ? "Hide" : "Show"} Examples`}</label
@@ -1116,9 +1115,6 @@ getGist('https://gist.githubusercontent.com/${
         width: 100%;
         margin-top: 30px;
     }
-    .mobile-only {
-        display: none;
-    }
     .mobile-bookmark-instructions {
         li {
             margin-bottom: 15px;
@@ -1170,73 +1166,6 @@ getGist('https://gist.githubusercontent.com/${
                 font-size: 2.7rem;
             }
         }
-        .code-input-controls {
-            margin-block: 20px;
-            .buttons {
-                display: flex;
-                flex-wrap: wrap;
-            }
-        }
-        .button-create {
-            margin-top: 20px;
-        }
-        .button-reset {
-            margin-right: 20px;
-        }
-        .button-upload {
-            width: fit-content;
-            margin-left: 0;
-            display: inline-flex;
-            margin-top: 20px;
-            margin-right: 20px;
-        }
-        .button-download {
-            margin-right: 20px;
-        }
-        :global(.button-create) {
-            margin-right: 20px;
-        }
-
-        .inline-field-group {
-            position: relative;
-            flex-direction: column;
-            width: 100%;
-            margin-right: 0;
-            margin-bottom: 20px;
-            align-items: flex-start;
-            order: 1;
-            label {
-                display: block;
-                margin-bottom: 3px;
-            }
-            .input {
-                margin-top: 0 !important;
-            }
-            #name {
-                min-width: inherit;
-                width: -moz-available;
-                width: -webkit-fill-available;
-                width: fill-available;
-            }
-        }
-        .button-copy {
-            top: 23px;
-        }
-        .button-mobile-instructions {
-            order: 2;
-            line-height: 22px;
-        }
-        .button-bookmarklet {
-            display: none;
-            margin-right: 0;
-        }
-        :global(.button.button-toggle-code) {
-            order: 2;
-            margin-top: 0;
-        }
-        #output {
-            width: 100%;
-        }
         .mobile-bookmark-instructions {
             background-color: var(--color-clay);
             padding: 10px 30px 10px;
@@ -1256,12 +1185,5 @@ getGist('https://gist.githubusercontent.com/${
             width: 100%;
             height: 100%;
         }
-
-        .mobile-only {
-            display: inline-block;
-        }
-        .desktop-only {
-            display: none;
-        }
     }
 </style>
diff --git a/src/routes/bookmarklets/+layout.svelte b/src/routes/bookmarklets/+layout.svelte
deleted file mode 100644
index 376f49b..0000000
--- a/src/routes/bookmarklets/+layout.svelte
+++ /dev/null
@@ -1,14 +0,0 @@
-<script lang="ts">
-    import "$lib/styles/global.scss";
-    import Heart from "$lib/components/heart-icon/heart.svelte";
-    import MainNavigation from "$lib/components/main-navigation.svelte";
-    import Footer from "$lib/components/footer.svelte";
-</script>
-
-<MainNavigation />
-
-<main id="skip-main-navigation">
-    <slot />
-</main>
-
-<Footer />
diff --git a/src/routes/bookmarklets/[slug]/+page.svelte b/src/routes/bookmarklets/[slug]/+page.svelte
index 9e68765..d05c36d 100644
--- a/src/routes/bookmarklets/[slug]/+page.svelte
+++ b/src/routes/bookmarklets/[slug]/+page.svelte
@@ -6,9 +6,8 @@
     export let codeEditor;
 
     let codeInput = codeEditor;
-    //if (codeInput === "") {codeInput = data.code}
-    $: codeInput = codeInput;
-    console.log('on page codeInput', codeInput);
+   // if (codeInput === "") {codeInput = data.code}
+    $: codeInput = codeInput === "" ? data.code : codeInput;
 </script>
 
 <Hero>
diff --git a/src/routes/bookmarklets/[slug]/+page.ts b/src/routes/bookmarklets/[slug]/+page.ts
index 5c0cacb..a5190ef 100644
--- a/src/routes/bookmarklets/[slug]/+page.ts
+++ b/src/routes/bookmarklets/[slug]/+page.ts
@@ -1,57 +1,13 @@
 import { error } from '@sveltejs/kit';
 export const prerender = true;
+import { colorPicker } from '$lib/components/code-snippets';
 
 export function load({ params }) {
 	if (params.slug === 'color-picker') {
 		return {
 			title: 'Color Picker',
 			copy: 'Build and customize a responsive breakpoint bookmarklet',
-			code: `   document.cE = document.createElement;
-			var s = [], div = document.cE('div');
-			var text = document.cE('input');
-			var col = [0, 0, 0];
-			var aE = "attachEvent", oc = "onchange", ok = "onkeyup";
-			var uB  = function() {
-				var c = text.value.match(/\w\w?/g), n, i;
-				for(i in c) {
-					s[i].value = col[i] = parseInt(c[i], 16) || 0;
-				}
-				div.style.backgroundColor = text.value;
-			}
-			var uC = function(c, val) {
-				col[c] = parseInt(val, 10);
-				text.value = '#';
-				for(var i in col) {
-					n = col[i];
-					var v = ((n < 16) ? '0' : '') + n.toString(16).toUpperCase();
-					text.value += v;
-				}
-				div.style.backgroundColor = text.value;
-			}
-			if(!(text.attachEvent)) { aE = "addEventListener"; oc  = "change"; ok = "keyup" }
-			text.size = 7;
-			text[aE](ok, uB);
-			div.appendChild(text);
-			div.appendChild(document.cE('br'));
-			with(div.style) {
-				position = 'fixed';
-				padding = top = left = '5px';
-				boxShadow = '0 0 5px black';
-				backgroundColor = '#000';
-			}
-			for(var c in ['r','g','b']) { 
-				s[c] = document.cE('input'); 
-				s[c].type = 'range'; 
-				s[c].value = 0;
-				s[c].min = 0; 
-				s[c].max = 255; 
-				s[c].step = 1;
-				s[c][aE](oc, (function() { var col = c; return function() { uC(col, this.value); }})()); 
-				div.appendChild(s[c]); 
-				div.appendChild(document.cE('br'));
-			} 
-			
-			document.body.appendChild(div);`,
+			code: colorPicker,
 		};
 	}
 
diff --git a/src/routes/bookmarklets/esseeoh/+page.svelte b/src/routes/bookmarklets/esseeoh/+page.svelte
index 4f58696..2441c23 100644
--- a/src/routes/bookmarklets/esseeoh/+page.svelte
+++ b/src/routes/bookmarklets/esseeoh/+page.svelte
@@ -122,11 +122,8 @@
             justify-content: center;
             padding-left: 72px;
         }
-        h2,
-        p {
-            max-width: 765px;
-        }
         h2 {
+            max-width: 765px;
             margin: 0;
         }
     }
@@ -139,9 +136,6 @@
         flex-direction: column;
         align-self: center;
     }
-    .bookmarklet-input {
-        margin-bottom: 20px;
-    }
     .button-bookmarklet {
         margin-left: auto;
         background-color: #f78da7;
diff --git a/tsconfig.json b/tsconfig.json
index 6ae0c8c..dd5ba64 100644
--- a/tsconfig.json
+++ b/tsconfig.json
@@ -9,9 +9,13 @@
 		"skipLibCheck": true,
 		"sourceMap": true,
 		"strict": true
-	}
+	},
+	"exclude": [
+		"node_modules",
+		".svelt-kit"
+	]
 	// Path aliases are handled by https://kit.svelte.dev/docs/configuration#alias
 	//
 	// If you want to overwrite includes/excludes, make sure to copy over the relevant includes/excludes
 	// from the referenced tsconfig.json - TypeScript does not merge them in
-}
+}
\ No newline at end of file