New website: homepage (#789)

I am looking to rewrite the existing webpage in a JavaScript framework
for a few reasons:

- Blazor Server requires a constant websocket connection, which can be
prone to dropping.
- The original in-game webviews used JavaScript and assorted tricks such
as manipulating the window hash (see #494). It will be easier to achieve
parity with a JavaScript framework.
- I believe the depth of customization and the ecosystem around JS apps
will be needed if we want to pursue a custom component library for fully
replicating the style of the in-game webviews.

Point 1 and point 2 to a degree could be counteracted using Blazor
WebAssembly, but the initial load times on this are unacceptably long
especially for the in-game webviews.

I've chosen Svelte because I wanted to try and learn it and enjoyed what
I saw. I think that React would add too much complexity for a website
that ultimately does not need to do a lot.

This PR contains the homepage, which just sets outs the projects aims,
status and has a how-to-play guide. It won't currently deploy anywhere
and there is no CI. I am just making a pull request now so that I don't
have to make one when the rewrite is 'done' with 1000+ changed files.

Website/.gitignore

@@ -0,0 +1,10 @@
+.DS_Store
+node_modules
+/build
+/.svelte-kit
+/package
+.env
+.env.*
+!.env.example
+vite.config.js.timestamp-*
+vite.config.ts.timestamp-*

Website/.npmrc

@@ -0,0 +1,2 @@
+engine-strict=true
+save-prefix=""

Website/.prettierignore

@@ -0,0 +1,6 @@
+# Ignore files for PNPM, NPM and YARN
+pnpm-lock.yaml
+package-lock.json
+yarn.lock
+src/lib/shadcn/**/*
+.svelte-

Website/.prettierrc

@@ -0,0 +1,15 @@
+{
+	"useTabs": true,
+	"singleQuote": true,
+	"trailingComma": "none",
+	"printWidth": 100,
+	"plugins": ["prettier-plugin-svelte", "prettier-plugin-tailwindcss"],
+	"overrides": [
+		{
+			"files": "*.svelte",
+			"options": {
+				"parser": "svelte"
+			}
+		}
+	]
+}

Website/README.md

@@ -0,0 +1,38 @@
+# create-svelte
+
+Everything you need to build a Svelte project, powered by [`create-svelte`](https://github.com/sveltejs/kit/tree/main/packages/create-svelte).
+
+## Creating a project
+
+If you're seeing this, you've probably already done this step. Congrats!
+
+```bash
+# create a new project in the current directory
+npm create svelte@latest
+
+# create a new project in my-app
+npm create svelte@latest my-app
+```
+
+## Developing
+
+Once you've created a project and installed dependencies with `npm install` (or `pnpm install` or `yarn`), start a development server:
+
+```bash
+npm run dev
+
+# or start the server and open the app in a new browser tab
+npm run dev -- --open
+```
+
+## Building
+
+To create a production version of your app:
+
+```bash
+npm run build
+```
+
+You can preview the production build with `npm run preview`.
+
+> To deploy your app, you may need to install an [adapter](https://kit.svelte.dev/docs/adapters) for your target environment.

Website/components.json

@@ -0,0 +1,15 @@
+{
+	"$schema": "https://shadcn-svelte.com/schema.json",
+	"style": "default",
+	"tailwind": {
+		"config": "tailwind.config.js",
+		"css": "src/app.pcss",
+		"baseColor": "slate",
+		"cssVariables": true
+	},
+	"aliases": {
+		"components": "$lib/shadcn/components/",
+		"utils": "$lib/shadcn/utils.js"
+	},
+	"typescript": true
+}

Website/eslint.config.js

@@ -0,0 +1,45 @@
+import js from '@eslint/js';
+import eslintConfigPrettier from 'eslint-config-prettier';
+import tsEslint from 'typescript-eslint';
+import eslintPluginSvelte from 'eslint-plugin-svelte';
+import svelteParser from 'svelte-eslint-parser';
+import globals from 'globals';
+
+/** @type { import("eslint").Linter.Config } */
+export default [
+	js.configs.recommended,
+	...tsEslint.configs.recommended,
+	...eslintPluginSvelte.configs['flat/recommended'],
+	eslintConfigPrettier,
+	...eslintPluginSvelte.configs['flat/prettier'],
+	{
+		files: ['**/*.svelte'],
+		languageOptions: {
+			ecmaVersion: 2022,
+			sourceType: 'module',
+			globals: { ...globals.node, ...globals.browser },
+			parser: svelteParser,
+			parserOptions: {
+				parser: tsEslint.parser,
+				extraFileExtensions: ['.svelte']
+			}
+		}
+	},
+	{
+		ignores: [
+			'.DS_Store',
+			'node_modules',
+			'build',
+			'.svelte-kit',
+			'package',
+			'.env',
+			'.env.*',
+			'!.env.example',
+			'pnpm-lock.yaml',
+			'package-lock.json',
+			'postcss.config.cjs',
+			'yarn.lock',
+			'src/lib/shadcn'
+		]
+	}
+];

Website/package.json

@@ -0,0 +1,66 @@
+{
+	"name": "dawnshard",
+	"version": "0.0.1",
+	"private": true,
+	"scripts": {
+		"dev": "vite dev",
+		"build": "vite build",
+		"preview": "vite preview",
+		"test": "playwright test",
+		"check": "svelte-kit sync && svelte-check --tsconfig ./tsconfig.json",
+		"check:watch": "svelte-kit sync && svelte-check --tsconfig ./tsconfig.json --watch",
+		"lint": "prettier --check . && eslint .",
+		"format": "prettier --write .",
+		"shadcn": "pnpm dlx shadcn-svelte@latest add"
+	},
+	"devDependencies": {
+		"@eslint/js": "9.2.0",
+		"@playwright/test": "1.44.0",
+		"@sveltejs/adapter-auto": "3.2.0",
+		"@sveltejs/enhanced-img": "0.2.0",
+		"@sveltejs/kit": "2.5.7",
+		"@sveltejs/vite-plugin-svelte": "3.1.0",
+		"@types/eslint": "8.56.10",
+		"@typescript-eslint/eslint-plugin": "7.8.0",
+		"@typescript-eslint/parser": "7.8.0",
+		"autoprefixer": "10.4.19",
+		"eslint": "9.2.0",
+		"eslint-config-prettier": "9.1.0",
+		"eslint-plugin-svelte": "2.38.0",
+		"postcss": "8.4.38",
+		"postcss-load-config": "5.1.0",
+		"prettier": "3.2.5",
+		"prettier-plugin-svelte": "3.2.3",
+		"prettier-plugin-tailwindcss": "0.5.14",
+		"svelte": "4.2.16",
+		"svelte-check": "3.7.1",
+		"tailwindcss": "3.4.3",
+		"tslib": "2.6.2",
+		"typescript": "5.4.5",
+		"typescript-eslint": "7.8.0",
+		"vite": "5.2.11"
+	},
+	"type": "module",
+	"dependencies": {
+		"bits-ui": "0.21.7",
+		"buffer": "6.0.3",
+		"clsx": "2.1.1",
+		"globals": "15.1.0",
+		"lucide-svelte": "0.378.0",
+		"mode-watcher": "0.3.0",
+		"tailwind-merge": "2.3.0",
+		"tailwind-variants": "0.2.1",
+		"vaul-svelte": "0.3.0"
+	},
+	"pnpm": {
+		"supportedArchitectures": {
+			"os": [
+				"win32",
+				"linux"
+			],
+			"cpu": [
+				"x64"
+			]
+		}
+	}
+}

Website/playwright.config.ts

@@ -0,0 +1,12 @@
+import type { PlaywrightTestConfig } from '@playwright/test';
+
+const config: PlaywrightTestConfig = {
+	webServer: {
+		command: 'npm run build && npm run preview',
+		port: 4173
+	},
+	testDir: 'tests',
+	testMatch: /(.+\.)?(test|spec)\.[jt]s/
+};
+
+export default config;