@turnipxenon/pineapple 2.4.12 → 2.4.14

package/src/lib/components/layouts/PineappleBaseLayout.svelte

@@ -1,161 +0,0 @@
-<script lang="ts">
-    // For auto dark/light mode
-    import {AppBar, AppShell, autoModeWatcher, LightSwitch} from "@skeletonlabs/skeleton";
-    import RandomizedBackground from "$lib/components/RandomizedBackground.svelte";
-
-    // navigation
-    import {page} from "$app/stores";
-    // store
-    import {enableBackground} from "$lib/store";
-    import type {BreadcrumbData} from "$lib/types/BreadcrumbData";
-    // assets
-    import DialogOverlay from "$lib/components/DialogOverlay.svelte";
-    import AresLogo from "$lib/assets/characters/ares/ares_logo.webp";
-    import {enableDialogueOverlay} from "$lib/components/dialog_manager/DialogManagerStore";
-    // todo: clean up all these imports!
-
-    let pages: BreadcrumbData[] = [];
-
-    const updateBreadcrumb = (pathname: string) => {
-        pages = [];
-        let basePath = "";
-        pathname.split("/").forEach((value, index) => {
-            if (index === 0) {
-                basePath = "/";
-                pages.push({
-                    path: "/",
-                    name: "Home"
-                });
-                return;
-            }
-
-            if (value === "") {
-                return;
-            }
-
-            basePath += value + "/";
-            pages.push({
-                path: basePath,
-                name: value
-            });
-        });
-        pages = pages;
-    };
-
-    $: updateBreadcrumb($page.url.pathname); // run every time we navigate
-
-    let enableBackgroundValue = true;
-    enableBackground.subscribe((value) => {
-        enableBackgroundValue = value;
-    });
-
-    let enableDialogueOverlayValue = true;
-    enableDialogueOverlay.subscribe((value) => {
-        enableDialogueOverlayValue = value;
-    });
-</script>
-
-<!-- App Shell -->
-<svelte:head>
-	{@html `<script>${autoModeWatcher.toString()} autoModeWatcher();</script>`}
-</svelte:head>
-
-<AppShell>
-	<svelte:fragment slot="header">
-		<!-- App Bar -->
-		<AppBar slotDefault="place-content-start" slotTrail="place-content-end">
-			<svelte:fragment slot="lead">
-				<!--TODO: add logo or something for the lead in layout-->
-				<img
-						alt="Ares's head titled towards the left with his tongue out and winking"
-						class="ares-logo"
-						src={AresLogo}
-				/>
-				<span class="mr-2"/>
-				<ol class="breadcrumb">
-					{#each pages as crumb, i}
-						{#if i < pages.length - 1}
-							<li class="crumb">
-								<a href={crumb.path}>{crumb.name.charAt(0).toUpperCase() + crumb.name.slice(1)}</a>
-							</li>
-							<li class="crumb-separator" aria-hidden="true">&rsaquo;</li>
-						{:else}
-							<li class="crumb">{crumb.name.charAt(0).toUpperCase() + crumb.name.slice(1)}</li>
-						{/if}
-					{/each}
-				</ol>
-			</svelte:fragment>
-			<svelte:fragment slot="trail">
-				<LightSwitch bgLight="bg-surface-400"/>
-			</svelte:fragment>
-		</AppBar>
-	</svelte:fragment>
-
-	<RandomizedBackground enable={enableBackgroundValue}/>
-
-	{#if enableDialogueOverlayValue}
-		<!-- Page Route Content -->
-		<div class="default-page-container">
-			<slot/>
-			<div class="footer-space"/>
-		</div>
-		<DialogOverlay/>
-	{:else}
-		<DialogOverlay/>
-		<slot/>
-	{/if}
-</AppShell>
-
-<style lang="postcss">
-    :root {
-        --dialog-left-pad: clamp(0em, 5vw, 2em);
-        --dialog-box-width: min(calc(50em + 4em), calc(100vw - var(--dialog-left-pad) - var(--theme-border-base)));
-        --dialog-box-height: clamp(15em, 50vw, 18em);
-    }
-
-    .default-page-container {
-        @apply flex justify-center items-center;
-        margin-top: 4em;
-        margin-left: clamp(1em, 15vw, 10em);
-        margin-right: 1em;
-        flex-direction: column;
-        z-index: 0;
-    }
-
-    .ares-logo {
-        object-fit: contain;
-        height: 2em;
-        margin-inline-end: 0.5em;
-    }
-
-    /* breadcrumb does not work due to a lot of magic stuff i do
-       the code below is from skeleton's tailwind css:
-       https://github.com/skeletonlabs/skeleton/blob/54f4ecedabf2be6d94a670b56dc8821095ca3fc9/packages/plugin/src/styles/components/breadcrumbs.css
-
-       it likely disappeared due to code gen shenanigans and package magic */
-    .breadcrumb,
-    .breadcrumb-nonresponsive {
-        @apply flex items-center space-x-4 w-full overflow-x-auto;
-        /*@apply flex items-center space-x-4 w-full hide-scrollbar overflow-x-auto;*/
-    }
-
-    .crumb {
-        @apply flex justify-center items-center space-x-2;
-    }
-
-    .crumb-separator {
-        @apply flex text-surface-700-200-token opacity-50;
-    }
-
-    /* === Auto-Responsive === */
-
-    .breadcrumb li {
-        @apply hidden md:block;
-    }
-
-    .breadcrumb li:nth-last-child(3),
-    .breadcrumb li:nth-last-child(2),
-    .breadcrumb li:nth-last-child(1) {
-        @apply block;
-    }
-</style>

package/src/routes/+page.svelte

@@ -1,38 +0,0 @@
-<script>
-    import {PUBLIC_CRINGE_USERNAME} from "$env/static/public";
-
-    import {createGoToFunction} from "$lib/util/create_go_to_function";
-    import PineappleBaseLayout from "$lib/components/layouts/PineappleBaseLayout.svelte";
-</script>
-
-<svelte:head>
-	<title>Welcome to {PUBLIC_CRINGE_USERNAME}'s Home</title>
-	<meta content="Welcome to {PUBLIC_CRINGE_USERNAME}'s Home" name="og:title"/>
-	<meta
-			content="Welcome to {PUBLIC_CRINGE_USERNAME}'s home! It's a neat place to be at if you're feeling lost. Come hang around!"
-			name="og:description"
-	/>
-</svelte:head>
-
-<PineappleBaseLayout>
-	<div class="card default-card">
-		<h1 class="mb-8">Directory</h1>
-
-		<div class="btn-group-vertical variant-filled-secondary">
-			<button on:click={createGoToFunction("personal")}><h2>Personal</h2></button>
-			<button on:click={createGoToFunction("portfolio")}><h2>Portfolio</h2></button>
-		</div>
-	</div>
-</PineappleBaseLayout>
-
-<style lang="postcss">
-    .btn-group-vertical button {
-        padding: 2em;
-    }
-
-    .default-card {
-        text-align: center;
-        padding-inline-end: 0;
-        @apply p-16;
-    }
-</style>

package/src/routes/personal/+page.svelte

@@ -1,37 +0,0 @@
-<script>
-    import {PUBLIC_CRINGE_USERNAME} from "$env/static/public";
-</script>
-
-<svelte:head>
-	<title>Welcome to {PUBLIC_CRINGE_USERNAME}'s Home</title>
-	<meta content="Welcome to {PUBLIC_CRINGE_USERNAME}'s Home" name="og:title"/>
-	<meta
-			content="Welcome to {PUBLIC_CRINGE_USERNAME}'s home! It's a neat place to be at if you're feeling lost. Come hang around!"
-			name="og:description"
-	/>
-</svelte:head>
-
-<div class="card default-card">
-
-		<h1 class="mb-8">Directory</h1>
-
-		<div class="btn-group-vertical variant-filled-secondary">
-			<button onclick="location.href='/about'"><h2>About</h2></button>
-			<button onclick="location.href='/socials'"><h2>Socials</h2></button>
-			<button onclick="location.href='/game-dev'"><h2>Game development</h2></button>
-			<button onclick="location.href='/blogs'"><h2>Blogs</h2></button>
-			<button onclick="location.href='/misc'"><h2>Miscellaneous</h2></button>
-		</div>
-</div>
-
-<style lang="postcss">
-    .btn-group-vertical button {
-        padding: 2em;
-    }
-
-    .default-card {
-        text-align: center;
-        padding-inline-end: 0;
-        @apply p-16;
-    }
-</style>