Initial commit

frontend/src/App.svelte

@@ -0,0 +1,19 @@
+<script lang="ts">
+import { _, locale, locales } from "svelte-i18n";
+import localeNames from "./locales";
+</script>
+
+<main>
+	<a href="https://svelte.dev/docs" target="_blank" rel="noreferrer">
+		{$_("docs.svelte")}
+	</a>
+	<br><br>
+	<select bind:value={$locale}>
+		{#each $locales as locale}
+			<option value="{locale}">{localeNames[locale]}</option>
+		{/each}
+	</select>
+</main>
+
+<style>
+</style>

frontend/src/app.css

@@ -0,0 +1,17 @@
+html, body {
+	padding: 0;
+	margin: 0;
+	min-height: 100vh;
+	min-width: 100vw;
+}
+
+body {
+	background-color: #2c2c32;
+	display: flex;
+	justify-content: center;
+	align-items: center;
+}
+
+a {
+	color: white;
+}

frontend/src/locales.ts

@@ -0,0 +1,8 @@
+export default {
+	"en-CA": "English (Canada)", // Canadian English
+	// "en-US": "English (United States)", // US English
+	// "en-GB": "English (Britain)", // British English
+	// "sv": "Svenska", // Swedish
+	// "cz": "", // Czech
+	// "nl": "", // Dutch
+};

frontend/src/main.ts

@@ -0,0 +1,23 @@
+import { getLocaleFromNavigator, init, register } from "svelte-i18n";
+import "./app.css";
+import App from "./App.svelte";
+
+// Get all of the internationalization stuff registered and operational
+import locales from "./locales";
+for (const locale in locales) {
+	register(
+		locale,
+		() => fetch(`/locales/${locale}.json`).then(r => r.json())
+	);
+};
+await init({
+	fallbackLocale: `en-CA`,
+	initialLocale: getLocaleFromNavigator(),
+});
+
+
+const app = new App({
+	target: document.getElementById("app"),
+});
+
+export default app

frontend/src/vite-env.d.ts

@@ -0,0 +1,2 @@
+/// <reference types="svelte" />
+/// <reference types="vite/client" />