moved files from old repo and rewrote some

Moved some contstants to a constants.ts file.
Added LinkedIn link in footer. Added option to add icon to ExternalLinks Refactored some code in ExternalLink. Signed-off-by: Martin Berg Alstad <git@martials.no>
2024-12-17 16:58:58 +00:00 · 2024-10-22 20:46:53 +02:00 · 2024-10-20 22:25:52 +02:00 · 2024-10-20 12:05:32 +02:00 · 2024-10-20 11:01:54 +02:00 · 2024-10-12 19:07:55 +02:00
101 changed files with 4135 additions and 1338 deletions
--- a/.dockerignore
+++ b/.dockerignore
@ -0,0 +1,5 @@
+.astro
+.gitea
+.DS_Store
+node_modules
+dist
--- a/.env
+++ b/.env
@ -1 +0,0 @@
-GIT_URL="https://git.martials.no"
--- a/.gitea/workflows/build.yaml
+++ b/.gitea/workflows/build.yaml
@ -1,40 +0,0 @@
-name: Build and deploy website
-
-on:
-  push:
-    branches:
-      - master
-  pull_request:
-    branches:
-      - master
-
-jobs:
-  build:
-    runs-on: ubuntu-latest
-
-    steps:
-      - name: Check out repository code
-        uses: actions/checkout@v4
-      - name: Install dependencies
-        run: echo y | npm exec -- pnpm install
-      - name: Build
-        run: npm exec -- pnpm build
-      - name: Upload artifacts
-        uses: actions/upload-artifact@v3 # Deprecated and v4+ is not supported for GHES
-        with:
-          name: dist
-          path: dist
-
-  deploy:
-    runs-on: host
-
-    steps:
-      - name: Download artifacts
-        uses: actions/download-artifact@v3
-        with:
-          name: dist
-          path: dist
-      - name: Move files to server
-        run: |
-          rm -rf /var/www/beta.martials.no/*
-          cp -r dist/* /var/www/beta.martials.no
--- a/.gitea/workflows/deploy.yaml
+++ b/.gitea/workflows/deploy.yaml
@ -0,0 +1,19 @@
+name: Build and deploy website
+
+on:
+  push:
+    branches:
+      - master
+  pull_request:
+    branches:
+      - master
+
+jobs:
+  build:
+    runs-on: host
+
+    steps:
+      - name: Check out repository code
+        uses: actions/checkout@v4
+      - name: Run docker-compose
+        run: docker compose up -d --build
--- a/26
+++ b/26
@ -0,0 +1,26 @@
+FROM node:lts-alpine AS base
+WORKDIR /app
+
+# By copying only the package.json and package-lock.json here, we ensure that the following `-deps` steps are independent of the source code.
+# Therefore, the `-deps` steps will be skipped if only the source code changes.
+COPY package.json pnpm-lock.yaml ./
+COPY project.inlang ./project.inlang
+
+FROM base AS prod-deps
+RUN echo y | npm exec -- pnpm install --prod
+
+FROM base AS build-deps
+RUN npm exec -- pnpm install
+
+FROM build-deps AS build
+COPY . .
+RUN npm exec -- pnpm run build
+
+FROM base AS runtime
+COPY --from=prod-deps /app/node_modules ./node_modules
+COPY --from=build /app/dist ./dist
+
+ENV HOST=0.0.0.0
+ENV PORT=4321
+EXPOSE 4321
+CMD node ./dist/server/entry.mjs
--- a/astro.config.mjs
+++ b/astro.config.mjs
@ -1,10 +1,14 @@
 // @ts-check
-import { defineConfig } from "astro/config"
+import { defineConfig, envField } from "astro/config"
+import paraglide from "@inlang/paraglide-astro"
 import tailwind from "@astrojs/tailwind"
 import sitemap from "@astrojs/sitemap"
-import { loadEnv } from "vite"
-import mdx from "@astrojs/mdx"
 import svelte from "@astrojs/svelte"
+import node from "@astrojs/node"
+import mdx from "@astrojs/mdx"
+import icon from "astro-icon"
+
+import { loadEnv } from "vite"

 const { url } = process.env.URL
  ? loadEnv(process.env.URL, process.cwd(), "")
@ -13,9 +17,29 @@ const { url } = process.env.URL
 // https://astro.build/config
 export default defineConfig({
  site: url,
+  output: "server",
  i18n: {
    defaultLocale: "nb",
    locales: ["nb", "en"]
  },
-  integrations: [tailwind(), sitemap(), mdx(), svelte()]
+  integrations: [
+    tailwind(),
+    sitemap(),
+    mdx(),
+    svelte(),
+    icon(),
+    paraglide({
+      // recommended settings
+      project: "./project.inlang",
+      outdir: "./src/paraglide" //where your files should be
+    })
+  ],
+  adapter: node({
+    mode: "standalone"
+  }),
+  env: {
+    schema: {
+      URL: envField.string({ context: "client", access: "public" })
+    }
+  }
 })
--- a/docker-compose.yml
+++ b/docker-compose.yml
@ -0,0 +1,9 @@
+services:
+  web:
+    container_name: martials.no
+    restart: always
+    build:
+      context: .
+      dockerfile: Dockerfile
+    ports:
+      - "4321:4321"
--- a/messages/en.json
+++ b/messages/en.json
@ -8,7 +8,18 @@
  "myLinks": "My links",
  "myProjects": "My projects",
  "hardware": "Hardware",
+  "accessories": "Accessories",
  "sourceCode": "Source code",
  "createdAt": "Created at",
-  "updatedAt": "Updated at"
+  "updatedAt": "Updated at",
+  "forPersonalProjects": "For personal projects",
+  "status": "Status",
+  "name": "Name",
+  "subject": "Subject",
+  "email": "Email",
+  "message": "Message",
+  "send": "Send",
+  "auto": "Auto",
+  "norwegian": "Norwegian",
+  "english": "English"
 }
--- a/messages/nb.json
+++ b/messages/nb.json
@ -8,7 +8,18 @@
  "myLinks": "Mine lenker",
  "myProjects": "Mine prosjekter",
  "hardware": "Maskinvare",
+  "accessories": "Tilbehør",
  "sourceCode": "Kildekode",
  "createdAt": "Opprettet",
-  "updatedAt": "Oppdatert"
+  "updatedAt": "Oppdatert",
+  "forPersonalProjects": "For personlige prosjekter",
+  "status": "Status",
+  "name": "Navn",
+  "subject": "Emne",
+  "email": "E-post",
+  "message": "Melding",
+  "send": "Send",
+  "auto": "Auto",
+  "norwegian": "Norsk",
+  "english": "Engelsk"
 }
--- a/package.json
+++ b/package.json
@ -9,24 +9,31 @@
    "preview": "astro preview",
    "astro": "astro",
    "postinstall": "paraglide-js compile --project ./project.inlang --outdir ./src/paraglide",
-    "format": "prettier --write \"./src/**/*.{js,mjs,ts,astro,svelte,css,md,json}\""
+    "format": "prettier --write \"./src/**/*.{js,mjs,ts,astro,svelte,css,md,json}\"",
+    "watch-messages": "paraglide-js compile --watch --project ./project.inlang --outdir ./src/paraglide"
  },
  "dependencies": {
-    "@astrojs/check": "^0.9.3",
-    "@astrojs/mdx": "^3.1.7",
-    "@astrojs/sitemap": "^3.1.6",
-    "@astrojs/svelte": "^5.7.1",
-    "@astrojs/tailwind": "^5.1.1",
+    "@astrojs/check": "^0.9.4",
+    "@astrojs/mdx": "4.0.0-beta.2",
+    "@astrojs/node": "9.0.0-beta.2",
+    "@astrojs/sitemap": "^3.2.1",
+    "@astrojs/svelte": "6.0.0-beta.1",
+    "@astrojs/tailwind": "^5.1.2",
+    "@iconify-json/pajamas": "^1.2.3",
+    "@inlang/paraglide-astro": "^0.2.2",
+    "@inlang/paraglide-js": "1.11.2",
    "@tailwindcss/typography": "^0.5.15",
-    "astro": "^4.15.9",
+    "astro": "5.0.0-beta.5",
+    "astro-icon": "^1.1.1",
+    "diff": "^7.0.0",
    "sharp": "^0.33.5",
    "svelte": "^4.2.19",
    "tailwindcss": "^3.4.13",
-    "typescript": "^5.6.2"
+    "typescript": "^5.6.3"
  },
  "devDependencies": {
-    "@inlang/paraglide-js": "1.11.2",
-    "daisyui": "^4.12.10",
+    "@types/diff": "^5.2.3",
+    "daisyui": "^4.12.13",
    "prettier": "^3.3.3",
    "prettier-plugin-astro": "^0.14.1",
    "prettier-plugin-svelte": "^3.2.7",
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
--- a/public/.well-known/security.txt
+++ b/public/.well-known/security.txt
@ -0,0 +1,4 @@
+Contact: mailto:security@martials.no
+Expires: 2029-12-31T23:00:00.000Z
+Preferred-Languages: no,en
+Canonical: https://martials.no/.well-known/security.txt
--- a/src/components/ContactMeForm.astro
+++ b/src/components/ContactMeForm.astro
@ -1,37 +0,0 @@
---
-// TODO form
-// TODO self-host email server
-import "../styles/global.css"
-import Input from "../components/Input.astro"
-import * as console from "node:console"
-
-if (Astro.request.method === "POST") {
-  try {
-    const data = await Astro.request.formData()
-    const name = data.get("name")
-    const subject = data.get("subject")
-    const email = data.get("email")
-    const message = data.get("message")
-    // TODO Do something with the data
-    console.info({ name, subject, email, message })
-  } catch (error) {
-    if (error instanceof Error) {
-      console.error(error.message)
-    }
-  }
-}
---
-
-<div class="text-red-600 text-center">In development</div>
-
-<form class="flex flex-col gap-2 max-w-[500px] mx-auto" method="post">
-  <Input label="Name" type="text" name="name" required />
-  <Input label="Subject" name="subject" required />
-  <Input label="Email" name="email" />
-  <label class="flex flex-col"
-    >Message
-    <textarea name="message" class="textarea textarea-bordered" required
-    ></textarea>
-  </label>
-  <button type="submit">Send</button>
-</form>
--- a/src/components/Footer.astro
+++ b/src/components/Footer.astro
@ -1,9 +1,21 @@
 ---
 import GiteaLink from "./links/GiteaLink.astro"
-const gitUrl = import.meta.env.GIT_URL
+import ExternalLink from "./links/ExternalLink.astro"
+import LanguageButtonGroup from "./LanguageButtonGroup.astro"
+import * as m from "@/paraglide/messages"
+import { LINKED_IN_URL, THIS_GIT_URL, STATUS_URL } from "../constants"
 ---

-<div class="divider"></div>
-<div class="mx-auto">
-  <GiteaLink href={gitUrl} />
+<div class="divider" />
+<div class="py-5 flex flex-row gap-1 justify-around w-full items-center">
+  <div class="flex flex-col gap-1">
+    <GiteaLink href={THIS_GIT_URL} />
+    <ExternalLink href={LINKED_IN_URL} iconLeft="pajamas:linkedin" iconLeftAriaLabel="LinkedIn" title="LinkedIn">
+      LinkedIn
+    </ExternalLink>
+    <ExternalLink href={STATUS_URL} iconLeft="pajamas:status-health" iconLeftAriaLabel="Status health" title="Status">
+      {m.status()}
+    </ExternalLink>
+  </div>
+  <LanguageButtonGroup />
 </div>
--- a/src/components/Greeting.astro
+++ b/src/components/Greeting.astro
@ -1,20 +1,22 @@
 ---
 import { Image } from "astro:assets"
-import me from "../images/me.jpg"
-import * as m from "../paraglide/messages.js"
-import "../styles/global.css"
+import me from "@/images/polite-cat.jpg"
+import * as m from "@/paraglide/messages.js"
+import "@/styles/global.css"
 ---

-<div class="flex items-center justify-around">
+<div class="flex items-center justify-around flex-wrap">
  <div class="m-5">
-    <h1 class="text-7xl font-bold">
+    <h1 class="sm:text-7xl font-bold">
      {m.hiIm()}
      <br />
      Martin Berg Alstad
      <br />
      {m.position()}
    </h1>
-    <p class="mx-1 my-10">{m.aboutMe()}</p>
+    <p class="mx-1 sm:my-10">{m.aboutMe()}</p>
  </div>
-  <Image src={me} alt="Me on a hike" width="400" height="400" class="m-5" />
+  <Image src={me} alt="Me on a hike" width="400" height="400" class="p-5 mx-auto" loading={"eager"} />
 </div>
+<!-- Mastodon verification -->
+<a rel="me" href="https://snabelen.no/@Martials" class="hidden">Mastodon</a>
--- a/src/components/HardwarePage.svelte
+++ b/src/components/HardwarePage.svelte
@ -1,23 +1,35 @@
 <script lang="ts">
  import Select from "./Select.svelte"
-  import { getCollection } from "astro:content"
+  import * as m from "@/paraglide/messages"
+  import CollapseList from "@/components/collapse/CollapseList.svelte"
+  import type { CollectionEntry } from "astro:content"

-  getCollection("hardware")
-    .then((collection) => {
-      console.log(collection)
-    })
+  export let hardware: CollectionEntry<"hardware">[] = []

-  // TODO fetch selected hardware from content collection
-  let selectedHardware: string = "CPU"
+  const hardwareOptions = hardware.map((item) => ({
+    key: item.id,
+    value: item.data.title
+  }))

+  let selectedHardwareKey: string = hardware[0].id
+  $: selectedHardware = hardware.find((item) => item.id === selectedHardwareKey)!
+
+  // TODO bind to component
  function onChange({ detail }: CustomEvent<string>) {
-    console.log(detail)
-    selectedHardware = detail
+    selectedHardwareKey = detail
  }

-  // TODO show the selected hardware
 </script>
-<div>
-  <h2>{selectedHardware}</h2>
-  <Select options={["CPU", "GPU", "RAM"]} on:change={onChange} />
+<div class="px-2 max-w-[750px] sm:min-w-[750px] w-screen">
+  <h1 class="text-center">{m.hardware()}</h1>
+  <div>
+    <Select options={hardwareOptions} on:change={onChange} class="mx-auto w-max" />
+  </div>
+  <br />
+
+  <CollapseList items={selectedHardware.data.hardware} title={m.hardware()} />
+  <div class="my-2" />
+  {#if (selectedHardware.data.accessories)}
+    <CollapseList items={selectedHardware.data.accessories} title={m.accessories()} />
+  {/if}
 </div>
--- a/src/components/Input.astro
+++ b/src/components/Input.astro
@ -1,28 +0,0 @@
---
-interface Props {
-  label: string
-  type?: "text" | "email" | "password" | "number"
-  name: string
-  required?: boolean
-  placeholder?: string
-}
-
-const {
-  label,
-  type = "text",
-  name,
-  required = false,
-  placeholder,
-} = Astro.props
---
-
-<label class="flex flex-col">
-  {label}
-  <input
-    class="input input-bordered"
-    type={type}
-    name={name}
-    required={required}
-    placeholder={placeholder}
-  />
-</label>
--- a/src/components/Input.svelte
+++ b/src/components/Input.svelte
@ -0,0 +1,19 @@
+<script lang="ts">
+  export let label: string
+  export let type: "text" | "email" | "password" | "number" = "text"
+  export let name: string
+  export let required: boolean = false
+  export let placeholder: string
+  export let inputClass: string
+</script>
+
+<label class="flex flex-col ${$$restProps.class}">
+  {label}
+  <input
+    class="input input-bordered ${inputClass}"
+    type={type}
+    name={name}
+    required={required}
+    placeholder={placeholder}
+  />
+</label>
--- a/src/components/LanguageButtonGroup.astro
+++ b/src/components/LanguageButtonGroup.astro
@ -0,0 +1,11 @@
+---
+import LocaleLink from "./links/LocaleLink.astro"
+import { type NavLink, resolvePathname } from "@/utils/linking"
+
+const currentPath = resolvePathname(Astro.url.pathname)
+---
+
+<div class="join">
+  <LocaleLink to={currentPath as NavLink} lang="nb" class="btn join-item">Norsk</LocaleLink>
+  <LocaleLink to={currentPath as NavLink} lang="en" class="btn join-item">English</LocaleLink>
+</div>
--- a/src/components/Menu.svelte
+++ b/src/components/Menu.svelte
@ -0,0 +1,7 @@
+<script lang="ts">
+
+</script>
+
+<div>
+  <!-- TODO -->
+</div>
--- a/src/components/Navbar.astro
+++ b/src/components/Navbar.astro
@ -1,13 +1,14 @@
 ---
-import Links from "../links"
+import LocaleLink from "./links/LocaleLink.astro"
+import Links from "@/links"
 ---

 <div class="flex justify-end">
  {
    Links.map(({ to, label }) => (
-      <a href={to} class="m-2 hover:underline">
-        {label}
-      </a>
+      <LocaleLink to={to} class="m-2 hover:underline">
+        {label()}
+      </LocaleLink>
    ))
  }
 </div>
--- a/src/components/Row.svelte
+++ b/src/components/Row.svelte
@ -0,0 +1,7 @@
+<script lang="ts">
+
+</script>
+
+<div class="flex flex-row items-center ${$$restProps.class}">
+  <slot />
+</div>
--- a/src/components/Select.svelte
+++ b/src/components/Select.svelte
@ -1,15 +1,22 @@
 <script lang="ts">
  import { createEventDispatcher } from "svelte"

-  export let options: string[] = []
+  // TODO move to types?
+  interface Option {
+    key: string
+    value: string
+  }
+
+  export let options: Option[] = []
+  // TODO bind data instead of dispatching events
  const dispatch = createEventDispatcher<{ change: string }>()
 </script>

 <select
-  class="select select-bordered w-full max-w-xs"
+  class="select select-bordered w-full max-w-xs ${$$restProps.class}"
  on:change={(value) => dispatch("change", value.currentTarget.value)}
 >
-  {#each options as option}
-    <option value={option}>{option}</option>
+  {#each options as { key, value }}
+    <option value={key}>{value}</option>
  {/each}
 </select>
--- a/src/components/Switch.svelte
+++ b/src/components/Switch.svelte
@ -0,0 +1,29 @@
+<script lang="ts">
+
+  export let defaultValue: boolean = false
+  export let title: string
+  export let onChange: (value: boolean) => void
+  export let name: string
+  export let id: string
+
+  let checked = defaultValue
+
+  function handleChange() {
+    checked = !checked
+    if (onChange) {
+      onChange(checked)
+    }
+  }
+</script>
+
+<button
+  id={id}
+  on:click={handleChange}
+  title={title}
+  class={`${checked ? "bg-cyan-900" : "bg-gray-500"} relative my-2 inline-flex h-6 w-11 items-center rounded-full ${$$restProps.class}`}
+>
+  <span class={"sr-only"}>{name}</span>
+  <span
+    class={`${checked ? "translate-x-6" : "translate-x-1"} inline-block h-4 w-4 transform rounded-full bg-white transition-all`}
+  />
+</button>
--- a/src/components/buttons/Button.svelte
+++ b/src/components/buttons/Button.svelte
@ -0,0 +1,11 @@
+<script lang="ts">
+
+  export let id: string | undefined = undefined
+  export let title: string
+  export let type: "button" | "submit" | "reset" = "button"
+
+</script>
+
+<button id={id} class="btn" title={title} type={type}>
+  <slot />
+</button>
--- a/src/components/collapse/Collapse.svelte
+++ b/src/components/collapse/Collapse.svelte
@ -0,0 +1,10 @@
+<script lang="ts">
+  export let title: string = ""
+</script>
+
+<details class="collapse collapse-arrow bg-base-200">
+  <summary class="collapse-title text-xl font-medium">{title}</summary>
+  <div class="collapse-content">
+    <slot />
+  </div>
+</details>
--- a/src/components/collapse/CollapseList.svelte
+++ b/src/components/collapse/CollapseList.svelte
@ -0,0 +1,15 @@
+<script lang="ts">
+  import Collapse from "@/components/collapse/Collapse.svelte"
+
+  export let items: string[] = []
+  export let title: string = ""
+
+</script>
+
+<Collapse title={title}>
+  <ul>
+    {#each items as item}
+      <li class="list-disc ml-5">{item}</li>
+    {/each}
+  </ul>
+</Collapse>
--- a/src/components/contactMe/ContactMeForm.astro
+++ b/src/components/contactMe/ContactMeForm.astro
@ -0,0 +1,17 @@
+---
+import Input from "@/components/Input.svelte"
+import * as m from "@/paraglide/messages.js"
+// TODO self-host email server
+---
+
+<form class="flex flex-col gap-2 max-w-[500px] mx-auto" method="post" action="https://formspree.io/f/mknykgbn">
+  <Input label={m.name()} type="text" name="name" required />
+  <Input label={m.subject()} name="subject" required />
+  <Input label={m.email()} name="_replyto" />
+  <input name="_gotcha" type="text" class={"hidden"} /> { /*Honeypot spam filter*/}
+  <label class="flex flex-col">
+    {m.message()}
+    <textarea name="message" class="textarea textarea-bordered" required></textarea>
+  </label>
+  <button type="submit">{m.send()}</button>
+</form>
--- a/src/components/contactMe/ContactMePage.astro
+++ b/src/components/contactMe/ContactMePage.astro
@ -0,0 +1,7 @@
+---
+import ContactMeForm from "./ContactMeForm.astro"
+import * as m from "@/paraglide/messages"
+---
+
+<h1 class="text-center">{m.contactMe()}</h1>
+<ContactMeForm />
--- a/src/components/icons/Gitea.astro
+++ b/src/components/icons/Gitea.astro
@ -0,0 +1,10 @@
+---
+import PajamasIcon from "./PajamasIcon.astro"
+interface Props {
+  class?: string
+}
+
+const { class: clazz } = Astro.props
+---
+
+<PajamasIcon name="pajamas:gitea" aria-label="Gitea" class={clazz} />
--- a/src/components/icons/PajamasIcon.astro
+++ b/src/components/icons/PajamasIcon.astro
@ -0,0 +1,14 @@
+---
+import type { PajamasIcon } from "@/types/icons"
+import type { ComponentProps } from "@/types/props"
+import { Icon } from "astro-icon/components"
+
+interface Props extends ComponentProps {
+  name: PajamasIcon
+  "aria-label": string
+}
+
+const { name, class: clazz, ...props } = Astro.props
+---
+
+<Icon name={name} class:list={["w-6 h-6", clazz]} {...props} />
--- a/src/components/icons/PajamasIcon.svelte
+++ b/src/components/icons/PajamasIcon.svelte
@ -0,0 +1,10 @@
+<script lang="ts">
+  import type { PajamasIcon } from "@/types/icons"
+  import { Icon } from "astro-icon/components"
+
+  export let name: PajamasIcon
+  export let ariaLabel: string
+
+</script>
+
+<Icon name={name} class="w-6 h-6 ${$$restProps.class}" aria-label={ariaLabel} />
--- a/src/components/links/ExternalLink.astro
+++ b/src/components/links/ExternalLink.astro
@ -1,12 +1,28 @@
 ---
-interface Props {
-  href: string
-  class?: string
+import type { LinkProps } from "@/types/props"
+import type { PajamasIcon } from "@/types/icons"
+import ExternalLinkTextOnly from "./ExternalLinkTextOnly.astro"
+import ExternalLinkIconLeft from "./ExternalLinkIconLeft.astro"
+
+interface Props extends LinkProps {
+  iconLeft?: PajamasIcon
+  iconLeftAriaLabel?: string
 }

-const { href, class: clazz } = Astro.props
+const { iconLeft, iconLeftAriaLabel, ...props } = Astro.props
+if (iconLeft && !iconLeftAriaLabel) {
+  throw new Error("ExternalLink: iconLeftAriaLabel is required when iconLeft is provided")
+}
 ---

-<a href={href} target="_blank" rel="noopener" class:list={["link", clazz]}>
+{  iconLeft && iconLeftAriaLabel
+  ?
+<ExternalLinkIconLeft iconLeft={iconLeft} iconLeftAriaLabel={iconLeftAriaLabel} {...props}>
  <slot />
-</a>
+</ExternalLinkIconLeft>
+  :
+<ExternalLinkTextOnly {...props}>
+  <slot />
+</ExternalLinkTextOnly>
+  }
+
--- a/src/components/links/ExternalLinkIconLeft.astro
+++ b/src/components/links/ExternalLinkIconLeft.astro
@ -0,0 +1,20 @@
+---
+import type { PajamasIcon as PajamasIconType } from "@/types/icons"
+import type { LinkProps } from "@/types/props"
+import ExternalLinkTextOnly from "./ExternalLinkTextOnly.astro"
+import PajamasIcon from "../icons/PajamasIcon.astro"
+
+interface Props extends LinkProps {
+  iconLeft: PajamasIconType
+  iconLeftAriaLabel: string
+}
+const { href, class: clazz, iconLeft, iconLeftAriaLabel, ...props } = Astro.props
+---
+
+<div class="flex items-center">
+  <PajamasIcon name={iconLeft} aria-label={iconLeftAriaLabel} class="mr-2" />
+  <ExternalLinkTextOnly href={href} class={clazz} {...props}>
+    <slot />
+  </ExternalLinkTextOnly>
+</div>
+
--- a/src/components/links/ExternalLinkTextOnly.astro
+++ b/src/components/links/ExternalLinkTextOnly.astro
@ -0,0 +1,12 @@
+---
+import type { LinkProps } from "@/types/props"
+
+interface Props extends LinkProps {
+}
+
+const { href, class: clazz, ...props } = Astro.props
+---
+
+<a href={href} target="_blank" rel="noopener" class:list={[clazz]} {...props}>
+  <slot />
+</a>
--- a/src/components/links/GiteaLink.astro
+++ b/src/components/links/GiteaLink.astro
@ -1,7 +1,6 @@
 ---
 import ExternalLink from "./ExternalLink.astro"
-import * as m from "../../paraglide/messages"
-import Gitea from "../../icons/Gitea.astro"
+import * as m from "@/paraglide/messages"
 interface Props {
  href: string
 }
@ -9,8 +8,7 @@ const { href } = Astro.props
 ---

 <div>
-  <ExternalLink href={href} class="flex items-center gap-1">
-    <Gitea class="w-6 h-6" />
+  <ExternalLink iconLeft="pajamas:gitea" iconLeftAriaLabel="Gitea" href={href}>
    {m.sourceCode()}
  </ExternalLink>
 </div>
--- a/src/components/links/LocaleLink.astro
+++ b/src/components/links/LocaleLink.astro
@ -0,0 +1,16 @@
+---
+import { languageTag, type AvailableLanguageTag } from "@/paraglide/runtime"
+import { localizePathname, type NavLink } from "@/utils/linking"
+import type { ComponentProps } from "@/types/props"
+
+interface Props extends ComponentProps {
+  to: NavLink
+  lang?: AvailableLanguageTag
+}
+
+const { to, class: clazz, lang = languageTag() } = Astro.props
+---
+
+<a href={localizePathname(to, lang)} class={clazz}>
+  <slot />
+</a>
--- a/src/components/myLinks/LinkCard.astro
+++ b/src/components/myLinks/LinkCard.astro
@ -0,0 +1,23 @@
+---
+import ExternalLink from "../links/ExternalLink.astro"
+import PajamasIcon from "../icons/PajamasIcon.astro"
+import type { MyLink } from "./myLinks"
+
+interface Props extends MyLink {
+  class?: string
+}
+
+const { title, message, url, icon, class: clazz } = Astro.props
+---
+
+<ExternalLink href={url}>
+  <div class:list={["card bg-neutral", clazz]}>
+    <div class="card-body p-5 flex flex-row items-center">
+      <PajamasIcon name={icon ?? "pajamas:link"} aria-label={icon ? title : "Link"} />
+      <div>
+        <h5 class="card-title">{title}</h5>
+        <p class="prose">{message}</p>
+      </div>
+    </div>
+  </div>
+</ExternalLink>
--- a/src/components/myLinks/LinksPage.astro
+++ b/src/components/myLinks/LinksPage.astro
@ -0,0 +1,15 @@
+---
+import links from "./myLinks"
+import LinkCard from "./LinkCard.astro"
+import "@/styles/global.css"
+import * as m from "@/paraglide/messages"
+---
+
+<h1 class="text-center">{m.myLinks()}</h1>
+<div class="flex flex-col mx-auto w-fit gap-5">
+  {
+    links.map((link) => (
+      <LinkCard {...link} class="max-w-[500px] sm:min-w-96" />
+    ))
+  }
+</div>
--- a/src/components/myLinks/myLinks.ts
+++ b/src/components/myLinks/myLinks.ts
@ -0,0 +1,46 @@
+import type { PajamasIcon } from "@/types/icons.ts"
+import * as m from "@/paraglide/messages"
+import * as c from "@/constants.ts"
+
+export interface MyLink {
+  title: string;
+  url: string;
+  message?: string;
+  icon?: PajamasIcon
+}
+
+export default [
+  {
+    title: "GitHub",
+    url: c.GITHUB_PROFILE_URL,
+    icon: "pajamas:github"
+  },
+  {
+    title: "Gitea",
+    url: c.GIT_PROFILE_URL,
+    message: m.forPersonalProjects(),
+    icon: "pajamas:gitea"
+  },
+  {
+    title: "LinkedIn",
+    url: c.LINKED_IN_URL,
+    icon: "pajamas:linkedin"
+  },
+  {
+    title: "Mastodon (Snabelen)",
+    url: c.MASTODON_URL,
+    icon: "pajamas:mastodon"
+  },
+  {
+    title: "Pixelfed",
+    url: c.PIXELFED_URL
+  },
+  {
+    title: "Steam",
+    url: c.STEAM_URL
+  },
+  {
+    title: "Trakt.tv",
+    url: c.TRAKT_URL
+  }
+] satisfies MyLink[]
--- a/src/components/projects/MyProjectsPage.astro
+++ b/src/components/projects/MyProjectsPage.astro
@ -0,0 +1,37 @@
+---
+import ProjectCard from "./ProjectCard.astro"
+import * as m from "@/paraglide/messages"
+import { type CollectionEntry } from "astro:content"
+import { type NavLink } from "@/utils/linking"
+
+interface Props {
+  projects: CollectionEntry<"projects">[]
+}
+
+const { projects } = Astro.props
+
+const baseUrl: NavLink = "/projects"
+---
+
+<h1 class="text-4xl font-bold text-center sm:my-10 mt-2">{m.myProjects()}</h1>
+<div class="flex flex-wrap justify-around">
+  {
+    projects.map(
+      ({
+         data: { title, description, tags, heroImage, heroImageAlt },
+         id
+       }) => (
+        <div class="my-5 px-2">
+          <ProjectCard
+            title={title}
+            linkTo={`${baseUrl}/${id}`}
+            description={description}
+            tags={tags}
+            image={heroImage}
+            imageAlt={heroImageAlt}
+          />
+        </div>
+      )
+    )
+  }
+</div>
--- a/src/components/projects/ProjectCard.astro
+++ b/src/components/projects/ProjectCard.astro
@ -1,7 +1,9 @@
 ---
 import { Image } from "astro:assets"
 import { type ImageMetadata } from "astro"
-import BadgeList from "./badge/BadgeList.astro"
+import BadgeList from "../badge/BadgeList.astro"
+import LocaleLink from "../links/LocaleLink.astro"
+import { type NavLink } from "@/utils/linking"

 interface Props {
  title: string
@ -9,15 +11,15 @@ interface Props {
  tags: string[]
  image: ImageMetadata
  imageAlt: string
-  linkTo: string
+  linkTo: NavLink
 }

 const { title, description, tags, image, imageAlt, linkTo } = Astro.props
 ---

-<a
-  href={linkTo}
-  class="card bg-base-100 w-96 shadow-xl hover:scale-105 transition"
+<LocaleLink
+  to={linkTo}
+  class="card bg-base-100 max-w-96 shadow-xl hover:scale-105 transition"
 >
  <figure>
    <Image src={image} alt={imageAlt} />
@ -29,4 +31,4 @@ const { title, description, tags, image, imageAlt, linkTo } = Astro.props
    <p>{description}</p>
    <BadgeList tags={tags} />
  </div>
-</a>
+</LocaleLink>
--- a/src/components/projects/ProjectPage.astro
+++ b/src/components/projects/ProjectPage.astro
@ -1,14 +1,12 @@
 ---
-import Layout from "../layouts/Layout.astro"
+import Layout from "@/layouts/Layout.astro"
 import { Image } from "astro:assets"
-import { getEntry } from "astro:content"
-import BadgeList from "./badge/BadgeList.astro"
-import ExternalLink from "./links/ExternalLink.astro"
-import * as m from "../paraglide/messages"
-import { languageTag } from "../paraglide/runtime"
-import Gitea from "../icons/Gitea.astro"
-import "../styles/global.css"
-import GiteaLink from "./links/GiteaLink.astro"
+import { getEntry, render } from "astro:content"
+import BadgeList from "../badge/BadgeList.astro"
+import * as m from "@/paraglide/messages"
+import { languageTag } from "@/paraglide/runtime"
+import GiteaLink from "../links/GiteaLink.astro"
+import "@/styles/global.css"

 interface Props {
  project: string // TODO typeof project slug
@ -17,7 +15,7 @@ interface Props {
 const { project } = Astro.props

 const entry = await getEntry("projects", project)
-const { Content } = await entry!.render()
+const { Content } = await render(entry)
 const {
  title,
  description,
@ -26,7 +24,7 @@ const {
  heroImageAlt,
  source,
  createdAt,
-  updatedAt,
+  updatedAt
 } = entry!.data
 ---

--- a/src/components/simplifyTruths/HowTo.astro
+++ b/src/components/simplifyTruths/HowTo.astro
@ -0,0 +1,26 @@
+---
+import KeywordsDisclosure from "./KeywordsDisclosure.astro"
+import DisclosureContainer from "./output/DisclosureContainer.astro"
+import Disclosure from "./output/Disclosure.astro"
+import ExternalLink from "../links/ExternalLink.astro"
+// TODO translate and move link
+---
+
+<DisclosureContainer>
+  <Disclosure title={"How to"}>
+    <p>
+      Fill in a truth expression and it will be simplified for you as much as possible. It will
+      also genereate a truth table with all possible values. You can use a single letter, word or
+      multiple words without spacing for each atomic value. If you do not want to simplify the
+      expression, simply turn off the toggle. Keywords for operators are defined below.
+      Parentheses is also allowed.
+    </p>
+    <p>
+      API docs can be found
+      <ExternalLink href={"https://api.martials.no/simplify-truths"}>here</ExternalLink>
+      .
+    </p>
+  </Disclosure>
+
+  <KeywordsDisclosure />
+</DisclosureContainer>
--- a/src/components/simplifyTruths/KeywordsDisclosure.astro
+++ b/src/components/simplifyTruths/KeywordsDisclosure.astro
@ -0,0 +1,40 @@
+---
+import Disclosure from "./output/Disclosure.astro"
+// TODO Translate
+---
+
+<Disclosure title={"Keywords"}>
+  <table>
+    <thead>
+    <tr class={"text-left"}>
+      <th>Name</th>
+      <th class={"pr-2"}>API</th>
+      <th>Other</th>
+    </tr>
+    </thead>
+    <tbody>
+    <tr>
+      <td>Not:</td>
+      <td>!</td>
+      <td>NOT</td>
+    </tr>
+    <tr>
+      <td>And:</td>
+      <td>&</td>
+      <td>AND</td>
+    </tr>
+    <tr>
+      <td>Or:</td>
+      <td>|</td>
+      <td>/</td>
+      <td>OR</td>
+    </tr>
+    <tr>
+      <td class={"pr-2"}>Implication:</td>
+      <td>{"->"}</td>
+      <td class={"px-2"}>IMPLICATION</td>
+      <td>IMP</td>
+    </tr>
+    </tbody>
+  </table>
+</Disclosure>
--- a/src/components/simplifyTruths/Search.svelte
+++ b/src/components/simplifyTruths/Search.svelte
@ -0,0 +1,24 @@
+<script lang="ts">
+
+  import Input from "@/components/Input.svelte"
+</script>
+
+<Input
+  inputClass={`rounded-xl pl-7 h-10 w-full pr-8`}
+  class={`w-full ${$$restProps.class}`}
+  id={id}
+  ref={ref}
+  placeholder="¬A & B -> C"
+  type={"text"}
+  onChange={onChange}
+  leading={
+        <Icon path={magnifyingGlass} aria-label={"Magnifying glass"} class={"absolute pl-2"} />
+      }
+  trailing={
+        <Show when={typing()} keyed>
+          <button class={"absolute right-2"} title={"Clear"} type={"reset"} onClick={clearSearch}>
+            <Icon path={xMark} aria-label={"The letter X"} />
+          </button>
+        </Show>
+      }
+/>
--- a/src/components/simplifyTruths/ShowMeHow.astro
+++ b/src/components/simplifyTruths/ShowMeHow.astro
@ -0,0 +1,37 @@
+---
+import type { FetchResult } from "@/types/types"
+import Disclosure from "./output/Disclosure.astro"
+import DisclosureContainer from "./output/DisclosureContainer.astro"
+import { diffChars } from "diff"
+
+interface Props {
+  fetchResult: FetchResult | null
+}
+const { fetchResult } = Astro.props
+---
+
+<DisclosureContainer>
+  <Disclosure title={"Show me how it's done"}>
+    <table class={"table"}>
+      <tbody>
+      {
+        fetchResult?.orderOperations?.map((operation, index) => (
+          <tr class={"border-b border-dotted border-gray-500"}>
+            <td>{index + 1}:</td>
+            <td class={"px-2"}>
+              {
+                diffChars(operation.before, operation.after).map((part) => (
+                  <span class={`${part.added && "bg-green-700"} ${part.removed && "bg-red-700"}`}>
+                    {part.value}
+                  </span>
+                ))
+              }
+            </td>
+            <td>using: {operation.law}</td>
+          </tr>
+        ))
+        }
+      </tbody>
+    </table>
+  </Disclosure>
+</DisclosureContainer>
--- a/src/components/simplifyTruths/SimplifyTruthsPage.astro
+++ b/src/components/simplifyTruths/SimplifyTruthsPage.astro
@ -0,0 +1,10 @@
+---
+import SimplifyTruthsPageBody from "./SimplifyTruthsPageBody.svelte"
+import HowTo from "./HowTo.astro"
+---
+
+<div id={"truth-content"}>
+  <SimplifyTruthsPageBody>
+    <HowTo />
+  </SimplifyTruthsPageBody>
+</div>
--- a/src/components/simplifyTruths/SimplifyTruthsPage.tsx
+++ b/src/components/simplifyTruths/SimplifyTruthsPage.tsx
@ -0,0 +1,428 @@
+/* @refresh reload */
+
+type Option = {
+  name: string
+  value: "NONE" | "TRUE" | "FALSE" | "DEFAULT" | "TRUE_FIRST" | "FALSE_FIRST"
+}
+
+const fetchUrls = [
+  "http://localhost:8080/simplify/table/",
+  "https://api.martials.no/simplify-truths/simplify/table/"
+]
+
+// TODO move some code to new components
+const TruthTablePage: Component = () => {
+  const [searchParams, setSearchParams] = useSearchParams()
+  let inputElement: HTMLInputElement | undefined = undefined
+
+  let simplifyDefault = searchParams.simplify === undefined || searchParams.simplify === "true",
+    inputContent = !!searchParams.exp,
+    hideIntermediate = searchParams.hideIntermediate === "true"
+
+  const [simplifyEnabled, setSimplifyEnabled] = createSignal(simplifyDefault)
+  const [fetchResult, setFetchResult] = createSignal<FetchResult | null>(null)
+
+  const hideOptions: Option[] = [
+    { name: "Show all result", value: "NONE" },
+    { name: "Hide true results", value: "TRUE" },
+    { name: "Hide false results", value: "FALSE" }
+  ]
+
+  const [hideValues, setHideValues] = createSignal(hideOptions[0])
+
+  const sortOptions: Option[] = [
+    { name: "Sort by default", value: "DEFAULT" },
+    { name: "Sort by true first", value: "TRUE_FIRST" },
+    { name: "Sort by false first", value: "FALSE_FIRST" }
+  ]
+
+  const [sortValues, setSortValues] = createSignal(sortOptions[0])
+  const [hideIntermediates, setHideIntermediates] = createSignal(hideIntermediate)
+  const [isLoaded, setIsLoaded] = createSignal<boolean | null>(null)
+  const [error, setError] = createSignal<{ title: string; message: string } | null>(null)
+  const [useLocalhost, setUseLocalhost] = createSignal(false)
+
+  /**
+   * Updates the state of the current expression to the new search with all whitespace removed.
+   * If the element is not found, reset.
+   */
+  function onClick(e: Event): void {
+    e.preventDefault() // Stops the page from reloading onClick
+    const exp = inputElement?.value
+
+    if (exp) {
+      setSearchParams({
+        exp,
+        simplify: simplifyEnabled(),
+        hide: hideValues().value,
+        sort: sortValues().value,
+        hideIntermediate: hideIntermediates()
+      })
+
+      getFetchResult(exp)
+    }
+  }
+
+  function getFetchResult(exp: string | null): void {
+    setFetchResult(null)
+
+    if (exp && exp !== "") {
+      exp = replaceOperators(exp)
+      setError(null)
+      setIsLoaded(false)
+
+      fetch(`${fetchUrls[useLocalhost() ? 0 : 1]}${encodeURIComponent(exp)}?
+simplify=${simplifyEnabled()}&hide=${hideValues().value}&sort=${sortValues().value}&caseSensitive=false&
+hideIntermediate=${hideIntermediates()}`)
+        .then((res) => res.json())
+        .then((res) => {
+          if (res.status !== "OK" && !res.ok) {
+            return setError({ title: "Input error", message: res.message })
+          }
+          return setFetchResult(res)
+        })
+        .catch((err) => setError({ title: "Fetch error", message: err.toString() }))
+        .finally(() => setIsLoaded(true))
+    }
+  }
+
+  onMount((): void => {
+    if (searchParams.exp) {
+      const exp = searchParams.exp
+      if (exp && inputElement) {
+        inputElement.value = exp
+      }
+      const hide = searchParams.hide
+      if (hide) {
+        setHideValues(hideOptions.find((o) => o.value === hide) ?? hideOptions[0])
+      }
+      const sort = searchParams.sort
+      if (sort) {
+        setSortValues(sortOptions.find((o) => o.value === sort) ?? sortOptions[0])
+      }
+
+      getFetchResult(exp)
+    }
+
+    // Focuses searchbar on load
+    if (!isTouch()) {
+      inputElement?.focus()
+    }
+  })
+
+  const tableId = "truth-table"
+  const filenameId = "excel-filename"
+
+  function _exportToExcel(): void {
+    const value = getElementById<HTMLInputElement>(filenameId)?.value
+    exportToExcel({
+      name: value !== "" ? value : undefined,
+      tableId
+    })
+  }
+
+  return (
+    <Layout title={"Truth tables"}>
+      <Show when={import.meta.env.DEV ?? false} keyed>
+        (DEV) Use localhost:
+        <MySwitch title={"Use localhost"} defaultValue={false} onChange={setUseLocalhost} />
+      </Show>
+
+      <div id={"truth-content"}>
+        <div class={"mx-auto max-w-2xl"}>
+          <HowTo />
+
+          <form class={"flex-row-center"} onSubmit={onClick} autocomplete={"off"}>
+            <Search ref={inputElement} typingDefault={inputContent} />
+
+            <Button
+              id={"truth-input-button"}
+              title={"Generate (Enter)"}
+              type={"submit"}
+              className={"min-w-50px ml-2 h-10"}
+              children={"Generate"}
+            />
+          </form>
+
+          {/* Options row */}
+          <Row className={"my-1 gap-2"}>
+            <span class={"h-min"}>{"Simplify"}: </span>
+
+            <MySwitch
+              onChange={setSimplifyEnabled}
+              defaultValue={simplifyEnabled()}
+              title={"Simplify"}
+              name={"Turn on/off simplify expressions"}
+              className={"mx-1"}
+            />
+
+            <div class={"relative h-min"}>
+              <MyMenu
+                title={"Filter results"}
+                id={"filter-results"}
+                button={
+                  <Show
+                    when={hideValues().value !== "NONE"}
+                    children={
+                      <Icon
+                        path={eyeSlash}
+                        aria-label={"An eye with a slash through it"}
+                        class={`mx-1 ${hideValues().value === "TRUE" ? "text-green-500" : "text-red-500"}`}
+                      />
+                    }
+                    fallback={<Icon path={eye} aria-label={"An eye"} class={"mx-1"} />}
+                    keyed
+                  />
+                }
+                children={
+                  <For each={hideOptions}>
+                    {(option) => (
+                      <SingleMenuItem
+                        onClick={() => setHideValues(option)}
+                        option={option}
+                        currentValue={hideValues}
+                      />
+                    )}
+                  </For>
+                }
+                itemsClassName={"right-0"}
+              />
+            </div>
+
+            <div class={"relative h-min"}>
+              <MyMenu
+                title={"Sort results"}
+                id={"sort-results"}
+                button={
+                  <Icon
+                    path={funnel}
+                    aria-label={"Filter"}
+                    class={`h-6 w-6 ${
+                      sortValues().value === "TRUE_FIRST"
+                        ? "text-green-500"
+                        : sortValues().value === "FALSE_FIRST" && "text-red-500"
+                    }`}
+                  />
+                }
+                children={
+                  <For each={sortOptions}>
+                    {(option) => (
+                      <SingleMenuItem
+                        option={option}
+                        currentValue={sortValues}
+                        onClick={() => setSortValues(option)}
+                      />
+                    )}
+                  </For>
+                }
+                itemsClassName={"right-0"}
+              />
+            </div>
+
+            <MySwitch
+              title={"Hide intermediate values"}
+              onChange={setHideIntermediates}
+              defaultValue={hideIntermediates()}
+            />
+
+            <Show when={isLoaded() && error() === null} keyed>
+              <MyDialog
+                title={"Download"}
+                description={"Export current table (.xlsx)"}
+                button={
+                  <>
+                    <p class={"sr-only"}>{"Download"}</p>
+                    <Icon aria-label={"Download"} path={arrowDownTray} />
+                  </>
+                }
+                callback={_exportToExcel}
+                acceptButtonName={"Download"}
+                cancelButtonName={"Cancel"}
+                buttonClass={`float-right`}
+                buttonTitle={"Export current table"}
+                acceptButtonId={"download-accept"}
+              >
+                <p>{"Filename"}:</p>
+                <Input
+                  className={"border-rounded h-10 px-2"}
+                  id={filenameId}
+                  placeholder={"Truth Table"}
+                />
+              </MyDialog>
+            </Show>
+          </Row>
+
+          <Show when={error()} keyed>
+            <ErrorBox
+              title={error()?.title ?? "Error"}
+              error={error()?.message ?? "Something went wrong"}
+            />
+          </Show>
+
+          <Show when={isLoaded() === false} keyed>
+            <Icon
+              path={arrowPath}
+              aria-label={"Loading indicator"}
+              class={"mx-auto animate-spin"}
+            />
+          </Show>
+
+          <Show when={simplifyEnabled() && (fetchResult()?.orderOperations?.length ?? 0) > 0} keyed>
+            <ShowMeHow fetchResult={fetchResult} />
+          </Show>
+        </div>
+
+        <Show when={isLoaded() && error() === null} keyed>
+          <Show when={simplifyEnabled()} keyed>
+            <InfoBox
+              className={"mx-auto w-fit pb-1 text-center text-lg"}
+              title={"Output:"}
+              id={"expression-output"}
+            >
+              <p>{fetchResult()?.after}</p>
+            </InfoBox>
+          </Show>
+
+          <div class={"m-2 flex justify-center"}>
+            <div id={"table"} class={"h-[45rem] overflow-auto"}>
+              <TruthTable
+                header={fetchResult()?.header ?? undefined}
+                table={fetchResult()?.table?.truthMatrix}
+                id={tableId}
+              />
+            </div>
+          </div>
+        </Show>
+      </div>
+    </Layout>
+  )
+}
+
+export default TruthTablePage
+
+interface SingleMenuItem {
+  option: Option
+  currentValue?: Accessor<Option>
+  onClick: JSX.EventHandlerUnion<HTMLButtonElement, MouseEvent>
+}
+
+const SingleMenuItem: Component<SingleMenuItem> = ({ option, currentValue, onClick }) => {
+  const isSelected = () => currentValue?.().value === option.value
+  return (
+    <button class={`flex-row-center cursor-pointer last:mb-1 hover:underline`} onClick={onClick}>
+      <Icon
+        path={check}
+        aria-label={isSelected() ? "A checkmark" : "Nothing"}
+        class={`text-white ${!isSelected() && "invisible"}`}
+      />
+      {option.name}
+    </button>
+  )
+}
+
+const ErrorBox: Component<{ title: string; error: string }> = ({ title, error }) => (
+  <InfoBox className={"mx-auto w-fit text-center"} title={title} error={true}>
+    <p>{error}</p>
+  </InfoBox>
+)
+
+interface ShowMeHowProps {
+  fetchResult: Accessor<FetchResult | null>
+}
+
+const ShowMeHow: Component<ShowMeHowProps> = ({ fetchResult }) => (
+  <MyDisclosureContainer>
+    <MyDisclosure title={"Show me how it's done"}>
+      <table class={"table"}>
+        <tbody>
+        <For each={fetchResult()?.orderOperations}>{orderOperationRow()}</For>
+        </tbody>
+      </table>
+    </MyDisclosure>
+  </MyDisclosureContainer>
+)
+
+const HowTo: Component = () => (
+  <MyDisclosureContainer>
+    <MyDisclosure title={"How to"}>
+      <p>
+        Fill in a truth expression and it will be simplified for you as much as possible. It will
+        also genereate a truth table with all possible values. You can use a single letter, word or
+        multiple words without spacing for each atomic value. If you do not want to simplify the
+        expression, simply turn off the toggle. Keywords for operators are defined below.
+        Parentheses is also allowed.
+      </p>
+      <p>
+        API docs can be found <Link to={"https://api.martials.no/simplify-truths"}>here</Link>.
+      </p>
+    </MyDisclosure>
+
+    <KeywordsDisclosure />
+  </MyDisclosureContainer>
+)
+
+const orderOperationRow = () => (operation: OrderOfOperation, index: Accessor<number>) => (
+  <tr class={"border-b border-dotted border-gray-500"}>
+    <td>{index() + 1}:</td>
+    <td class={"px-2"}>
+      {
+        <For each={diffChars(operation.before, operation.after)}>
+          {(part) => (
+            <span class={`${part.added && "bg-green-700"} ${part.removed && "bg-red-700"}`}>
+              {part.value}
+            </span>
+          )}
+        </For>
+      }
+
+      <Show when={typeof window !== "undefined" && window.outerWidth <= 640} keyed>
+        <p>
+          {"using"}: {operation.law}
+        </p>
+      </Show>
+    </td>
+    <Show when={typeof window !== "undefined" && window.outerWidth > 640} keyed>
+      <td>
+        {"using"}: {operation.law}
+      </td>
+    </Show>
+  </tr>
+)
+
+const KeywordsDisclosure: Component = () => (
+  <MyDisclosure title={"Keywords"}>
+    <table>
+      <thead>
+      <tr class={"text-left"}>
+        <th>Name</th>
+        <th class={"pr-2"}>API</th>
+        <th>Other</th>
+      </tr>
+      </thead>
+      <tbody>
+      <tr>
+        <td>Not:</td>
+        <td>!</td>
+        <td>NOT</td>
+      </tr>
+      <tr>
+        <td>And:</td>
+        <td>&</td>
+        <td>AND</td>
+      </tr>
+      <tr>
+        <td>Or:</td>
+        <td>|</td>
+        <td>/</td>
+        <td>OR</td>
+      </tr>
+      <tr>
+        <td class={"pr-2"}>Implication:</td>
+        <td>{"->"}</td>
+        <td class={"px-2"}>IMPLICATION</td>
+        <td>IMP</td>
+      </tr>
+      </tbody>
+    </table>
+  </MyDisclosure>
+)
--- a/src/components/simplifyTruths/SimplifyTruthsPageBody.svelte
+++ b/src/components/simplifyTruths/SimplifyTruthsPageBody.svelte
@ -0,0 +1,302 @@
+<script lang="ts">
+
+  import Switch from "@/components/Switch.svelte"
+  import Search from "@/components/simplifyTruths/Search.svelte"
+  import { onMount } from "svelte"
+  import Button from "@/components/buttons/Button.svelte"
+  import Row from "@/components/Row.svelte"
+  import Menu from "@/components/Menu.svelte"
+  import PajamasIcon from "@/components/icons/PajamasIcon.svelte"
+
+  let useLocalhost = false
+  let inputElement: HTMLInputElement | null = null
+
+  // TODO refactor getter and setters
+
+  /**
+   * Updates the state of the current expression to the new search with all whitespace removed.
+   * If the element is not found, reset.
+   */
+  function onFormSubmit(e: Event): void {
+    e.preventDefault() // Stops the page from reloading on:click
+    const exp = inputElement?.value // TODO test
+
+    if (exp) {
+      setSearchParams({
+        exp,
+        simplify: simplifyEnabled(),
+        hide: hideValues().value,
+        sort: sortValues().value,
+        hideIntermediate: hideIntermediates()
+      })
+
+      getFetchResult(exp)
+    }
+  }
+
+  function getFetchResult(exp: string | null): void {
+    setFetchResult(null)
+
+    if (exp && exp !== "") {
+      exp = replaceOperators(exp)
+      setError(null)
+      setIsLoaded(false)
+
+      // TODO refactor
+      fetch(`${fetchUrls[useLocalhost() ? 0 : 1]}${encodeURIComponent(exp)}?
+simplify=${simplifyEnabled()}&hide=${hideValues().value}&sort=${sortValues().value}&caseSensitive=false&
+hideIntermediate=${hideIntermediates()}`)
+        .then((res) => res.json())
+        .then((res) => {
+          if (res.status !== "OK" && !res.ok) {
+            return setError({ title: "Input error", message: res.message })
+          }
+          return setFetchResult(res)
+        })
+        .catch((err) => setError({ title: "Fetch error", message: err.toString() }))
+        .finally(() => setIsLoaded(true))
+    }
+  }
+
+  const fetchUrls = [
+    "http://localhost:8080/simplify/table/",
+    "https://api.martials.no/simplify-truths/simplify/table/"
+  ]
+
+  const [searchParams, setSearchParams] = useSearchParams()
+  let inputElement: HTMLInputElement | undefined = undefined
+
+  let simplifyDefault = searchParams.simplify === undefined || searchParams.simplify === "true",
+    inputContent = !!searchParams.exp,
+    hideIntermediate = searchParams.hideIntermediate === "true"
+
+  const [simplifyEnabled, setSimplifyEnabled] = createSignal(simplifyDefault)
+  const [fetchResult, setFetchResult] = createSignal<FetchResult | null>(null)
+
+  const hideOptions: Option[] = [
+    { name: "Show all result", value: "NONE" },
+    { name: "Hide true results", value: "TRUE" },
+    { name: "Hide false results", value: "FALSE" }
+  ]
+
+  const [hideValues, setHideValues] = createSignal(hideOptions[0])
+
+  const sortOptions: Option[] = [
+    { name: "Sort by default", value: "DEFAULT" },
+    { name: "Sort by true first", value: "TRUE_FIRST" },
+    { name: "Sort by false first", value: "FALSE_FIRST" }
+  ]
+
+  const [sortValues, setSortValues] = createSignal(sortOptions[0])
+  const [hideIntermediates, setHideIntermediates] = createSignal(hideIntermediate)
+  const [isLoaded, setIsLoaded] = createSignal<boolean | null>(null)
+  const [error, setError] = createSignal<{ title: string; message: string } | null>(null)
+  const [useLocalhost, setUseLocalhost] = createSignal(false)
+
+  onMount((): void => {
+    if (searchParams.exp) {
+      const exp = searchParams.exp
+      if (exp && inputElement) {
+        inputElement.value = exp
+      }
+      const hide = searchParams.hide
+      if (hide) {
+        setHideValues(hideOptions.find((o) => o.value === hide) ?? hideOptions[0])
+      }
+      const sort = searchParams.sort
+      if (sort) {
+        setSortValues(sortOptions.find((o) => o.value === sort) ?? sortOptions[0])
+      }
+
+      getFetchResult(exp)
+    }
+
+    // Focuses searchbar on load
+    if (!isTouch()) {
+      inputElement?.focus()
+    }
+  })
+
+  const tableId = "truth-table"
+  const filenameId = "excel-filename"
+
+  function _exportToExcel(): void {
+    const value = getElementById<HTMLInputElement>(filenameId)?.value
+    exportToExcel({
+      name: value !== "" ? value : undefined,
+      tableId
+    })
+  }
+
+</script>
+
+{#if import.meta.env.DEV}
+  (DEV) Use localhost:
+  <Switch title={"Use localhost"} defaultValue={false} onChange={(state) => useLocalhost = state} />
+{/if}
+
+
+<div class={"mx-auto max-w-2xl"}>
+  <slot />
+  <form class={"flex-row-center"} onSubmit={onFormSubmit} autocomplete={"off"}>
+    <Search ref={inputElement} typingDefault={inputContent} />
+
+    <Button
+      id={"truth-input-button"}
+      title={"Generate (Enter)"}
+      type={"submit"}
+      className={"min-w-50px ml-2 h-10"}
+    >
+      Generate
+    </Button>
+  </form>
+
+  <!-- Options row -->
+  <Row class={"my-1 gap-2"}>
+    <span class={"h-min"}>{"Simplify"}: </span>
+
+    <Switch
+      onChange={setSimplifyEnabled}
+      defaultValue={simplifyEnabled()}
+      title={"Simplify"}
+      name={"Turn on/off simplify expressions"}
+      className={"mx-1"}
+    />
+
+    <div class={"relative h-min"}>
+      <Menu
+        title={"Filter results"}
+        id={"filter-results"}
+        button={
+                  <Show
+                    when={hideValues().value !== "NONE"}
+                    children={
+                      <Icon
+                        path={eyeSlash}
+                        aria-label={"An eye with a slash through it"}
+                        class={`mx-1 ${hideValues().value === "TRUE" ? "text-green-500" : "text-red-500"}`}
+                      />
+                    }
+                    fallback={<Icon path={eye} aria-label={"An eye"} class={"mx-1"} />}
+                    keyed
+                  />
+                }
+        children={
+                  <For each={hideOptions}>
+                    {(option) => (
+                      <SingleMenuItem
+                        onClick={() => setHideValues(option)}
+                        option={option}
+                        currentValue={hideValues}
+                      />
+                    )}
+                  </For>
+                }
+        itemsClassName={"right-0"}
+      />
+    </div>
+
+    <div class={"relative h-min"}>
+      <Menu
+        title={"Sort results"}
+        id={"sort-results"}
+        button={
+                  <PajamasIcon
+                    name="TODO"
+                    aria-label={"Filter"}
+                    class={`h-6 w-6 ${
+                      sortValues().value === "TRUE_FIRST"
+                        ? "text-green-500"
+                        : sortValues().value === "FALSE_FIRST" && "text-red-500"
+                    }`}
+                  />
+                }
+        children={
+                  <For each={sortOptions}>
+                    {(option) => (
+                      <SingleMenuItem
+                        option={option}
+                        currentValue={sortValues}
+                        onClick={() => setSortValues(option)}
+                      />
+                    )}
+                  </For>
+                }
+        itemsClassName={"right-0"}
+      />
+    </div>
+
+    <Switch
+      title={"Hide intermediate values"}
+      onChange={setHideIntermediates}
+      defaultValue={hideIntermediates()}
+    />
+
+    <Show when={isLoaded() && error() === null} keyed>
+      <MyDialog
+        title={"Download"}
+        description={"Export current table (.xlsx)"}
+        button={
+                  <>
+                    <p class={"sr-only"}>{"Download"}</p>
+                    <Icon aria-label={"Download"} path={arrowDownTray} />
+                  </>
+                }
+        callback={_exportToExcel}
+        acceptButtonName={"Download"}
+        cancelButtonName={"Cancel"}
+        buttonClass={`float-right`}
+        buttonTitle={"Export current table"}
+        acceptButtonId={"download-accept"}
+      >
+        <p>{"Filename"}:</p>
+        <Input
+          className={"border-rounded h-10 px-2"}
+          id={filenameId}
+          placeholder={"Truth Table"}
+        />
+      </MyDialog>
+    </Show>
+  </Row>
+
+  <Show when={error()} keyed>
+    <ErrorBox
+      title={error()?.title ?? "Error"}
+      error={error()?.message ?? "Something went wrong"}
+    />
+  </Show>
+
+  <Show when={isLoaded() === false} keyed>
+    <Icon
+      path={arrowPath}
+      aria-label={"Loading indicator"}
+      class={"mx-auto animate-spin"}
+    />
+  </Show>
+
+  <Show when={simplifyEnabled() && (fetchResult()?.orderOperations?.length ?? 0) > 0} keyed>
+    <ShowMeHow fetchResult={fetchResult} />
+  </Show>
+</div>
+
+{#if isLoaded() && error() === null}
+  {#if simplifyEnabled()}
+    <InfoBox
+      className={"mx-auto w-fit pb-1 text-center text-lg"}
+      title={"Output:"}
+      id={"expression-output"}
+    >
+      <p>{fetchResult()?.after}</p>
+    </InfoBox>
+  {/if}
+
+  <div class={"m-2 flex justify-center"}>
+    <div id={"table"} class={"h-[45rem] overflow-auto"}>
+      <TruthTable
+        header={fetchResult()?.header ?? undefined}
+        table={fetchResult()?.table?.truthMatrix}
+        id={tableId}
+      />
+    </div>
+  </div>
+{/if}
--- a/src/components/simplifyTruths/SingleMenuItem.svelte
+++ b/src/components/simplifyTruths/SingleMenuItem.svelte
@ -0,0 +1,20 @@
+<script lang="ts">
+  import type { SimplifyTruthsOption } from "@/types/types.ts"
+
+  export let option: SimplifyTruthsOption
+  export let currentValue: () => SimplifyTruthsOption
+  export let onClick: () => void
+
+  const isSelected = () => option === currentValue()
+
+  // TODO bind on:click
+</script>
+
+<button class={`flex-row-center cursor-pointer last:mb-1 hover:underline`} on:click={onClick}>
+  <Icon
+    path={check}
+    aria-label={isSelected() ? "A checkmark" : "Nothing"}
+    class={`text-white ${!isSelected() && "invisible"}`}
+  />
+  {option.name}
+</button>
--- a/src/components/simplifyTruths/TruthTable.astro
+++ b/src/components/simplifyTruths/TruthTable.astro
@ -0,0 +1,39 @@
+---
+import type { Table } from "@/types/types"
+import type { ComponentProps } from "@/types/props"
+
+interface Props extends ComponentProps {
+  table?: Table
+  header?: string[]
+}
+const { table, header, class: clazz, ...props } = Astro.props
+---
+
+<table class={`z-10 table border-collapse border-2 border-gray-500 ${clazz}`} {...props}>
+  <thead>
+  <tr>
+    {header?.map(exp => (
+      <th
+        scope={"col"}
+        class={
+          `sticky top-0 bg-default-bg text-center outline
+                             outline-2 outline-offset-[-1px] outline-gray-500 [position:-webkit-sticky;]` /*TODO sticky header at the top of the screen */
+        }
+      >
+        <p class={"w-max px-2"}>{exp}</p>
+      </th>
+    ))}
+  </tr>
+  </thead>
+  <tbody>
+  {table?.map(row => (
+    <tr class={"hover:text-black"}>
+      {row.map(value => (
+        <td class={`border border-gray-500 text-center last:underline ${value ? "bg-green-700" : "bg-red-700"}`}>
+          <p>{value ? "T" : "F"}</p>
+        </td>
+      ))}
+    </tr>
+  ))}
+  </tbody>
+</table>
--- a/src/components/simplifyTruths/output/Disclosure.astro
+++ b/src/components/simplifyTruths/output/Disclosure.astro
@ -0,0 +1,4 @@
+---
+
+---
+<div>TODO implement</div>
--- a/src/components/simplifyTruths/output/DisclosureContainer.astro
+++ b/src/components/simplifyTruths/output/DisclosureContainer.astro
@ -0,0 +1,6 @@
+---
+
+---
+<div class={`border-rounded mb-2 flex flex-col gap-1 bg-cyan-900 p-2 dark:border-gray-800 ${Astro.props.className}`}>
+  <slot />
+</div>
--- a/src/components/simplifyTruths/output/ErrorBox.astro
+++ b/src/components/simplifyTruths/output/ErrorBox.astro
@ -0,0 +1,12 @@
+---
+import InfoBox from "./InfoBox.astro"
+interface Props {
+  title: string
+  error: string
+}
+const { title, error } = Astro.props
+---
+
+<InfoBox class={"mx-auto w-fit text-center"} title={title} error={true}>
+  <p>{error}</p>
+</InfoBox>
--- a/src/components/simplifyTruths/output/InfoBox.astro
+++ b/src/components/simplifyTruths/output/InfoBox.astro
@ -0,0 +1,16 @@
+---
+import type { ComponentProps } from "@/types/props"
+interface Props extends ComponentProps {
+  title: string
+  error?: boolean
+}
+
+const { title, error = false, class: clazz, ...props } = Astro.props
+---
+
+<div class={`border-rounded ${error ? "border-red-500" : "border-gray-500"} ${clazz}`} {...props}>
+  <p class={`border-b px-2 ${error ? "border-red-500" : "border-gray-500"}`}>{title}</p>
+  <div class="mx-2">
+    <slot />
+  </div>
+</div>
--- a/src/constants.ts
+++ b/src/constants.ts
@ -0,0 +1,11 @@
+export const DOMAIN = "martials.no"
+export const LINKED_IN_URL = "https://www.linkedin.com/in/martin-b-2a69391a3"
+export const GIT_BASE_URL = `https://git.${DOMAIN}`
+export const GIT_PROFILE_URL = `${GIT_BASE_URL}/martials`
+export const GITHUB_PROFILE_URL = "https://github.com/emberal"
+export const MASTODON_URL = "https://snabelen.no/@Martials"
+export const PIXELFED_URL = "https://pixelfed.social/i/web/profile/261454857934868480"
+export const STEAM_URL = "https://steamcommunity.com/id/martials/"
+export const THIS_GIT_URL = `${GIT_BASE_URL}/martials/martials.no`
+export const TRAKT_URL = "https://trakt.tv/users/martials"
+export const STATUS_URL = `https://status.${DOMAIN}/status/home`
--- a/src/content/config.ts
+++ b/src/content/config.ts
@ -1,7 +1,8 @@
 import { defineCollection, z } from "astro:content"
+import { glob } from "astro/loaders"

 const projectCollection = defineCollection({
-  type: "content",
+  loader: glob({ pattern: "**\/*.mdx", base: "./src/content/projects" }),
  schema: ({ image }) =>
    z.object({
      title: z.string(),
@ -16,8 +17,9 @@ const projectCollection = defineCollection({
 })

 const hardwareCollection = defineCollection({
-  type: "data",
+  loader: glob({ pattern: "**\/*.yaml", base: "./src/content/hardware" }),
  schema: z.object({
+    title: z.string(),
    accessories: z.optional(z.array(z.string())),
    hardware: z.array(z.string())
  })
--- a/src/content/hardware/desktop.yaml
+++ b/src/content/hardware/desktop.yaml
@ -1,4 +1,23 @@
+title: Desktop
 accessories:
-  - a # Screens, keyboards, mice, etc.
+  - Gaming chair | Arozzi Mezzo V2 Gaming chair Fabric Black/Red # https://www.komplett.no/product/1079732?noredirect=true
+  - Headset | Logitech PRO X LIGHTSPEED Wireless Gaming Headset # https://www.komplett.no/product/1162749?noredirect=true
+  - Keyboard | Logitech G710
+  - Monitor 1 | AOC 27" LED FreeSync G2790PX # https://www.komplett.no/product/975642?noredirect=true
+  - Monitor 2 | Asus 28" 4K LED PB287Q # https://www.komplett.no/product/815114?noredirect=true
+  - Mouse | Logitech G502 HERO Gaming Mouse
+  - Mousepad | Svive Styx ESGR Gaming Mousepad XXL # https://www.komplett.no/product/985884?noredirect=true
+  - Speakers | Creative T6 Series II # https://www.komplett.no/product/808450?noredirect=true
 hardware:
-  - b # Graphics cards, CPUs, etc.
+  - Case | Fractal Design Define R5 (Black) # https://www.fractal-design.com/products/cases/define/define-r5/black/
+  - CPU | Intel Core i5-10600K CPU # https://www.komplett.no/product/1155669?noredirect=true
+  - CPU cooler | Noctua ...
+  - Fans | 4x Fractal Design R3 140mm Silent fan # https://www.komplett.no/product/836971?noredirect=true
+  - GPU | Palit GeForce RTX 2070 SUPER JetStream # https://www.komplett.no/product/1134511?noredirect=true
+  - HDD | Seagate Barracuda 3TB 3.5" # https://www.komplett.no/product/653074?noredirect=true
+  - Motherboard | Gigabyte H470 HD3 # https://www.komplett.no/product/1161192?noredirect=true
+  - Network card | TP-Link Archer TX3000E # https://www.komplett.no/product/1146481?noredirect=true
+  - Ram | 2x Corsair Vengeance LPX DDR4 3200MHz 16GB (black) # https://www.komplett.no/product/893831?noredirect=true
+  - SSD | Samsung 960 PRO 512GB M.2 PCIe SSD # https://www.komplett.no/product/903118?noredirect=true
+  - SSD | Corsair Force Series MP510 960GB M.2 NVMe SSD 960GB # https://www.komplett.no/product/1153863?noredirect=true
+  - PSU | Corsair CX750M, 750W PSU # https://www.komplett.no/product/773377?noredirect=true
--- a/src/content/hardware/homeServer.yaml
+++ b/src/content/hardware/homeServer.yaml
@ -1,2 +1,3 @@
+title: Home Server
 hardware:
  - b # Graphics cards, CPUs, etc.
--- a/src/content/hardware/raspberryPi.yaml
+++ b/src/content/hardware/raspberryPi.yaml
@ -1,3 +1,4 @@
+title: Raspberry Pi 4
 accessories:
  - a # Screens, keyboards, mice, etc.
 hardware:
--- a/src/content/projects/Calendar
+++ b/src/content/projects/Calendar
--- a/src/content/projects/Simplify-truths-website.png
+++ b/src/content/projects/Simplify-truths-website.png
--- a/src/content/projects/hotelService.mdx
+++ b/src/content/projects/hotelService.mdx
@ -1,12 +0,0 @@
---
-title: "Hotel Service"
-description: "REST API for managing hotels"
-heroImage: "./kevin-james.jpg"
-heroImageAlt: "The homepage of this site"
-tags: [Rust, Axum, Postgres, REST]
-source: "https://example.com"
-createdAt: "2024-09-22"
-updatedAt: "2024-09-22"
---
-
-Hello
--- a/src/content/projects/hvl-ics-simplifier.mdx
+++ b/src/content/projects/hvl-ics-simplifier.mdx
@ -0,0 +1,16 @@
+---
+title: "API for å forenkle TimeEdit iCalendar filer"
+description: "Et API som forenkler tittler i ICS filer fra TimeEdit"
+heroImage: "./Calendar before and after.png"
+heroImageAlt: "En kalender før og etter APIet har blitt brukt. Venstre side er før, høyre etter."
+tags: [API, Kotlin, Spring Boot, Tomcat, iCal4j, CI/CD]
+source: "https://github.com/emberal/hvl_ics_simplifier"
+createdAt: "2023-08-08"
+updatedAt: "2024-10-20"
+---
+
+Ble lei av hvor vanskelig det var å lese iCalendar filer fra HVL sin kalender i TimeEdit, så jeg lagde et API som gjør det enklere.
+Data for tittelen blir hentet fra den gamle tittelen.
+For å finne hvilken type hendselse det er, sjekkes beskrivelsen og lokasjonen.
+
+APIet er skrevet i Kotlin med Spring boot, og hosted på en selvhostet tomcat server.
--- a/src/content/projects/simplify-truths.mdx
+++ b/src/content/projects/simplify-truths.mdx
@ -0,0 +1,26 @@
+---
+title: "Forenkle sannhetsverdier og sannhetstabeller"
+description: "Forenkle sannhetsuttrykk og opprette sannhetstabeller"
+heroImage: "./Simplify-truths-website.png"
+heroImageAlt: "Nettsiden med en sannhetstabell"
+tags: [TypeScript, SolidJS, Tailwind css, Nettside, Java, API, Spring Boot, Raspberry Pi, Apache, Tomcat]
+source: "https://github.com/h600878/martials.no"
+createdAt: "2022-11-08"
+updatedAt: "2024-10-20"
+---
+{/* TODO change to Rust */}
+Noen sannhetsverdier kan bli ganske store, og kompliserte. Derfor har jeg laget dette programmet for å forenkle uttrykk mest mulig.
+Programmet bruker flere kjente metoder for å skrive om uttrykkene. Hvilke uttrykk som er brukt og hvilke endringer de gjorde,
+kan vises i menyen under søkefeltet.
+<br />
+I tillegg til å bare forenkle uttrykk, kan man også generere en sannhetstabell med alle mulige verdier i uttrykket.
+Hvis man ikke ønsker å forenkle uttrykket, men bare generere tabellen, kan man enkelt skru av forenkling. I tillegg har
+man muligheten til å filtrere resultat, enten ved å skjule sanne eller usanne verdier. Eller ved å sortere etter sanne
+eller usanne først.
+<br />
+Nettsiden er laget med TypeScript, SolidJS og Tailwind CSS. API-et er laget med Java og Spring Boot.
+Begge kjører på min egen raspberry pi 4, nettsiden er hostet på en apache2 tjener, mens API-et ligger på en tomcat tjener.
+<a href={"https://martials.no/simplify-truths.html"}>Lenke til nettsiden.</a>
+<br />
+Spørringer kan gjøres mot API-et kan utføres med GET eller POST. API-et returnerer JSON.
+[Lenke til API-docs](https://api.martials.no/simplify-truths)
--- a/src/env.d.ts
+++ b/src/env.d.ts
@ -1,11 +0,0 @@
-/// <reference path="../.astro/types.d.ts" />
-/// <reference types="astro/client" />
-
-interface ImportMetaEnv {
-  readonly URL: string
-  readonly GIT_URL: string
-}
-
-interface ImportMeta {
-  readonly env: ImportMetaEnv
-}
--- a/src/icons/ExternalLink.astro
+++ b/src/icons/ExternalLink.astro
@ -1,18 +0,0 @@
---
-// By GitLab SVGs
-const props = Astro.props
---
-
-<svg
-  xmlns="http://www.w3.org/2000/svg"
-  width="1em"
-  height="1em"
-  viewBox="0 0 16 16"
-  {...props}
->
-  <path
-    fill="currentColor"
-    fill-rule="evenodd"
-    d="M10.75 1a.75.75 0 0 0 0 1.5h1.69L8.22 6.72a.75.75 0 0 0 1.06 1.06l4.22-4.22v1.69a.75.75 0 0 0 1.5 0V1zM2.5 4v9a.5.5 0 0 0 .5.5h9a.5.5 0 0 0 .5-.5V8.75a.75.75 0 0 1 1.5 0V13a2 2 0 0 1-2 2H3a2 2 0 0 1-2-2V4a2 2 0 0 1 2-2h4.25a.75.75 0 0 1 0 1.5H3a.5.5 0 0 0-.5.5"
-    clip-rule="evenodd"></path>
-</svg>
--- a/src/icons/GitHub.astro
+++ b/src/icons/GitHub.astro
@ -1,18 +0,0 @@
---
-// By GitLab SVGs
-const props = Astro.props
---
-
-<svg
-  xmlns="http://www.w3.org/2000/svg"
-  width="1em"
-  height="1em"
-  viewBox="0 0 16 16"
-  {...props}
->
-  <path
-    fill="currentColor"
-    fill-rule="evenodd"
-    d="M7.976 0A7.977 7.977 0 0 0 0 7.976c0 3.522 2.3 6.507 5.431 7.584c.392.049.538-.196.538-.392v-1.37c-2.201.49-2.69-1.076-2.69-1.076c-.343-.93-.881-1.175-.881-1.175c-.734-.489.048-.489.048-.489c.783.049 1.224.832 1.224.832c.734 1.223 1.859.88 2.3.685c.048-.538.293-.88.489-1.076c-1.762-.196-3.621-.881-3.621-3.964c0-.88.293-1.566.832-2.153c-.05-.147-.343-.978.098-2.055c0 0 .685-.196 2.201.832c.636-.196 1.322-.245 2.007-.245s1.37.098 2.006.245c1.517-1.027 2.202-.832 2.202-.832c.44 1.077.146 1.908.097 2.104a3.16 3.16 0 0 1 .832 2.153c0 3.083-1.86 3.719-3.62 3.915c.293.244.538.733.538 1.467v2.202c0 .196.146.44.538.392A7.98 7.98 0 0 0 16 7.976C15.951 3.572 12.38 0 7.976 0"
-    clip-rule="evenodd"></path>
-</svg>
--- a/src/icons/Gitea.astro
+++ b/src/icons/Gitea.astro
@ -1,18 +0,0 @@
---
-// By GitLab SVGs
-const props = Astro.props
---
-
-<svg
-  xmlns="http://www.w3.org/2000/svg"
-  width="1em"
-  height="1em"
-  viewBox="0 0 16 16"
-  {...props}
->
-  <path
-    fill="currentColor"
-    fill-rule="evenodd"
-    d="M15.46 3.206s.14-.003.245.102l.01.01c.064.06.258.244.285 1.074c0 2.902-1.405 5.882-1.405 5.882a9 9 0 0 1-.359.713c-.458.802-.786 1.153-.786 1.153s-.318.379-.675.595c-.415.265-.72.263-.72.263L7.247 13c-.636-.079-1.29-.736-1.927-1.578c-.47-.677-.779-1.413-.779-1.413s-2.51.034-3.675-1.394C.235 7.895.103 7.067.06 6.769q0-.012-.004-.029c-.05-.324-.285-1.873.821-2.86c.517-.496 1.148-.638 1.37-.684c.371-.081.667-.06.903-.044l.09.006c.391.035 3.99.216 3.99.216s1.532.066 2.27.056c0 0 .003 1.853.003 2.78q.105.048.211.1l.212.1V3.427q.494-.005.996-.017h.011c1.545-.036 4.528-.204 4.528-.204ZM2.113 8.026s.28.26.94.477c.43.152 1.094.231 1.094.231S3.699 7.5 3.516 6.757c-.22-.886-.4-2.398-.4-2.398s-.438-.015-.789.079c-.766.19-.98.763-.98.763s-.384.688.036 1.813c.244.672.73 1.013.73 1.013Zm8.084 3.607c.344-.023.499-.392.499-.392s1.24-2.486 1.4-2.878a.7.7 0 0 0 .046-.438c-.07-.267-.39-.412-.39-.412l-1.926-.935l-.165.339l-.18.369a.46.46 0 0 1 .128.341s.433.186.743.387c0 0 .257.135.32.425c.075.273-.04.488-.066.539l-.002.003s-.216.51-.343.774l-.004.007q-.07.144-.139.28a.454.454 0 1 1-.32-.15s.41-.84.468-1.033c0 0 .096-.24.048-.38a.47.47 0 0 0-.19-.188a6 6 0 0 0-.678-.34s-.076.068-.18.09a.5.5 0 0 1-.158.014l-.611 1.25a.46.46 0 0 1 .046.587a.46.46 0 0 1-.578.138a.46.46 0 0 1-.232-.51a.46.46 0 0 1 .44-.35L8.8 7.886a.457.457 0 0 1 .361-.744l.185-.375l.167-.341l-.579-.281s-.251-.125-.458-.072a.6.6 0 0 0-.114.039c-.189.084-.31.33-.31.33L6.668 9.293s-.124.254-.068.46c.048.252.325.397.325.397l2.874 1.4l.135.054s.114.04.262.03Z"
-    clip-rule="evenodd"></path>
-</svg>
--- a/src/icons/Hamburger.astro
+++ b/src/icons/Hamburger.astro
@ -1,18 +0,0 @@
---
-// By GitLab SVGs
-const props = Astro.props
---
-
-<svg
-  xmlns="http://www.w3.org/2000/svg"
-  width="1em"
-  height="1em"
-  viewBox="0 0 16 16"
-  {...props}
->
-  <path
-    fill="currentColor"
-    fill-rule="evenodd"
-    d="M0 3.75A.75.75 0 0 1 .75 3h14.5a.75.75 0 0 1 0 1.5H.75A.75.75 0 0 1 0 3.75M0 8a.75.75 0 0 1 .75-.75h14.5a.75.75 0 0 1 0 1.5H.75A.75.75 0 0 1 0 8m.75 3.5a.75.75 0 0 0 0 1.5h14.5a.75.75 0 0 0 0-1.5z"
-    clip-rule="evenodd"></path>
-</svg>
--- a/src/icons/LinkedIn.astro
+++ b/src/icons/LinkedIn.astro
@ -1,18 +0,0 @@
---
-// By GitLab SVGs
-const props = Astro.props
---
-
-<svg
-  xmlns="http://www.w3.org/2000/svg"
-  width="1em"
-  height="1em"
-  viewBox="0 0 16 16"
-  {...props}
->
-  <path
-    fill="currentColor"
-    fill-rule="evenodd"
-    d="M3 1a2 2 0 0 0-2 2v10a2 2 0 0 0 2 2h10a2 2 0 0 0 2-2V3a2 2 0 0 0-2-2zm1.102 4.297a1.195 1.195 0 1 0 0-2.39a1.195 1.195 0 0 0 0 2.39m1 7.516V6.234h-2v6.579zM6.43 6.234h2v.881c.295-.462.943-1.084 2.148-1.084c1.438 0 2.219.953 2.219 2.766c0 .087.008.484.008.484v3.531h-2v-3.53c0-.485-.102-1.438-1.18-1.438c-1.079 0-1.17 1.198-1.195 1.982v2.986h-2z"
-    clip-rule="evenodd"></path>
-</svg>
--- a/src/icons/Mastodon.astro
+++ b/src/icons/Mastodon.astro
@ -1,17 +0,0 @@
---
-// By GitLab SVGs
-const props = Astro.props
---
-
-<svg
-  xmlns="http://www.w3.org/2000/svg"
-  width="1em"
-  height="1em"
-  viewBox="0 0 16 16"
-  {...props}
->
-  <path
-    fill="currentColor"
-    d="M15.498 3.706C15.264 1.986 13.749.632 11.954.37C11.65.325 10.503.164 7.844.164h-.02c-2.66 0-3.23.161-3.533.206C2.546.625.951 1.842.565 3.582C.379 4.438.359 5.388.393 6.259C.443 7.51.453 8.756.567 10q.12 1.242.414 2.454c.368 1.49 1.856 2.731 3.314 3.237a9 9 0 0 0 4.848.253q.265-.06.525-.141c.39-.123.849-.26 1.186-.502l.01-.013l.005-.016v-1.206l-.004-.015a.04.04 0 0 0-.024-.02h-.016c-1.03.244-2.087.366-3.146.364c-1.824 0-2.314-.856-2.455-1.212a3.7 3.7 0 0 1-.213-.955a.035.035 0 0 1 .028-.036h.016a13.3 13.3 0 0 0 3.095.364q.375.002.751-.007c1.049-.03 2.154-.082 3.186-.281l.073-.016c1.627-.31 3.176-1.28 3.333-3.736c.006-.097.02-1.013.02-1.113c.002-.342.112-2.42-.015-3.697m-2.505 6.13h-1.71V5.69c0-.873-.368-1.318-1.116-1.318c-.822 0-1.234.526-1.234 1.566v2.27h-1.7v-2.27c0-1.04-.413-1.566-1.235-1.566c-.744 0-1.115.445-1.116 1.318v4.145h-1.71v-4.27q0-1.31.677-2.08c.464-.513 1.074-.776 1.83-.776q1.316 0 1.979.999l.426.706l.426-.706c.441-.666 1.103-.999 1.977-.999c.756 0 1.366.263 1.832.776q.675.77.676 2.08z"
-  ></path>
-</svg>
--- a/src/images/me.jpg
+++ b/src/images/me.jpg
--- a/src/images/polite-cat.jpg
+++ b/src/images/polite-cat.jpg
--- a/src/layouts/Layout.astro
+++ b/src/layouts/Layout.astro
@ -1,31 +1,31 @@
 ---
-import Navbar from "../components/Navbar.astro"
+import Navbar from "@/components/Navbar.astro"
+import Footer from "@/components/Footer.astro"
+import { languageTag } from "@/paraglide/runtime"
+
 interface Props {
  title: string
  class?: string
 }
 const { title, class: clazz } = Astro.props
-
-import { languageTag } from "../paraglide/runtime"
-import Footer from "../components/Footer.astro"
 ---

 <!doctype html>
 <html lang={languageTag()} dir={"ltr"}>
-  <head>
-    <meta charset="UTF-8" />
-    <meta name="description" content="Astro description" />
-    <meta name="viewport" content="width=device-width" />
-    <link rel="sitemap" href="/sitemap-index.xml" />
-    <link rel="icon" type="image/svg+xml" href="/favicon.svg" />
-    <meta name="generator" content={Astro.generator} />
-    <title>{title}</title>
-  </head>
-  <body class="flex flex-col h-screen">
-    <Navbar />
-    <main class:list={["grow", clazz]}>
-      <slot />
-    </main>
-    <Footer />
-  </body>
+<head>
+  <meta charset="UTF-8" />
+  <meta name="description" content="Astro description" />
+  <meta name="viewport" content="width=device-width" />
+  <link rel="sitemap" href="/sitemap-index.xml" />
+  <link rel="icon" type="image/svg+xml" href="/favicon.svg" />
+  <meta name="generator" content={Astro.generator} />
+  <title>{title}</title>
+</head>
+<body class="flex flex-col h-screen">
+<Navbar />
+<main class:list={["grow", clazz]}>
+  <slot />
+</main>
+<Footer />
+</body>
 </html>
--- a/src/links.ts
+++ b/src/links.ts
@ -1,23 +1,32 @@
-import * as m from "./paraglide/messages.js"
+import * as m from "@/paraglide/messages.js"
+import type { NavLink } from "@/utils/linking.ts"

 interface Link {
-  label: string
-  to: string
+  label: () => string
+  to: NavLink
 }

 const Links: Link[] = [
  {
-    label: m.home(),
-    to: "/",
+    label: m.home,
+    to: "/"
  },
  {
-    label: m.myProjects(),
-    to: "/project",
+    label: m.myProjects,
+    to: "/projects"
  },
  {
-    label: m.contactMe(),
-    to: "/contact-me",
+    label: m.myLinks,
+    to: "/links"
  },
+  {
+    label: m.hardware,
+    to: "/hardware"
+  },
+  {
+    label: m.contactMe,
+    to: "/contact"
+  }
 ]

 export default Links
--- a/src/pages/.well-known/security.txt.ts
+++ b/src/pages/.well-known/security.txt.ts
@ -0,0 +1,15 @@
+import type { APIRoute } from "astro"
+
+function getSecurityTxt(site?: URL) {
+  const canonical = new URL("/.well-known/security.txt", site)
+  return `
+Contact: mailto:security@martials.no
+Expires: 2029-12-31T23:00:00.000Z
+Preferred-Languages: no,en
+Canonical: ${canonical.href}
+`
+}
+
+export const GET: APIRoute = ({ site }) => {
+  return new Response(getSecurityTxt(site))
+}
--- a/src/pages/contact-me.astro
+++ b/src/pages/contact-me.astro
@ -1,11 +0,0 @@
---
-// TODO form
-// TODO self-host email server
-import "../styles/global.css"
-import ContactMeForm from "../components/ContactMeForm.astro"
-import Layout from "../layouts/Layout.astro"
---
-
-<Layout title="Kontakt meg">
-  <!--<ContactMeForm client:load />-->
-</Layout>
--- a/src/pages/contact.astro
+++ b/src/pages/contact.astro
@ -0,0 +1,9 @@
+---
+import ContactMePage from "@/components/contactMe/ContactMePage.astro"
+import Layout from "@/layouts/Layout.astro"
+import "@/styles/global.css"
+---
+
+<Layout title="Kontakt meg">
+  <ContactMePage />
+</Layout>
--- a/src/pages/en/contact-me.astro
+++ b/src/pages/en/contact-me.astro
@ -1,3 +0,0 @@
---
-
---
--- a/src/pages/en/contact.astro
+++ b/src/pages/en/contact.astro
@ -0,0 +1,9 @@
+---
+import ContactMePage from "@/components/contactMe/ContactMePage.astro"
+import Layout from "@/layouts/Layout.astro"
+import "@/styles/global.css"
+---
+
+<Layout title="Kontakt meg">
+  <ContactMePage />
+</Layout>
--- a/src/pages/en/hardware.astro
+++ b/src/pages/en/hardware.astro
@ -1,10 +1,12 @@
 ---
-import Layout from "../../layouts/Layout.astro"
-import HardwarePage from "../../components/HardwarePage.svelte"
-import "../../styles/global.css"
+import Layout from "@/layouts/Layout.astro"
+import HardwarePage from "@/components/HardwarePage.svelte"
+import "@/styles/global.css"
+import { getCollection } from "astro:content"
+
+const hardware = await getCollection("hardware")
 ---

 <Layout title="Hardware" class="mx-auto max-w-[750px]">
-  <h1 class="text-center">Hardware</h1>
-  <HardwarePage client:load />
+  <HardwarePage server:defer hardware={hardware} />
 </Layout>
--- a/src/pages/en/links.astro
+++ b/src/pages/en/links.astro
@ -1,3 +1,7 @@
 ---
-
+import Layout from "@/layouts/Layout.astro"
+import LinksPage from "@/components/myLinks/LinksPage.astro"
 ---
+<Layout title="My links">
+  <LinksPage />
+</Layout>
--- a/src/pages/en/project/index.astro
+++ b/src/pages/en/project/index.astro
@ -1,5 +0,0 @@
---
-
---
-
-<p>These are all my projects</p>
--- a/src/pages/en/projects/[project].astro
+++ b/src/pages/en/projects/[project].astro
@ -1,11 +1,15 @@
 ---
-import ProjectPage from "../../../components/ProjectPage.astro"
+import ProjectPage from "@/components/projects/ProjectPage.astro"
 import { type GetStaticPathsResult } from "astro"

+// Prerender the page as static HTML during build
+export const prerender = true
+
 export function getStaticPaths(): GetStaticPathsResult {
  return [
-    { params: { project: "hotelservice" } },
+    { params: { project: "hvl-ics-simplifier" } },
    { params: { project: "homepage" } },
+    { params: { project: "simplify-truths" } }
  ]
 }

--- a/src/pages/en/projects/index.astro
+++ b/src/pages/en/projects/index.astro
@ -0,0 +1,11 @@
+---
+import { getCollection } from "astro:content"
+import Layout from "@/layouts/Layout.astro"
+import MyProjectsPage from "@/components/projects/MyProjectsPage.astro"
+
+const projects = await getCollection("projects")
+---
+
+<Layout title="Projects">
+  <MyProjectsPage projects={projects} />
+</Layout>
--- a/src/pages/en/simplify-truths.astro
+++ b/src/pages/en/simplify-truths.astro
@ -0,0 +1,8 @@
+---
+import Layout from "@/layouts/Layout.astro"
+import SimplifyTruthsPage from "@/components/simplifyTruths/SimplifyTruthsPage.astro"
+---
+
+<Layout title="Simplify truths">
+  <SimplifyTruthsPage />
+</Layout>
--- a/src/pages/hardware.astro
+++ b/src/pages/hardware.astro
@ -1,10 +1,12 @@
 ---
-import Layout from "../layouts/Layout.astro"
-import HardwarePage from "../components/HardwarePage.svelte"
-import "../styles/global.css"
+import Layout from "@/layouts/Layout.astro"
+import HardwarePage from "@/components/HardwarePage.svelte"
+import "@/styles/global.css"
+import { getCollection } from "astro:content"
+
+const hardware = await getCollection("hardware")
 ---

 <Layout title="Hardware" class="mx-auto max-w-[750px]">
-  <h1 class="text-center">Hardware</h1>
-  <HardwarePage client:load />
+  <HardwarePage server:defer hardware={hardware} />
 </Layout>
--- a/src/pages/index.astro
+++ b/src/pages/index.astro
@ -1,21 +1,8 @@
 ---
 import Layout from "../layouts/Layout.astro"
-import OnePager from "../components/Greeting.astro"
+import Greeting from "../components/Greeting.astro"
 ---

-<!--
-One-pager
- Quick overview of me.
- Image
- Contact
-  - Email
-  - LinkedIn
-  - GitHub
- Education
- Experience
- Skills
- Certifications
-->
 <Layout title="Velkommen">
-  <OnePager />
+  <Greeting />
 </Layout>
--- a/src/pages/links.astro
+++ b/src/pages/links.astro
@ -1,3 +1,7 @@
 ---
-
+import Layout from "@/layouts/Layout.astro"
+import LinksPage from "@/components/myLinks/LinksPage.astro"
 ---
+<Layout title="Mine lenker">
+  <LinksPage />
+</Layout>
--- a/src/pages/project/index.astro
+++ b/src/pages/project/index.astro
@ -1,32 +0,0 @@
---
-import { getCollection } from "astro:content"
-import ProjectCard from "../../components/ProjectCard.astro"
-import Layout from "../../layouts/Layout.astro"
-
-const projects = await getCollection("projects")
---
-
-<Layout title="Projects">
-  <h1 class="text-4xl font-bold text-center my-10">Projects</h1>
-  <div class="flex flex-wrap justify-around">
-    {
-      projects.map(
-        ({
-          data: { title, description, tags, heroImage, heroImageAlt },
-          slug,
-        }) => (
-          <div class="my-5">
-            <ProjectCard
-              title={title}
-              linkTo={`/project/${slug}`}
-              description={description}
-              tags={tags}
-              image={heroImage}
-              imageAlt={heroImageAlt}
-            />
-          </div>
-        ),
-      )
-    }
-  </div>
-</Layout>
--- a/src/pages/projects/[project].astro
+++ b/src/pages/projects/[project].astro
@ -1,11 +1,15 @@
 ---
-import ProjectPage from "../../components/ProjectPage.astro"
+import ProjectPage from "@/components/projects/ProjectPage.astro"
 import { type GetStaticPathsResult } from "astro"

+// Prerender the page as static HTML during build
+export const prerender = true
+
 export function getStaticPaths(): GetStaticPathsResult {
  return [
-    { params: { project: "hotelservice" } },
+    { params: { project: "hvl-ics-simplifier" } },
    { params: { project: "homepage" } },
+    { params: { project: "simplify-truths" } }
  ]
 }

--- a/src/pages/projects/index.astro
+++ b/src/pages/projects/index.astro
@ -0,0 +1,11 @@
+---
+import { getCollection } from "astro:content"
+import Layout from "@/layouts/Layout.astro"
+import MyProjectsPage from "@/components/projects/MyProjectsPage.astro"
+
+const projects = await getCollection("projects")
+---
+
+<Layout title="Prosjekter">
+  <MyProjectsPage projects={projects} />
+</Layout>
--- a/src/pages/simplify-truths.astro
+++ b/src/pages/simplify-truths.astro
@ -0,0 +1,8 @@
+---
+import Layout from "@/layouts/Layout.astro"
+import SimplifyTruthsPage from "@/components/simplifyTruths/SimplifyTruthsPage.astro"
+---
+
+<Layout title="Forenkle sannhetsverdier">
+  <SimplifyTruthsPage />
+</Layout>
--- a/src/styles/global.css
+++ b/src/styles/global.css
@ -3,13 +3,26 @@
@tailwind utilities;

@layer utilities {
-  .debug {
-    @apply border border-red-500;
-  }
+    .debug {
+        @apply border border-red-500;
+    }
 }

@layer base {
-  h1 {
-    @apply text-4xl font-bold mb-2;
-  }
+    br {
+        @apply my-0.5;
+    }
+
+    h1 {
+        @apply text-4xl font-bold mb-2;
+    }
+
+    h2 {
+        @apply text-3xl font-bold mb-2;
+    }
+
+    /* TODO change default style*/
+    a {
+        @apply link
+    }
 }
--- a/src/types/icons.ts
+++ b/src/types/icons.ts
@ -0,0 +1,3 @@
+export type Icon = "gitea" | "github" | "mastodon" | "linkedin" | "link" | "status-health"
+
+export type PajamasIcon = `pajamas:${Icon}`
--- a/src/types/props.ts
+++ b/src/types/props.ts
@ -0,0 +1,10 @@
+export interface ComponentProps {
+  class?: string;
+  style?: string;
+  title?: string;
+  id?: string;
+}
+
+export interface LinkProps extends ComponentProps {
+  href: string;
+}
--- a/src/types/types.ts
+++ b/src/types/types.ts
@ -0,0 +1,42 @@
+import type { CollectionEntry } from "astro:content"
+
+export type AbsolutePathname = `/${string}`
+
+export type Project = CollectionEntry<"projects">
+
+export type Operator = "AND" | "OR" | "NOT" | "IMPLICATION"
+
+export type Table = boolean[][]
+
+export type OrderOfOperation = {
+  before: string
+  after: string
+  law: string
+}
+
+export type Expression = {
+  leading: string
+  left: Expression | null
+  operator: Operator | null
+  right: Expression | null
+  trailing: string
+  atomic: string | null
+}
+
+export type FetchResult = {
+  status: string
+  version: string | null
+  before: string
+  after: string
+  orderOperations: OrderOfOperation[] | null
+  expression: Expression | null
+  header: string[] | null
+  table: {
+    truthMatrix: Table
+  } | null
+}
+
+export type SimplifyTruthsOption = {
+  name: string
+  value: "NONE" | "TRUE" | "FALSE" | "DEFAULT" | "TRUE_FIRST" | "FALSE_FIRST"
+}
--- a/src/utils/linking.ts
+++ b/src/utils/linking.ts
@ -0,0 +1,66 @@
+import type { AvailableLanguageTag } from "@/paraglide/runtime.js"
+import type { AbsolutePathname, Project } from "@/types/types.ts"
+
+interface TranslatedPathnames {
+  nb: AbsolutePathname
+  en: `/en${AbsolutePathname}`
+}
+
+export type NavLink =
+  "/"
+  | "/contact"
+  | "/projects"
+  | `/projects/${Project["id"]}`
+  | "/links"
+  | "/hardware"
+
+const paths: Set<NavLink> = new Set([
+  "/",
+  "/contact",
+  "/projects",
+  "/links",
+  "/hardware"
+])
+
+/**
+ * Defines the localized pathnames for the site.
+ * The key must be used to navigate to the correct path.
+ * The value is the path that will be used for the given locale.
+ *
+ * @see https://inlang.com/m/iljlwzfs/paraglide-astro-i18n
+ */
+const pathnames: Record<AbsolutePathname, TranslatedPathnames> = {}
+for (const path of paths) {
+  pathnames[path] = {
+    nb: path,
+    en: `/en${path}`
+  }
+}
+
+export function localizePathname(
+  pathname: NavLink,
+  locale: AvailableLanguageTag
+): string {
+  const pathnameParts = pathname.split("/")
+  const firstSegment: AbsolutePathname = `/${pathnameParts[1]}`
+
+  if (pathnames[firstSegment]) {
+    const localizedPathname = pathnames[firstSegment][locale]
+
+    const rest = pathnameParts.slice(2)
+    if (rest.length > 0) {
+      return `${localizedPathname}/${rest.join("/")}`
+    } else {
+      return localizedPathname
+    }
+  }
+  return pathname
+}
+
+export function resolvePathname(pathname: string): AbsolutePathname {
+  const enPattern = "/en"
+  if (pathname.startsWith(enPattern)) {
+    return pathname.slice(enPattern.length) as AbsolutePathname
+  }
+  return pathname as AbsolutePathname
+}
--- a/Show More
+++ b/Show More
Author	SHA1	Message	Date
Martin Berg Alstad	b6a332a2fe	moved files from old repo and rewrote some	2024-12-17 16:58:58 +00:00
Martin Berg Alstad	4724b0a0e0	Moved some contstants to a constants.ts file. Added LinkedIn link in footer. Added option to add icon to ExternalLinks Refactored some code in ExternalLink. Signed-off-by: Martin Berg Alstad <git@martials.no>	2024-10-22 20:46:53 +02:00
Martin Berg Alstad	b9f7b63aa9	Fix localization on detailed project pages. All checks were successful Build and deploy website / build (push) Successful in 34s Details Fix way too much padding on <br/> tags. Added some old project entries. Added Project as a convenience type. Added link class to all a tags to easier distinguish links in text. Signed-off-by: Martin Berg Alstad <git@martials.no>	2024-10-20 22:25:52 +02:00
Martin Berg Alstad	941a93f8a5	Updated to Astro v5 beta. All checks were successful Build and deploy website / build (push) Successful in 1m56s Details Created a new component for a collapsable list Implemented some of the new features. - astro:env - New astro content layer Signed-off-by: Martin Berg Alstad <git@martials.no>	2024-10-20 12:05:32 +02:00
Martin Berg Alstad	32f4c6aaf0	Update container name and stricter types for linking Signed-off-by: Martin Berg Alstad <git@martials.no>	2024-10-20 11:01:54 +02:00
Martin Berg Alstad	b8e77b2a54	Docker and Docker compose All checks were successful Build and deploy website / build (push) Successful in 3m26s Details Updated dependencies Updated workflow to use docker compose Signed-off-by: Martin Berg Alstad <git@martials.no>	2024-10-12 19:07:55 +02:00
Martin Berg Alstad	740cba625d	SSR and i18n Signed-off-by: Martin Berg Alstad <git@martials.no>	2024-10-12 18:29:44 +02:00
Martin Berg Alstad	1a2fec6a59	security.txt Signed-off-by: Martin Berg Alstad <git@martials.no>	2024-10-12 17:12:12 +02:00
Martin Berg Alstad	c701a510f7	Button group to switch languages. Localized pathname function for links. inlang/paraglide-astro package Signed-off-by: Martin Berg Alstad <git@martials.no>	2024-10-09 21:30:05 +02:00
Martin Berg Alstad	87184c431d	Fix form on contact-me page. All checks were successful Build and deploy website / build (push) Successful in 1m24s Details Build and deploy website / deploy (push) Successful in 1s Details Fix wrong link to source code. Eager loading of image on landing page. Signed-off-by: Martin Berg Alstad <git@martials.no>	2024-10-09 20:42:10 +02:00
Martin Berg Alstad	c3b698956b	Fix build error All checks were successful Build and deploy website / build (push) Successful in 1m23s Details Build and deploy website / deploy (push) Successful in 1s Details Signed-off-by: Martin Berg Alstad <git@martials.no>	2024-10-06 14:53:54 +02:00
Martin Berg Alstad	8ba480eab1	Hardware page with more content. Some checks failed Build and deploy website / build (push) Failing after 1m37s Details Build and deploy website / deploy (push) Failing after 1s Details Collapse component Signed-off-by: Martin Berg Alstad <git@martials.no>	2024-10-06 14:43:06 +02:00
Martin Berg Alstad	beefabb908	Links page. Icons using npm package instead of svgs. Props and types. Signed-off-by: Martin Berg Alstad <git@martials.no>	2024-10-06 13:27:18 +02:00
Martin Berg Alstad	ebd59fe40e	Fix @ alias. Fix margins on mobile for projects. Moved html code to common component for projects Updated image of me to a far superior one. Signed-off-by: Martin Berg Alstad <git@martials.no>	2024-10-06 11:43:50 +02:00
Martin Berg Alstad	5e32cfc551	Wrap on mobile landing page Signed-off-by: Martin Berg Alstad <git@martials.no>	2024-10-06 11:18:59 +02:00