@turnipxenon/pineapple 2.4.44 → 2.4.46

package/dist/template/seaweed/RunChaos.js

@@ -0,0 +1,41 @@
+const chaoticWordBank = ["niko", "toba", "seal", "aquarium", "ojisan", "baikal"];
+export const runChaos = (node) => {
+    // change all text content to gibberish
+    for (const child of Array.from(node.children)) {
+        if (child.nodeType === Node.ELEMENT_NODE) {
+            runChaos(child);
+            for (const childOfChild of child.childNodes) {
+                if (childOfChild.nodeType === Node.TEXT_NODE && childOfChild.textContent?.trim()) {
+                    const max = childOfChild.textContent.length;
+                    childOfChild.textContent = "";
+                    while (childOfChild.textContent.length < max) {
+                        childOfChild.textContent += (chaoticWordBank[Math.floor(Math.random() * chaoticWordBank.length)] + " ");
+                    }
+                }
+            }
+            // change all links to crouton
+            if (child.hasAttribute("href")) {
+                child.setAttribute("href", "https://crouton.net/");
+            }
+            // change all images to niko if aria != hidden?
+            if (child.hasAttribute("src") && !child.hasAttribute("aria-hidden")) {
+                if (child.hasAttribute("alt")) {
+                    child.setAttribute("src", "https://p.potaufeu.asahi.com/a2b9-p/picture/21583312/5c3310aec77068e24844c663aa62b37c.jpg");
+                }
+                else {
+                    child.setAttribute("src", "https://video.twimg.com/ext_tw_video/1318728494256410624/pu/vid/640x360/TMklz6hiTkQu3xhn.mp4");
+                    child.setAttribute("muted", "true");
+                }
+            }
+            if (child.tagName.trim() === "VIDEO") {
+                child.setAttribute("src", "https://video.twimg.com/ext_tw_video/1318728494256410624/pu/vid/640x360/TMklz6hiTkQu3xhn.mp4");
+                child.setAttribute("muted", "true");
+            }
+            // change all button events
+            if (child.tagName.trim() === "BUTTON") {
+                // remove anon function: https://stackoverflow.com/a/41343451/17836168
+                child.setAttribute("disabled", "true");
+            }
+        }
+    }
+};

package/dist/template/{Seaweed → seaweed}/SeaweedTemplate.svelte

@@ -1,8 +1,5 @@
-<script>export let letChaos = true;
-export let name = "Turnip";
-export let email = "turnipxenon@gmail.com";
-export let linkedinSlug = "turnip-xenon";
-export let domain = "http://localhost:5173/portfolio/actual/";
+<script>import EntryOrderConfig from "./entry_order_config/EntryOrderConfig.svelte";
+import { runChaos } from "./RunChaos";
 import SocialSection from "../../components/SocialSection.svelte";
 import "./seaweed.postcss";
 import SeaweedBaseLayout from "../../components/layouts/SeaweedBaseLayout.svelte";
@@ -11,31 +8,46 @@ import { page } from "$app/stores";
 import Card from "../../components/Card.svelte";
 import { onMount } from "svelte";
 import ElementVisbilityDetector from "../../components/ElementVisbilityDetector.svelte";
-import GameSection from "./GameSection.svelte";
-import ProjectSection from "./ProjectSection.svelte";
+import selfContent from "./SeaweedTemplate.svelte?raw";
+import {
+  GetEntryFromGlobal,
+  seaweedTemplateData
+} from "./SeaweedTemplateData";
+export let letChaos = true;
+export let name = "Turnip";
+export let email = "turnipxenon@gmail.com";
+export let linkedinSlug = "turnip-xenon";
+export let domain = "http://localhost:5173/portfolio/actual/";
+export let serverSideQueryParams = "";
+export let extraComponent = void 0;
+const entryProps = {
+  email
+};
+const entryList = import.meta.glob("./entries/*.svelte", { query: "?raw", eager: true });
+const paramQTSet = /* @__PURE__ */ new Set();
 let isVisible = true;
 let isAdvanceSettingOn = false;
-let shouldAddFunNote = false;
 $:
   isSocialsGone = !isVisible;
