README.md

@@ -1,8 +1,22 @@
-# Homesite
+# create-svelte
 
-My personal web site, powered by [`create-svelte`](https://github.com/sveltejs/kit/tree/master/packages/create-svelte).
+Everything you need to build a Svelte project, powered by [`create-svelte`](https://github.com/sveltejs/kit/tree/master/packages/create-svelte).
 
-## If you want to test this locally
+## 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 init svelte@next
+
+# create a new project in my-app
+npm init svelte@next my-app
+```
+
+> Note: the `@next` is temporary
+
+## Developing
 
 Once you've created a project and installed dependencies with `npm install` (or `pnpm install` or `yarn`), start a development server:
 
@@ -13,10 +27,14 @@ npm run dev
 npm run dev -- --open
 ```
 
-## Bundling into statics site
+## Building
 
-To create a static version of this project:
+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.

package.json

@@ -1,41 +1,41 @@
 {
-	"name": "veikko.lintujarvi.fi",
+  "name": "veikko.lintujarvi.fi",
-	"version": "1.0.0",
+  "version": "0.0.1",
-	"scripts": {
+  "scripts": {
-		"dev": "svelte-kit dev",
+    "dev": "svelte-kit dev",
-		"build": "svelte-kit build",
+    "build": "svelte-kit build",
-		"package": "svelte-kit package",
+    "package": "svelte-kit package",
-		"preview": "svelte-kit preview",
+    "preview": "svelte-kit preview",
-		"prepare": "svelte-kit sync",
+    "prepare": "svelte-kit sync",
-		"test": "playwright test",
+    "test": "playwright test",
-		"check": "svelte-check --tsconfig ./tsconfig.json",
+    "check": "svelte-check --tsconfig ./tsconfig.json",
-		"check:watch": "svelte-check --tsconfig ./tsconfig.json --watch",
+    "check:watch": "svelte-check --tsconfig ./tsconfig.json --watch",
-		"lint": "prettier --ignore-path .gitignore --check --plugin-search-dir=. . && eslint --ignore-path .gitignore .",
+    "lint": "prettier --ignore-path .gitignore --check --plugin-search-dir=. . && eslint --ignore-path .gitignore .",
-		"format": "prettier --ignore-path .gitignore --write --plugin-search-dir=. ."
+    "format": "prettier --ignore-path .gitignore --write --plugin-search-dir=. ."
-	},
+  },
-	"devDependencies": {
+  "devDependencies": {
-		"@playwright/test": "^1.19.1",
+    "@playwright/test": "^1.19.1",
-		"@sveltejs/adapter-auto": "next",
+    "@sveltejs/adapter-auto": "next",
-		"@sveltejs/adapter-static": "^1.0.0-next.29",
+    "@sveltejs/adapter-static": "^1.0.0-next.29",
-		"@sveltejs/kit": "next",
+    "@sveltejs/kit": "next",
-		"@types/cookie": "^0.4.1",
+    "@types/cookie": "^0.4.1",
-		"@typescript-eslint/eslint-plugin": "^5.10.1",
+    "@typescript-eslint/eslint-plugin": "^5.10.1",
-		"@typescript-eslint/parser": "^5.10.1",
+    "@typescript-eslint/parser": "^5.10.1",
-		"eslint": "^7.32.0",
+    "eslint": "^7.32.0",
-		"eslint-config-prettier": "^8.3.0",
+    "eslint-config-prettier": "^8.3.0",
-		"eslint-plugin-svelte3": "^3.2.1",
+    "eslint-plugin-svelte3": "^3.2.1",
-		"prettier": "^2.5.1",
+    "prettier": "^2.5.1",
-		"prettier-plugin-svelte": "^2.5.0",
+    "prettier-plugin-svelte": "^2.5.0",
-		"svelte": "^3.46.0",
+    "svelte": "^3.46.0",
-		"svelte-check": "^2.2.6",
+    "svelte-check": "^2.2.6",
-		"svelte-preprocess": "^4.10.1",
+    "svelte-preprocess": "^4.10.1",
-		"tslib": "^2.3.1",
+    "tslib": "^2.3.1",
-		"typescript": "~4.6.2"
+    "typescript": "~4.6.2"
-	},
+  },
-	"type": "module",
+  "type": "module",
-	"dependencies": {
+  "dependencies": {
-		"@fontsource/fira-mono": "^4.5.0",
+    "@fontsource/fira-mono": "^4.5.0",
-		"@lukeed/uuid": "^2.0.0",
+    "@lukeed/uuid": "^2.0.0",
-		"cookie": "^0.4.1"
+    "cookie": "^0.4.1"
-	}
+  }
 }

src/app.css

@@ -3,11 +3,11 @@
 :root {
 	font-family: 'Syne Mono', monospace;
 	--pure-white: #ffffff;
-	--primary-color: #4f2085;
+	--primary-color: #642aa7;
-	--secondary-color: #3f0d80;
+	--secondary-color: #5c0ac7;
-	--tertiary-color: #132761;
+	--tertiary-color: #385196;
-	--accent-color: #a12fce;
+	--accent-color: #4b0981;
-	--heading-color: rgba(255, 255, 255, 0.7);
+	--heading-color: rgba(0, 0, 0, 0.7);
 	--background-without-opacity: rgba(8, 4, 4, 0.7);
 	--column-width: 42rem;
 	--column-margin-top: 4rem;
@@ -49,8 +49,7 @@ body::before {
 
 h1,
 h2,
-p,
+p {
-li {
 	font-weight: 800;
 	color: var(--heading-color);
 }

src/app.html

@@ -14,7 +14,4 @@
 	<div>%svelte.body%</div>
 </body>
 
-<script async defer data-website-id="25ad484d-c6d4-452e-8f9d-364301d0da3a"
-	src="https://umami.avislacus.com/umami.js"></script>
-
 </html>

src/lib/header/Header.svelte

@@ -34,7 +34,7 @@
 	nav {
 		display: flex;
 		justify-content: center;
-		--background: rgba(42, 18, 128, 0.63);
+		--background: rgba(133, 116, 192, 0.63);
 	}
 
 	ul {
@@ -76,7 +76,7 @@
 		padding: 0 1em;
 		color: var(--heading-color);
 		font-weight: 700;
-		font-size: 0.9rem;
+		font-size: 0.8rem;
 		text-transform: uppercase;
 		letter-spacing: 0.1em;
 		text-decoration: none;

src/routes/index.svelte

@@ -3,7 +3,7 @@
 </script>
 
 <svelte:head>
-	<title>Veikko Lintujärvi</title>
+	<title>Me</title>
 </svelte:head>
 
 <section>