-import gameContent from "./GameSection.svelte?raw";
-import projectContent from "./ProjectSection.svelte?raw";
-import selfContent from "./SeaweedTemplate.svelte?raw";
-let qtMap = /* @__PURE__ */ new Map();
-const paramQTSet = /* @__PURE__ */ new Set();
+let qtfontWeight = "normal";
+let additionalFontWeight = "";
+let chaosDone = false;
+let mainVisibility = "visible";
+$:
+  mainVisibility = letChaos && !chaosDone ? "hidden" : "visible";
 const syncQT = () => {
-  if (qtMap.size === 0 || paramQTSet.size === 0) {
+  if (seaweedTemplateData.queryTermMap.size === 0 || paramQTSet.size === 0) {
     return;
   }
-  qtMap.forEach((_, k) => {
-    qtMap.set(k, paramQTSet.has(k));
+  seaweedTemplateData.queryTermMap.forEach((_, k) => {
+    seaweedTemplateData.queryTermMap.set(k, paramQTSet.has(k));
   });
-  qtMap = qtMap;
+  seaweedTemplateData.queryTermMap = seaweedTemplateData.queryTermMap;
 };
 const parseQTTerms = async () => {
   const qtSet = /* @__PURE__ */ new Set();
   const rawTermList = [];
-  [gameContent, projectContent, selfContent].forEach((body) => {
+  [...Object.values(entryList).map((e) => e.default), selfContent].forEach((body) => {
     rawTermList.push(
       ...body.split('"').filter((s) => s.startsWith("qt-"))
       // step 2: filter out texts that does not begin with "qt-"
@@ -49,78 +61,62 @@ const parseQTTerms = async () => {
       qtSet.add(nt);
     });
   });
-  qtSet.forEach((t) => qtMap.set(t, true));
+  qtSet.forEach((t) => seaweedTemplateData.queryTermMap.set(t, true));
   syncQT();
 };
 parseQTTerms();
-let gameSectionFirst = true;
-let qtfontWeight = "normal";
-let additionalFontWeight = "";
 const filterSearchParams = (searchParams) => {
   const isFunOn = searchParams.get("fun")?.trim();
   if (isFunOn === "true") {
-    shouldAddFunNote = true;
+    seaweedTemplateData.shouldAddFunNote = true;
   }
   const gameSectionFirstParam = searchParams.get("game-section-first")?.trim();
   if (gameSectionFirstParam === "false") {
-    gameSectionFirst = false;
+    seaweedTemplateData.gameSectionFirst = false;
+  }
+  const orderParam = searchParams.get("order")?.trim();
+  if (orderParam) {
+    seaweedTemplateData.groupedEntries = [];
+    orderParam.split(",").forEach((groupDefinition) => {
+      const pair = groupDefinition.split(":");
+      console.log(pair);
+      if (pair.length >= 2) {
+        const group = {
+          name: pair[0],
+          items: [],
+          gridClass: pair[2]
+        };
+        pair[1].split("|").forEach((e) => {
+          const component = GetEntryFromGlobal(e);
+          if (component) {
+            group.items.push(component);
+          }
+        });
+        seaweedTemplateData.groupedEntries.push(group);
+      }
+    });
+    seaweedTemplateData.groupedEntries = seaweedTemplateData.groupedEntries;
   }
   const qtValue = searchParams.get("qt")?.trim();
-  if (qtValue === void 0) {
+  if (qtValue !== void 0) {
+    qtfontWeight = "normal";
+    const dynamicStyle = qtValue.split(",").map((term) => {
+      paramQTSet.add(`qt-${term}`);
+      return `span.qt-${term} { font-weight: bold !important; }`;
+    }).join("\n");
+    const style = document.createElement("style");
+    style.type = "text/css";
+    style.innerText = dynamicStyle;
+    document.head.appendChild(style);
+    syncQT();
+  } else {
     qtfontWeight = "bold";
-    return;
   }
-  qtfontWeight = "normal";
-  const dynamicStyle = qtValue.split(",").map((term) => {
-    paramQTSet.add(`qt-${term}`);
-    return `span.qt-${term} { font-weight: bold !important; }`;
-  }).join("\n");
-  const style = document.createElement("style");
-  style.type = "text/css";
-  style.innerText = dynamicStyle;
-  document.head.appendChild(style);
-  syncQT();
 };
-const chaoticWordBank = ["niko", "toba", "seal", "aquarium", "ojisan", "baikal"];
-let chaosDone = false;
-const runChaos = (node) => {
-  for (let child of Array.from(node.children)) {
-    if (child.nodeType === Node.ELEMENT_NODE) {
-      runChaos(child);
-      for (const childOfChild of child.childNodes) {
-        if (childOfChild.nodeType === Node.TEXT_NODE && childOfChild.textContent?.trim()) {
-          const max = childOfChild.textContent.length;
-          childOfChild.textContent = "";
-          while (childOfChild.textContent.length < max) {
-            childOfChild.textContent += chaoticWordBank[Math.floor(Math.random() * chaoticWordBank.length)] + " ";
-          }
-        }
-      }
-      if (child.hasAttribute("href")) {
-        child.setAttribute("href", "https://crouton.net/");
-      }
-      if (child.hasAttribute("src") && !child.hasAttribute("aria-hidden")) {
-        if (child.hasAttribute("alt")) {
-          child.setAttribute("src", "https://p.potaufeu.asahi.com/a2b9-p/picture/21583312/5c3310aec77068e24844c663aa62b37c.jpg");
-        } else {
-          child.setAttribute("src", "https://video.twimg.com/ext_tw_video/1318728494256410624/pu/vid/640x360/TMklz6hiTkQu3xhn.mp4");
-          child.setAttribute("muted", "true");
-        }
-      }
-      if (child.tagName.trim() === "VIDEO") {
-        child.setAttribute("src", "https://video.twimg.com/ext_tw_video/1318728494256410624/pu/vid/640x360/TMklz6hiTkQu3xhn.mp4");
-        child.setAttribute("muted", "true");
-      }
-      if (child.tagName.trim() === "BUTTON") {
-        child.setAttribute("disabled", "true");
-      }
-    }
+onMount(async () => {
+  if (!letChaos && serverSideQueryParams) {
+    filterSearchParams(new URLSearchParams(serverSideQueryParams));
   }
-};
-let mainVisibility = "visible";
-$:
-  mainVisibility = letChaos && !chaosDone ? "hidden" : "visible";
-onMount(() => {
   if (!letChaos && $page.url.searchParams) {
     filterSearchParams($page.url.searchParams);
   }
@@ -130,27 +126,31 @@ onMount(() => {
   }
 });
 const toggleTerm = (term) => {
-  qtMap.set(term, !qtMap.get(term));
-  qtMap = qtMap;
+  seaweedTemplateData.queryTermMap.set(term, !seaweedTemplateData.queryTermMap.get(term));
+  seaweedTemplateData.queryTermMap = seaweedTemplateData.queryTermMap;
 };
+let orderUrl = "";
 let advancedUrl = domain;
-const updateUrl = () => {
+const updateUrl = (seaweedTemplateData2) => {
   const queryParams = [];
+  if (orderUrl) {
+    queryParams.push(orderUrl);
+  }
   const qtList = [];
-  qtMap.forEach((shouldBold, term) => {
+  seaweedTemplateData2.queryTermMap.forEach((shouldBold, term) => {
     if (shouldBold) {
       qtList.push(term);
     }
   });
   if (qtList.length === 0) {
     queryParams.push("qt=clear");
-  } else if (qtMap.size !== qtList.length) {
+  } else if (seaweedTemplateData2.queryTermMap.size !== qtList.length) {
     queryParams.push(`qt=${qtList.map((t) => t.slice(3, t.length)).join(",")}`);
   }
-  if (shouldAddFunNote) {
+  if (seaweedTemplateData2.shouldAddFunNote) {
     queryParams.push("fun=true");
   }
-  if (!gameSectionFirst) {
+  if (!seaweedTemplateData2.gameSectionFirst) {
     queryParams.push("game-section-first=false");
   }
   if (queryParams.length > 0) {
@@ -160,7 +160,7 @@ const updateUrl = () => {
   }
 };
 $:
-  gameSectionFirst, qtMap, shouldAddFunNote, updateUrl();
+  updateUrl(seaweedTemplateData);
 </script>
 
 <SeaweedBaseLayout bind:shouldDisplayLeadingIcons={isSocialsGone}>
@@ -189,7 +189,7 @@ $:
 							I also graduated with BS Computing Science, Specializing in Software Practice, and a
 							certificate in Computer Game Development at University of Alberta.
 						</p>
-						{#if shouldAddFunNote}
+						{#if seaweedTemplateData.shouldAddFunNote}
 							<p>
 								I'm inspired by games like Harvest Moon: Friends of Mineral Town, Rune Factory 4, Theatrhythm,
 								Bravely Default: Flying Fairy, Boku no Natsuyasumi 2, and A Short Hike.
@@ -305,13 +305,21 @@ $:
 
 		</div>
 
-		{#if (gameSectionFirst)}
-			<GameSection email={email}></GameSection>
-			<ProjectSection email={email}></ProjectSection>
-		{:else }
-			<ProjectSection email={email}></ProjectSection>
-			<GameSection email={email}></GameSection>
-		{/if}
+		{#each seaweedTemplateData.groupedEntries as group}
+			{#if group.items.length > 0}
+				<Card>
+					<section class="section-card title-card" slot="content">
+						<h1 class="text-center">{group.name}</h1>
+					</section>
+				</Card>
+
+				<section class={group.gridClass}>
+					{#each group.items as entry}
+						<svelte:component this={entry} props={entryProps}></svelte:component>
+					{/each}
+				</section>
+			{/if}
+		{/each}
 
 		{#if (!letChaos)}
 			<div aria-hidden="true" style="height: 25vh" />
@@ -320,20 +328,22 @@ $:
 				<div slot="content" class="default-card advanced-setting">
 					<h1>Advanced settings</h1>
 					<p>This one is for those curious how I customize this page.</p>
+
 					<SlideToggle name="advanced-setting-slider" bind:checked={isAdvanceSettingOn}>
 						Advanced settings: {isAdvanceSettingOn ? "On" : "Off"}
 					</SlideToggle>
+
 					{#if (isAdvanceSettingOn)}
-						<SlideToggle name="game-section-slider" bind:checked={gameSectionFirst}>
-							Should game section appear first over projects: {gameSectionFirst ? "On" : "Off"}
+						<SlideToggle name="game-section-slider" bind:checked={seaweedTemplateData.gameSectionFirst}>
+							Should game section appear first over projects: {seaweedTemplateData.gameSectionFirst ? "On" : "Off"}
 						</SlideToggle>
-						<SlideToggle name="fun-note-slider" bind:checked={shouldAddFunNote}>
-							Should add fun note in description: {shouldAddFunNote ? "On" : "Off"}
+						<SlideToggle name="fun-note-slider" bind:checked={seaweedTemplateData.shouldAddFunNote}>
+							Should add fun note in description: {seaweedTemplateData.shouldAddFunNote ? "On" : "Off"}
 						</SlideToggle>
 
 						<h3>Query terms to bold</h3>
 						<div class="query-term-grid">
-							{#each qtMap.entries() as [term, shouldBold]}
+							{#each seaweedTemplateData.queryTermMap.entries() as [term, shouldBold]}
 								<!--{@const shouldBold = false}-->
 								<button
 									class="chip {shouldBold ? 'variant-filled-tertiary' : 'variant-soft-tertiary'}"
@@ -346,9 +356,15 @@ $:
 							{/each}
 						</div>
 
+						<EntryOrderConfig bind:seaweedEntries={seaweedTemplateData.groupedEntries}
+						                  bind:orderUrl={orderUrl}
+						                  updateUrl={updateUrl}></EntryOrderConfig>
+
 						<br>
 						<p>Copy the url below and open a new page with it</p>
 						<CodeBlock language="url" code={advancedUrl}></CodeBlock>
+
+						<svelte:component this={extraComponent}></svelte:component>
 					{/if}
 				</div>
 			</Card>
@@ -379,4 +395,4 @@ $:
         gap: 0.25em;
         flex-wrap: wrap;
     }
-</style>
+</style>

package/dist/template/{Seaweed → seaweed}/SeaweedTemplate.svelte.d.ts

@@ -1,5 +1,6 @@
 import { SvelteComponent } from "svelte";
 import "./seaweed.postcss";
+import { type ComponentType } from "svelte";
 declare const __propDef: {
     props: {
         letChaos?: boolean | undefined;
@@ -7,6 +8,8 @@ declare const __propDef: {
         email?: string | undefined;
         linkedinSlug?: string | undefined;
         domain?: string | undefined;
+        serverSideQueryParams?: string | undefined;
+        extraComponent?: ComponentType | undefined;
     };
     events: {
         [evt: string]: CustomEvent<any>;

package/dist/template/seaweed/SeaweedTemplateData.d.ts

@@ -0,0 +1,23 @@
+import type { ComponentType } from "svelte";
+export declare enum GroupGridClass {
+    Games = "games-section",
+    Projects = "projects-section"
+}
+export interface EntryGroup {
+    name: string;
+    items: ComponentType[];
+    gridClass: string;
+}
+export declare const GameEntries: Readonly<EntryGroup>;
+export declare const ProjectEntries: Readonly<EntryGroup>;
+export declare const AllGroupedEntries: ReadonlyArray<EntryGroup>;
+export declare const lazyInitializeAllFlatEntries: () => void;
+export declare const GetAllEntryFromGlobal: () => Map<string, ComponentType>;
+export declare const GetEntryFromGlobal: (name: string) => ComponentType | undefined;
+export interface SeaweedTemplateData {
+    groupedEntries: EntryGroup[];
+    shouldAddFunNote: boolean;
+    queryTermMap: Map<string, boolean>;
+    gameSectionFirst: boolean;
+}
+export declare const seaweedTemplateData: SeaweedTemplateData;

package/dist/template/seaweed/SeaweedTemplateData.js

@@ -0,0 +1,68 @@
+import { DefaultHeader } from "./entries/EntryProps";
+import Pengi from "./entries/Pengi.svelte";
+import Hepcat from "./entries/Hepcat.svelte";
+import ChefWings from "./entries/ChefWings.svelte";
+import Soulwork from "./entries/Soulwork.svelte";
+import ItchPromo from "./entries/ItchPromo.svelte";
+import MigranteAlberta from "./entries/MigranteAlberta.svelte";
+import DecentralizedSocialMedia from "./entries/DecentralizedSocialMedia.svelte";
+import CustomizedYarnspinner from "./entries/CustomizedYarnspinner.svelte";
+import FullStackC from "./entries/FullStackC.svelte";
+import Workset from "./entries/Workset.svelte";
+import ThisWebpage from "./entries/ThisWebpage.svelte";
+import MockUberApp from "./entries/MockUberApp.svelte";
+import { removeProxyWrapperOnString } from "./entry_order_config/EntryOrderConfig";
+export var GroupGridClass;
+(function (GroupGridClass) {
+    GroupGridClass["Games"] = "games-section";
+    GroupGridClass["Projects"] = "projects-section";
+})(GroupGridClass || (GroupGridClass = {}));
+export const GameEntries = {
+    name: DefaultHeader.Games.toString(),
+    items: [Pengi, Hepcat, ChefWings, Soulwork, ItchPromo],
+    gridClass: GroupGridClass.Games.toString()
+};
+export const ProjectEntries = {
+    name: DefaultHeader.Projects.toString(),
+    items: [MigranteAlberta, DecentralizedSocialMedia, CustomizedYarnspinner, FullStackC, Workset, ThisWebpage, MockUberApp],
+    gridClass: GroupGridClass.Projects.toString()
+};
+export const AllGroupedEntries = [
+    {
+        name: "Relevant projects",
+        items: [],
+        gridClass: GroupGridClass.Games.toString()
+    },
+    GameEntries,
+    ProjectEntries
+];
+const allFlatEntries = new Map();
+export const lazyInitializeAllFlatEntries = () => {
+    if (allFlatEntries.size === 0) {
+        [...ProjectEntries.items, ...GameEntries.items].forEach(e => {
+            allFlatEntries.set(removeProxyWrapperOnString(e.name), e);
+        });
+    }
+};
+export const GetAllEntryFromGlobal = () => {
+    lazyInitializeAllFlatEntries();
+    return allFlatEntries;
+};
+export const GetEntryFromGlobal = (name) => {
+    lazyInitializeAllFlatEntries();
+    return allFlatEntries.get(name);
+};
+export const seaweedTemplateData = {
+    shouldAddFunNote: false,
+    queryTermMap: new Map(),
+    // todo: gameSectionFirst currently has no functionality
+    gameSectionFirst: false,
+    // copy the readonly properties into mutable values
+    groupedEntries: AllGroupedEntries.map(g => {
+        return {
+            name: g.name,
+            gridClass: g.gridClass,
+            items: g.items.map(e => e)
+        };
+    })
+};

package/dist/template/seaweed/entries/ChefWings.svelte

@@ -0,0 +1,47 @@
+<script>export let props;
+import {} from "./EntryProps";
+import HeaderChefWings from "../../../assets/game_dev/footage-chef-wings.gif";
+import LinkIcon from "../../../assets/icons/link-icon.svg";
+import Card from "../../../components/Card.svelte";
+import { getModalStore } from "@skeletonlabs/skeleton";
+const modalStore = getModalStore();
+const chefWingsWarning = {
+  type: "confirm",
+  title: "Warning: please confirm",
+  body: `This will directly link to the game itself, since this game does not have any game page or any publicly viewable source code. The game is only playable on desktop. Are you sure you wish to proceed? If there are any bugs, please report at <a href='mailto:${props.email}' target='_blank'>${props.email}</a>.`,
+  response: (r) => {
+    if (r) {
+      window.open("https://selk.io/birb-project/trunk/");
+    }
+  }
+};
+</script>
+
+<Card>
+	<section class="game-card" slot="content">
+		<img src={HeaderChefWings} alt="todo" loading="lazy">
+		<section class="game-card-body">
+
+			<h1>Chef Wings</h1>
+			<p>
+				A “roguelite-lite” where you gather ingredients in a procedurally-generated dungeon and use
+				them to cook for customers and then critics!
+			</p>
+			<p>
+				I built and documented several of the game’s systems including the game state management
+				system that extends <span class="qt-unity">Unity’s</span> existing Monobehavior lifecycle with new events,
+				and the dialogue, event, and level systems that coordinate the game flow using the interactive
+				dialogue tool YarnSpinner
+			</p>
+
+			<section class="game-link-section">
+				<button type="button" class="game-button turnip-button"
+				        title="https://selk.io/birb-project/trunk/"
+				        on:click={()=>modalStore.trigger(chefWingsWarning)}>
+					<img alt="itch.io icon" src={LinkIcon}>
+					<span>selk.io/birb-project/trunk/</span>
+				</button>
+			</section>
+		</section>
+	</section>
+</Card>

package/dist/template/seaweed/entries/ChefWings.svelte.d.ts

@@ -0,0 +1,17 @@
+import { SvelteComponent } from "svelte";
+import { type EntryProps } from "./EntryProps";
+declare const __propDef: {
+    props: {
+        props: EntryProps;
+    };
+    events: {
+        [evt: string]: CustomEvent<any>;
+    };
+    slots: {};
+};
+export type ChefWingsProps = typeof __propDef.props;
+export type ChefWingsEvents = typeof __propDef.events;
+export type ChefWingsSlots = typeof __propDef.slots;
+export default class ChefWings extends SvelteComponent<ChefWingsProps, ChefWingsEvents, ChefWingsSlots> {
+}
+export {};

package/dist/template/seaweed/entries/CustomizedYarnspinner.svelte

@@ -0,0 +1,32 @@
+<script>import {} from "./EntryProps";
+import Card from "../../../components/Card.svelte";
+import GithubIcon from "../../../assets/icons/github-mark.svg";
+import WeaverFootage from "../../../assets/others/weaver-footage.gif";
+export let props;
+</script>
+
+
+<Card>
+	<section class="project-card" slot="content">
+		<img alt="Footage of a visual novel-like dynamic dialog interaction happening on the same page we are on"
+		     src={WeaverFootage} />
+
+		<div class="project-card-body">
+			<h2>Customized Yarnspinner interpreter and dialog runner</h2>
+
+			A custom dialog interpreter, written in <span class="qt-ts">Typescript</span>, that tokenizes then
+			transpiles custom Yarnspinner dialog into a <span class="qt-ts">Typescript</span> file. The said files can
+			be used on a corresponding runner or library, also implemented alongside it, allowing the ability to play a
+			custom-flavor of YarnSpinner dialogs on <span class="qt-svelte">Svelte</span>.
+
+			<section class="game-link-section">
+				<button type="button" class="game-button turnip-button"
+				        role="link"
+				        title="https://github.com/TurnipXenon/pineapple/blob/main/docs/PineappleFiberSpec.md"
+				        on:click={() => window.open("https://github.com/TurnipXenon/pineapple/blob/main/docs/PineappleFiberSpec.md")}>
+					<img src={GithubIcon} alt="github icon">
+				</button>
+			</section>
+		</div>
+	</section>
+</Card>

package/dist/template/seaweed/entries/CustomizedYarnspinner.svelte.d.ts

@@ -0,0 +1,17 @@
+import { SvelteComponent } from "svelte";
+import { type EntryProps } from "./EntryProps";
+declare const __propDef: {
+    props: {
+        props: EntryProps;
+    };
+    events: {
+        [evt: string]: CustomEvent<any>;
+    };
+    slots: {};
+};
+export type CustomizedYarnspinnerProps = typeof __propDef.props;
+export type CustomizedYarnspinnerEvents = typeof __propDef.events;
+export type CustomizedYarnspinnerSlots = typeof __propDef.slots;
+export default class CustomizedYarnspinner extends SvelteComponent<CustomizedYarnspinnerProps, CustomizedYarnspinnerEvents, CustomizedYarnspinnerSlots> {
+}
+export {};

package/dist/template/seaweed/entries/DecentralizedSocialMedia.svelte

@@ -0,0 +1,52 @@
+<script>import {} from "./EntryProps";
+import Card from "../../../components/Card.svelte";
+import GithubIcon from "../../../assets/icons/github-mark.svg";
+export let props;
+</script>
+
+<Card>
+	<section class="project-card" slot="content">
+		<div class="project-card-body">
+
+			<h2>Decentralized social media</h2>
+
+			<p>We made a full stack decentralized social media app made with <span class="qt-react">React</span> +
+				<span class="qt-js">Javascript</span> for the client code, <span class="qt-django">Django</span> + <span
+					class="qt-python">Python</span> for the backend code, and <span class="qt-heroku">Heroku</span> for
+				deployment. This project was made
+				for
+				our Web Applications and Architecture class.</p>
+			<p>The application can connect with three other decentralized social media app in the same class:
+			</p>
+			<ul>
+				<li>
+					<a href="https://github.com/hgshah/cmput404-project/blob/main/docs/testing_other_teams.md#team-14"
+					   target="_blank">Also
+						a social media with the same Django + Python backend server where they act on behalf of
+						our users interacting with theirs</a></li>
+				<li>
+					<a href="https://github.com/hgshah/cmput404-project/blob/main/docs/testing_other_teams.md#team-7"
+					   target="_blank">A
+						social media that uses Fast API + Python for their backend server</a></li>
+				<li>
+					<a href="https://github.com/hgshah/cmput404-project/blob/main/docs/testing_other_teams.md#team-12"
+					   target="_blank">Another
+						social media that has Django + Python for their backend but we have to act on behalf of
+						our
+						users interacting with their users</a>
+				</li>
+			</ul>
+
+			<!-- todo: add tags with Javascript, React, Python, Django, Heroku -->
+
+			<section class="game-link-section">
+				<button type="button" class="game-button turnip-button"
+				        role="link"
+				        title="https://github.com/hgshah/cmput404-project"
+				        on:click={() => window.open("https://github.com/hgshah/cmput404-project")}>
+					<img src={GithubIcon} alt="github icon">
+				</button>
+			</section>
+		</div>
+	</section>
+</Card>

package/dist/template/seaweed/entries/DecentralizedSocialMedia.svelte.d.ts

@@ -0,0 +1,17 @@
+import { SvelteComponent } from "svelte";
+import { type EntryProps } from "./EntryProps";
+declare const __propDef: {
+    props: {
+        props: EntryProps;
+    };
+    events: {
+        [evt: string]: CustomEvent<any>;
+    };
+    slots: {};
+};
+export type DecentralizedSocialMediaProps = typeof __propDef.props;
+export type DecentralizedSocialMediaEvents = typeof __propDef.events;
+export type DecentralizedSocialMediaSlots = typeof __propDef.slots;
+export default class DecentralizedSocialMedia extends SvelteComponent<DecentralizedSocialMediaProps, DecentralizedSocialMediaEvents, DecentralizedSocialMediaSlots> {
+}
+export {};