Update & cleanup

public/client.js

@@ -3,10 +3,10 @@
  * @return {void}
  */
 function handleDialogClick(event) {
-  console.log("hello", event);
   const dialog = event.currentTarget;
   const rect = dialog.getBoundingClientRect();
-  const clickedInDialog = rect.top <= event.clientY &&
+  const clickedInDialog =
+    rect.top <= event.clientY &&
     event.clientY <= rect.top + rect.height &&
     rect.left <= event.clientX &&
     event.clientX <= rect.left + rect.width;

public/styles.css

@@ -1,217 +0,0 @@
-@tailwind base;
-@tailwind components;
-@tailwind utilities;
-
-@font-face {
-  font-family: "Archivo";
-  font-weight: 400;
-  font-style: normal;
-  src: url("/fonts/Archivo-Regular.woff2") format("woff2");
-  font-display: swap;
-}
-
-@font-face {
-  font-family: "Archivo";
-  font-weight: 700;
-  font-style: normal;
-  src: url("/fonts/Archivo-Bold.woff2") format("woff2");
-  font-display: swap;
-}
-
-@font-face {
-  font-family: "Archivo Condensed";
-  font-weight: 400;
-  font-style: normal;
-  src: url("/fonts/ArchivoCondensed-Regular.woff2") format("woff2");
-  font-display: swap;
-}
-
-@font-face {
-  font-family: "Archivo Condensed";
-  font-weight: 700;
-  font-style: normal;
-  src: url("/fonts/ArchivoCondensed-Bold.woff2") format("woff2");
-  font-display: swap;
-}
-
-@font-face {
-  font-family: "Anton";
-  font-weight: 400;
-  font-style: normal;
-  src: url("/fonts/Anton-Regular.ttf") format("truetype");
-  font-display: swap;
-}
-
-:root {
-  --color-accent: hsl(359 69% 39%);
-  --color-black: hsl(0 0% 0%);
-  --color-white: hsl(0 0% 100%);
-
-  --color-bg: var(--color-accent);
-  --color-fg: hsl(0 0% 100%);
-  --color-solid-fg: inherit;
-  --color-solid-bg: hsl(0 0% 0%);
-  --color-solid-bg-hover: hsl(0 0% 0% / 40%);
-  --color-ghost-bg-hover: hsl(0 0% 0% / 20%);
-  --color-focus: hsl(0 0% 0% / 50%);
-
-  --font-display: "Anton", system-ui, sans-serif;
-  --font-display2: "Archivo Condensed", system-ui, sans-serif;
-  --font-body: "Archivo", system-ui, sans-serif;
-
-  --line-height-factor: 1;
-}
-
-.font-display {
-  --line-height-factor: 1.3;
-}
-
-.theme-inverted {
-  --color-solid-fg: hsl(0 0% 0%);
-  --color-solid-bg: hsl(0 0% 100%);
-  --color-solid-bg-hover: hsl(0 0% 100% / 60%);
-  --color-ghost-bg-hover: hsl(0 0% 100% / 20%);
-  --color-focus: hsl(0 0% 100% / 50%);
-}
-
-body {
-  font-family: var(--font-body);
-  background-color: var(--color-accent);
-  color: var(--color-white);
-  min-height: 100vh;
-}
-
-input,
-select,
-textarea {
-  color: var(--color-black);
-  border: 2px solid currentColor;
-  border-radius: 3px;
-  transition: 120ms box-shadow ease;
-}
-
-.radio,
-.checkbox {
-  appearance: none;
-  margin: 0;
-  width: 1.25em;
-  height: 1.25em;
-  display: grid;
-  place-content: center;
-  background: var(--color-white);
-  transition: background-color 120ms ease;
-}
-
-.radio {
-  border-radius: 100px;
-}
-
-:where(.checkbox, .radio)::before {
-  content: "";
-  transform: scale(0);
-  transition: transform 120ms ease, opacity 120ms ease;
-  opacity: 0;
-}
-
-.checkbox::before {
-  width: 0.75em;
-  height: 0.75em;
-  background: white;
-  clip-path: polygon(
-    0% 50%,
-    12.5% 37.5%,
-    37.5% 62.5%,
-    87.5% 12.5%,
-    100% 25%,
-    37.5% 87.5%
-  );
-}
-
-.radio::before {
-  width: 0.65em;
-  height: 0.65em;
-  border-radius: 100px;
-  background: var(--color-accent);
-}
-
-:where(.checkbox, .radio):checked::before {
-  transform: scale(1);
-  opacity: 1;
-}
-
-.checkbox:checked {
-  background-color: var(--color-accent);
-}
-
-:where(input, select, textarea, button):focus-visible {
-  outline: none;
-  box-shadow: 0 0 0 5px var(--color-focus);
-}
-
-.radio:disabled {
-  cursor: not-allowed;
-}
-
-.button {
-  transition: background-color 120ms;
-  border-radius: 3px;
-}
-
-.button--solid {
-  background: var(--color-solid-bg);
-  color: var(--color-solid-fg);
-}
-
-.button--solid:disabled {
-  background: hsl(0 0% 0% / 10%);
-  color: hsl(0 0% 100% / 50%);
-}
-
-.button--solid:not(:disabled):hover {
-  background: var(--color-solid-bg-hover);
-}
-
-.button--ghost:not(:disabled):hover {
-  background: var(--color-ghost-bg-hover);
-}
-
-.button--icon {
-  border-radius: 100px;
-  width: 2.5em;
-  height: 2.5em;
-  display: grid;
-  place-content: center;
-}
-
-.link {
-  padding-bottom: 0.1em;
-  border-bottom: 0.075em solid currentColor;
-  transition: opacity 120ms ease;
-}
-
-.link:hover {
-  opacity: 0.75;
-}
-
-label {
-  cursor: pointer;
-}
-
-.required-tag {
-  color: var(--color-accent2);
-}
-
-.dialog {
-  background: #000;
-  color: inherit;
-  border-radius: 3px;
-}
-
-.dialog::backdrop {
-  background: hsl(0 0% 0% / 50%);
-  backdrop-filter: blur(10px);
-}
-
-body:has(:modal) {
-  overflow: hidden;
-}

scripts/migrate.ts

@@ -0,0 +1,67 @@
+import { MigrationResultSet, Migrator } from "kysely";
+import { FileMigrationProvider } from "kysely-deno-sqlite3";
+import { db } from "$src/services/db.ts";
+
+const subcommand = Deno.args[0];
+
+const migrator = new Migrator({
+  db,
+  provider: new FileMigrationProvider(
+    new URL("../migrations/", import.meta.url),
+  ),
+});
+
+const CMDS: Record<string, () => Promise<unknown>> = {
+  up,
+  down,
+  status,
+};
+
+if (subcommand in CMDS) {
+  await CMDS[subcommand]();
+} else {
+  help();
+}
+
+function printResult({ results, error }: MigrationResultSet) {
+  if (results) {
+    if (results.length === 0) {
+      console.log("✓ No migrations to execute");
+    } else {
+      results?.forEach((migration) => {
+        console.log(
+          migration.direction === "Up" ? "↑" : "↓",
+          migration.migrationName,
+          migration.status,
+        );
+      });
+    }
+  }
+  if (error) {
+    console.error("Error: ", error);
+  }
+}
+
+async function up() {
+  const res = await migrator.migrateToLatest();
+  printResult(res);
+}
+
+async function down() {
+  const res = await migrator.migrateDown();
+  printResult(res);
+}
+
+async function status() {
+  const migrations = await migrator.getMigrations();
+  migrations.forEach((mig) => {
+    console.log(mig.executedAt ? "✓" : " ", mig.name, mig.executedAt ?? "");
+  });
+}
+
+function help() {
+  console.log("Available commands:");
+  Object.entries(CMDS).forEach(([cmd]) => {
+    console.log("-", cmd);
+  });
+}

src/config.ts

@@ -1,12 +1,3 @@
-export const LANGUAGES = [
+export const LANGUAGES = ["en", "cs", "sk", "pl", "hu", "ro", "lt", "de" /* ... */] as const;
-  "en",
-  "cs",
-  "sk",
-  "pl",
-  "hu",
-  "ro",
-  "lt",
-  "de", /* ... */
-] as const;
 
 export const DEFAULT_LANG = "en" as const;

src/db/index.ts

@@ -1,12 +1,17 @@
 import { Kysely, SqliteDialect } from "kysely";
-import SQLite from "better-sqlite3";
 import type { DB } from "./types";
-import { join } from "node:path";
+import Database from "better-sqlite3";
+
+const path = import.meta.env.DATABASE_PATH ?? "/var/sqlite/reset_sender_v2.sqlite";
+const database = new Database(path);
+database.exec("PRAGMA journal_mode = WAL;");
 
 const dialect = new SqliteDialect({
-  database: new SQLite(join(process.cwd(), "db.sqlite")),
+  database,
 });
 
-export const db = new Kysely<DB>({
+const kysely = new Kysely<any>({
   dialect,
 });
+
+export { kysely as db };

src/lang.ts

@@ -2,6 +2,6 @@ import { LANGUAGES } from "./config.ts";
 
 export type Lang = (typeof LANGUAGES)[number];
 
-export function isLang(str: string | undefined): str is Lang {
+export function isKnownLang(str: string): str is Lang {
-  return !!str && (LANGUAGES as ReadonlyArray<string>).includes(str);
+  return (LANGUAGES as ReadonlyArray<string>).includes(str);
 }

src/layouts/Layout.astro

@@ -2,6 +2,7 @@
 import { DEFAULT_LANG } from "../config";
 import { makeT } from "../i18n";
 import type { Lang } from "../lang";
+import Footer from "../views/layout/Footer.astro";
 
 interface Props {
   lang?: Lang;
@@ -29,13 +30,12 @@ const t = makeT(lang);
     <link rel="manifest" href="/manifest.webmanifest" />
     <meta name="theme-color" content="hsl(359 69% 39%)" />
 
-    <link rel="stylesheet" href="/styles.css" />
     <script defer src="/htmx@1.9.10.min.js"></script>
-    <script defer src="/alpinejs@3.13.5.min.js"></script>
     <script defer src="/client.js"></script>
   </head>
-  <body hx-boost="true" class="text-xl">
+  <body hx-boost="true">
     <slot />
+    <Footer />
   </body>
 </html>
 
@@ -72,14 +72,6 @@ const t = makeT(lang);
     font-display: swap;
   }
 
-  @font-face {
-    font-family: "Anton";
-    font-weight: 400;
-    font-style: normal;
-    src: url("/fonts/Anton-Regular.ttf") format("truetype");
-    font-display: swap;
-  }
-
   :root {
     --color-accent: hsl(359 69% 39%);
     --color-black: hsl(0 0% 0%);
@@ -93,17 +85,12 @@ const t = makeT(lang);
     --color-ghost-bg-hover: hsl(0 0% 0% / 20%);
     --color-focus: hsl(0 0% 0% / 50%);
 
-    --font-display: "Anton", system-ui, sans-serif;
+    --font-display: "Archivo Condensed", system-ui, sans-serif;
-    --font-display2: "Archivo Condensed", system-ui, sans-serif;
     --font-body: "Archivo", system-ui, sans-serif;
 
     --line-height-factor: 1;
   }
 
-  .font-display {
-    --line-height-factor: 1.3;
-  }
-
   .theme-inverted {
     --color-solid-fg: hsl(0 0% 0%);
     --color-solid-bg: hsl(0 0% 100%);
@@ -112,6 +99,14 @@ const t = makeT(lang);
     --color-focus: hsl(0 0% 100% / 50%);
   }
 
+  .font-display {
+    --line-height-factor: 1.15;
+  }
+
+  html {
+    font-size: clamp(14px, 2vw, 16px);
+  }
+
   body {
     font-family: var(--font-body);
     background-color: var(--color-accent);
@@ -132,8 +127,8 @@ const t = makeT(lang);
   .checkbox {
     appearance: none;
     margin: 0;
-    width: 1.25em;
+    width: 1.5rem;
-    height: 1.25em;
+    height: 1.5rem;
     display: grid;
     place-content: center;
     background: var(--color-white);
@@ -216,13 +211,15 @@ const t = makeT(lang);
     place-content: center;
   }
 
-  .link {
+  .link,
-    padding-bottom: 0.1em;
+  .prose a {
+    padding-bottom: 0.025em;
     border-bottom: 0.075em solid currentColor;
     transition: opacity 120ms ease;
   }
 
-  .link:hover {
+  .link:hover,
+  .prose a:hover {
     opacity: 0.75;
   }
 
@@ -248,4 +245,8 @@ const t = makeT(lang);
   body:has(:modal) {
     overflow: hidden;
   }
+
+  .prose > p {
+    margin-bottom: 1em;
+  }
 </style>

src/letter/schema.ts

@@ -1,17 +1,22 @@
 import { z } from "zod";
+import { checkbox } from "../lib/types";
 
-export const letterFormSchema = z.object({
+export const letterOptionsSchema = z.object({
   firstName: z.string().min(1),
   lastName: z.string().min(1),
+  variant: z.string().min(1),
+  gender: z.string().min(1).optional(),
+  branch: z.string().min(1),
+  isClient: checkbox(),
+});
+
+export type LetterOptions = z.TypeOf<typeof letterOptionsSchema>;
+
+export const letterFormSchema = letterOptionsSchema.extend({
   email: z.string().min(1),
   phone: z.string().optional(),
-
-  variant: z.string().default("1"),
-  gender: z.string().default("g"),
-  branch: z.string(),
   message: z.string().min(1),
-
+  subscribed: checkbox(),
-  subscribed: z.boolean(),
 });
 
 export type LetterForm = z.TypeOf<typeof letterFormSchema>;

src/lib/postal-client.ts

@@ -40,6 +40,7 @@ export function createClient({ host, key }: ClientConfig) {
     async send(config: SendConfig) {
       const url = join(host, "/api/v1/send/message");
       const res = await fetch(url, {
+        method: "POST",
         headers: {
           "Content-Type": "application/json",
           "X-Server-API-Key": key,

src/lib/types.ts

@@ -0,0 +1,4 @@
+import { z } from "zod";
+
+// Convert key presence or absence in form data to boolean
+export const checkbox = () => z.unknown().transform((value) => value !== undefined);

src/mail.ts

@@ -1,6 +1,10 @@
 import { createClient } from "./lib/postal-client";
 
-export const mailClient = createClient({
+const host = import.meta.env.POSTAL_HOST ?? "https://resend.cz";
-  key: import.meta.env.POSTAL_KEY,
+const key = import.meta.env.POSTAL_KEY;
-  host: import.meta.env.POSTAL_HOST,
+
-});
+if (!key) {
+  throw new Error("Postal API key not defined");
+}
+
+export const mailClient = createClient({ host, key });

src/middleware.ts

@@ -1,14 +1,20 @@
 import type { MiddlewareHandler } from "astro";
-import { isLang } from "./lang";
+import { isKnownLang } from "./lang";
 
-export const onRequest: MiddlewareHandler = ({ params }, next) => {
+export const onRequest: MiddlewareHandler = async ({ params }, next) => {
-  // Return 404 on unknown languages
+  const lang = params.lang;
-  // On statically generated routes, this behavior is automatically handled by getStaticPaths.
+
-  if (params.lang && !isLang(params.lang)) {
+  if (lang) {
-    return new Response(null, {
+    // Unknown language returns 404
-      status: 404,
+    if (!isKnownLang(lang)) {
-      statusText: "Not found",
+      return new Response(null, { status: 404, statusText: "Not found" });
-    });
+    }
+
+    // Load translations if language is other than reference language (= english)
+    if (lang !== "en") {
+      // TODO: load translations
+    }
   }
-  return next();
+
+  return await next();
 };

src/pages/index.astro

@@ -18,7 +18,7 @@ const countries: Record<Lang, string> = {
 <Layout>
   <div class="max-w-screen-lg px-6 mx-auto pt-16 text-2xl">
     <img
-      src="/images/vig-white.webp"
+      src="/images/vig-logo.webp"
       class="max-w-[250px] hidden md:block ml-6 float-right"
       width="2013"
       height="1395"
@@ -62,13 +62,7 @@ const countries: Record<Lang, string> = {
       class="md:col-span-2 invert mt-16"
     />
     <div class="grid place-content-center">
-      <img
+      <img src="/images/logo-white.webp" width="1024" height="493" class="max-w-[300px]" alt="" />
-        src="/images/logo-white.webp"
-        width="1024"
-        height="493"
-        class="max-w-[300px]"
-        alt=""
-      />
     </div>
   </div>
 </Layout>

src/views/layout/ColophonIof.astro

@@ -0,0 +1,19 @@
+<nav class="col-span-3 md:col-span-2 opacity-75">
+  <h2 class="font-bold mb-2">Insure our Future</h2>
+  <ul class="flex flex-col gap-1">
+    <li>
+      <a class="link" href="https://global.insure-our-future.com/about" target="_blank"> About</a>
+      <li>
+        <a class="link" href="https://www.facebook.com/InsOurFuture" target="_blank"> Facebook</a>
+      </li>
+    </li>
+    <li>
+      <a class="link" href="https://www.instagram.com/insure.our.future/" target="_blank">
+        Instagram
+      </a>
+    </li>
+    <li>
+      <a class="link" href="https://twitter.com/InsOurFuture" target="_blank"> X</a>
+    </li>
+  </ul>
+</nav>

src/views/layout/ColophonReset.astro

@@ -0,0 +1,14 @@
+<nav class="col-span-3 md:col-span-2 opacity-75 md:border-r border-gray-700 md:mr-8">
+  <h2 class="font-bold mb-2">Re-set</h2>
+  <ul class="flex flex-col gap-1">
+    <li>
+      <a class="link" href="https://re-set.cz/about-us" target="_blank"> About</a>
+    </li>
+    <li>
+      <a class="link" href="https://www.facebook.com/PlatformaReset" target="_blank">Facebook</a>
+    </li>
+    <li>
+      <a class="link" href="https://twitter.com/reset_platforma" target="_blank"> X</a>
+    </li>
+  </ul>
+</nav>

src/views/layout/Footer.astro

@@ -0,0 +1,35 @@
+---
+import FooterIllustration from "./FooterIllustration.astro";
+import ColophonIof from "./ColophonIof.astro";
+import ColophonReset from "./ColophonReset.astro";
+import FooterLogos from "./FooterLogos.astro";
+---
+
+<footer class="sticky top-[100vh]">
+  <FooterIllustration />
+  <div class="bg-black">
+    <div class="max-w-screen-xl px-6 mx-auto pt-8">
+      <p class="pb-8 mb-8 opacity-75 border-b border-gray-700">
+        Part of{" "}
+        <strong>
+          <a
+            class="link"
+            href="https://global.insure-our-future.com/global-week-of-action-2024/"
+            target="_blank"
+          >
+            Global Week of Action 2024
+          </a>
+        </strong>
+      </p>
+      <div class="grid grid-cols-6 gap-y-12 mb-12">
+        <FooterLogos />
+        <ColophonReset />
+        <ColophonIof />
+      </div>
+      <p class="opacity-50 text-sm pb-4">
+        created by{" "}
+        <a class="link" href="https://druit.org/" target="_blank"> druit.org</a>
+      </p>
+    </div>
+  </div>
+</footer>

src/views/layout/FooterIllustration.astro

@@ -0,0 +1,20 @@
+<div class="grid md:grid-cols-3 pb-6">
+  <img
+    src="/images/spekacky.webp"
+    width="6072"
+    height="2242"
+    loading="lazy"
+    alt=""
+    class="hidden md:block md:col-span-2 invert"
+  />
+  <div class="grid place-content-center">
+    <img
+      src="/images/logo-white.webp"
+      width="1024"
+      height="493"
+      loading="lazy"
+      class="max-w-[240px] lg:max-w-[300px]"
+      alt="Let’s stop dirty money"
+    />
+  </div>
+</div>

src/views/layout/FooterLogos.astro

@@ -0,0 +1,15 @@
+---
+import LogoIof from "../logos/LogoIof.astro";
+import LogoReset from "../logos/LogoReset.astro";
+---
+
+<div
+  class="col-span-6 md:col-span-2 flex md:flex-col items-center md:items-start gap-x-12 gap-y-6 opacity-75 md:border-r border-gray-700 md:mr-8"
+>
+  <a href="https://re-set.cz/en" target="_blank">
+    <LogoReset class="h-8" />
+  </a>
+  <a href="https://global.insure-our-future.com/" target="_blank">
+    <LogoIof class="h-16" />
+  </a>
+</div>

src/views/logos/LogoIof.astro

@@ -0,0 +1,51 @@
+<svg viewBox="0 0 65 65" fill="none" xmlns="http://www.w3.org/2000/svg" {...Astro.props}>
+  <path
+    d="M0.800356 61.1753C0.757846 60.4322 0.939188 59.6933 1.32092 59.0544C1.70266 58.4155 2.26722 57.9059 2.94157 57.5915C3.61592 57.2772 4.36903 57.1725 5.10348 57.2911C5.83792 57.4097 6.5199 57.7461 7.06118 58.2567C7.60247 58.7674 7.97816 59.4288 8.13965 60.1555C8.30113 60.8821 8.24099 61.6405 7.967 62.3326C7.693 63.0247 7.21776 63.6185 6.60276 64.0374C5.98776 64.4562 5.2613 64.6808 4.51735 64.682C4.03986 64.7098 3.56172 64.6397 3.11225 64.4761C2.66277 64.3124 2.25143 64.0587 1.90342 63.7304C1.55541 63.402 1.27807 63.0061 1.0884 62.5667C0.898722 62.1274 0.800706 61.6539 0.800356 61.1753ZM6.64135 61.1753C6.63194 60.7572 6.49943 60.3511 6.26039 60.0079C6.02136 59.6648 5.68645 59.3998 5.2976 59.2463C4.90876 59.0927 4.48328 59.0574 4.07446 59.1447C3.66564 59.232 3.29167 59.4381 2.99938 59.7372C2.7071 60.0362 2.5095 60.4149 2.43134 60.8258C2.35319 61.2367 2.39795 61.6615 2.56002 62.0471C2.72209 62.4327 2.99426 62.7618 3.34244 62.9933C3.69062 63.2248 4.09932 63.3483 4.51735 63.3484C4.80248 63.3562 5.08616 63.305 5.35057 63.1979C5.61497 63.0908 5.85441 62.9303 6.05385 62.7262C6.25329 62.5222 6.40843 62.2791 6.50953 62.0122C6.61063 61.7453 6.65551 61.4604 6.64135 61.1753Z"
+    fill="white"></path>
+  <path
+    d="M9.15723 61.5855V57.7823H10.7279V61.5271C10.7279 62.8171 11.2908 63.3516 12.2402 63.3516C13.1896 63.3516 13.7536 62.8203 13.7536 61.5271V57.7823H15.3041V61.5855C15.3041 62.4011 14.9803 63.1833 14.4039 63.76C13.8275 64.3368 13.0458 64.6608 12.2307 64.6608C11.4155 64.6608 10.6338 64.3368 10.0574 63.76C9.48103 63.1833 9.15723 62.4011 9.15723 61.5855Z"
+    fill="white"></path>
+  <path
+    d="M20.9922 64.5715L19.6827 62.6789H18.2395V64.5715H16.6677V57.7802H19.6062C21.4201 57.7802 22.5544 58.7217 22.5544 60.2445C22.5731 60.7028 22.4489 61.1556 22.1988 61.54C21.9488 61.9245 21.5853 62.2215 21.1589 62.3899L22.6807 64.5726L20.9922 64.5715ZM19.5181 59.0607H18.2384V61.4282H19.5181C20.4739 61.4282 20.9624 60.9819 20.9624 60.2445C20.9624 59.507 20.4771 59.0607 19.5181 59.0607Z"
+    fill="white"></path>
+  <path
+    d="M27.7199 59.0426V60.8417H30.8613V62.102H27.7199V64.5758H26.1492V57.7845H31.2787V59.0469L27.7199 59.0426Z"
+    fill="white"></path>
+  <path
+    d="M32.0911 61.5855V57.7823H33.6618V61.5271C33.6618 62.8171 34.2247 63.3516 35.1751 63.3516C36.1256 63.3516 36.6864 62.8203 36.6864 61.5271V57.7823H38.2379V61.5855C38.2455 61.9942 38.1716 62.4004 38.0206 62.7802C37.8695 63.16 37.6443 63.5059 37.3581 63.7977C37.0719 64.0894 36.7305 64.3211 36.3537 64.4793C35.977 64.6375 35.5726 64.719 35.164 64.719C34.7554 64.719 34.351 64.6375 33.9743 64.4793C33.5975 64.3211 33.2561 64.0894 32.9699 63.7977C32.6837 63.5059 32.4585 63.16 32.3074 62.7802C32.1563 62.4004 32.0835 61.9942 32.0911 61.5855Z"
+    fill="white"></path>
+  <path
+    d="M40.8855 59.0607H38.7137V57.7802H44.629V59.0607H42.4573V64.5715H40.8866L40.8855 59.0607Z"
+    fill="white"></path>
+  <path
+    d="M45.1027 61.5855V57.7823H46.6745V61.5271C46.6745 62.8171 47.2373 63.3516 48.1867 63.3516C49.1362 63.3516 49.699 62.8203 49.699 61.5271V57.7823H51.2506V61.5855C51.2582 61.9942 51.1843 62.4004 51.0332 62.7802C50.8822 63.16 50.657 63.5059 50.3708 63.7977C50.0846 64.0894 49.7431 64.3211 49.3664 64.4793C48.9897 64.6375 48.5852 64.719 48.1767 64.719C47.7681 64.719 47.3636 64.6375 46.9869 64.4793C46.6102 64.3211 46.2688 64.0894 45.9826 63.7977C45.6964 63.5059 45.4712 63.16 45.3201 62.7802C45.169 62.4004 45.0951 61.9942 45.1027 61.5855Z"
+    fill="white"></path>
+  <path
+    d="M56.9302 64.5715L55.6207 62.6789H54.1754V64.5715H52.6047V57.7802H55.5422C57.355 57.7802 58.4892 58.7217 58.4892 60.2445C58.5079 60.7029 58.3835 61.1558 58.1332 61.5403C57.883 61.9247 57.5193 62.2217 57.0927 62.3899L58.6145 64.5726L56.9302 64.5715ZM55.4572 59.0607H54.1828V61.4282H55.4572C56.413 61.4282 56.9026 60.9819 56.9026 60.2445C56.9026 59.507 56.4162 59.0607 55.4572 59.0607Z"
+    fill="white"></path>
+  <path
+    d="M64.7943 63.3112V64.5715H59.5385V57.7802H64.6679V59.0426H61.0996V60.5165H64.2516V61.7385H61.0975V63.3112H64.7943Z"
+    fill="white"></path>
+  <path d="M1.28568 38.6369H4.05855V53.5764H1.28568V38.6369Z" fill="white"></path>
+  <path
+    d="M16.2758 43.3103C16.7363 43.8106 17.0893 44.4001 17.3129 45.0424C17.5365 45.6847 17.626 46.3661 17.5757 47.0444V53.5754H14.9101V47.3866C14.9706 46.5737 14.7187 45.7683 14.2059 45.1349C13.9446 44.8734 13.6307 44.6706 13.285 44.54C12.9393 44.4093 12.5697 44.3538 12.2009 44.3772C11.7732 44.3549 11.3455 44.4221 10.9453 44.5745C10.545 44.7269 10.1809 44.9612 9.87618 45.2624C9.26811 45.9672 8.96277 46.8838 9.02658 47.8127V53.5754H6.36096V42.1797H8.89914V43.6514C9.34605 43.1209 9.91797 42.71 10.5633 42.456C11.2838 42.1764 12.0516 42.0389 12.8243 42.0511C13.4543 42.0218 14.0838 42.118 14.6763 42.3342C15.2688 42.5503 15.8125 42.8822 16.2758 43.3103Z"
+    fill="white"></path>
+  <path
+    d="M21.5911 53.3618C20.84 53.178 20.1257 52.8675 19.4788 52.4437L20.5026 50.4162C21.0717 50.7831 21.6939 51.0602 22.3472 51.2376C23.0373 51.4398 23.7523 51.5439 24.4712 51.5468C26.0635 51.5468 26.86 51.1271 26.8607 50.2876C26.8658 50.1012 26.8088 49.9184 26.6989 49.7679C26.589 49.6173 26.4323 49.5075 26.2533 49.4556C25.6183 49.2449 24.9647 49.0952 24.3013 49.0082C23.5259 48.9018 22.7595 48.7377 22.0085 48.5173C21.4204 48.3337 20.8908 47.9988 20.4728 47.546C20.0134 47.0115 19.7803 46.3189 19.8229 45.6152C19.812 45.1038 19.9304 44.5978 20.1671 44.1443C20.4038 43.6909 20.7512 43.3046 21.1769 43.0213C22.2646 42.3219 23.5444 41.9821 24.8355 42.0501C25.625 42.051 26.4119 42.1405 27.1815 42.3168C27.8545 42.4536 28.502 42.6949 29.1005 43.032L28.0767 45.0595C27.0859 44.4855 25.9579 44.1917 24.8132 44.2094C24.1993 44.1732 23.5864 44.2943 23.0322 44.5611C22.8545 44.6438 22.7033 44.7745 22.596 44.9387C22.4886 45.1028 22.4293 45.2937 22.4248 45.4898C22.4199 45.6914 22.4808 45.889 22.5982 46.0528C22.7157 46.2165 22.8834 46.3375 23.0758 46.3973C23.7298 46.6321 24.4058 46.8001 25.0936 46.8989C25.8512 47.0073 26.5998 47.1714 27.3333 47.3898C27.9068 47.5688 28.4246 47.8923 28.8371 48.3292C29.2845 48.8489 29.5103 49.5235 29.4658 50.2079C29.4735 50.7179 29.3501 51.2212 29.1074 51.6697C28.8647 52.1181 28.5109 52.4966 28.0799 52.7689C26.9477 53.4638 25.6308 53.7974 24.3045 53.7252C23.3878 53.7267 22.4751 53.6045 21.5911 53.3618Z"
+    fill="white"></path>
+  <path
+    d="M42.1737 42.1797V53.5764H39.6355V52.1249C39.2037 52.6409 38.6555 53.047 38.0361 53.3097C37.3827 53.5901 36.6783 53.7319 35.9674 53.7262C35.3142 53.7628 34.6603 53.6693 34.0434 53.4514C33.4265 53.2334 32.859 52.8952 32.3736 52.4564C31.9089 51.952 31.5527 51.3575 31.3271 50.7096C31.1015 50.0618 31.0112 49.3746 31.062 48.6904V42.1807H33.7276V48.327C33.6633 49.1517 33.9108 49.9705 34.4211 50.6212C34.6763 50.8819 34.9847 51.0845 35.3252 51.2152C35.6657 51.346 36.0303 51.4018 36.3943 51.3789C36.8139 51.3992 37.2331 51.3307 37.6245 51.178C38.0159 51.0253 38.3707 50.7918 38.6659 50.4927C39.2686 49.7851 39.5708 48.8698 39.5081 47.9423V42.1797H42.1737Z"
+    fill="white"></path>
+  <path
+    d="M51.6435 42.0511V44.5908C51.4399 44.5506 51.233 44.5292 51.0254 44.5271C50.5795 44.5013 50.1331 44.5687 49.7146 44.7249C49.2961 44.8811 48.9146 45.1228 48.5945 45.4346C47.969 46.156 47.6544 47.0958 47.7194 48.0487V53.5743H45.0538V42.1797H47.592V43.8438C48.0515 43.2164 48.6676 42.7207 49.3785 42.4061C50.0895 42.0915 50.8705 41.9691 51.6435 42.0511Z"
+    fill="white"></path>
+  <path
+    d="M64.2697 48.7308H55.3361C55.4684 49.5309 55.9088 50.2473 56.5627 50.7264C57.2813 51.2352 58.1469 51.4939 59.0266 51.4628C59.5995 51.4815 60.1702 51.3811 60.7024 51.168C61.2347 50.9549 61.7171 50.6338 62.1191 50.2249L63.5486 51.8688C63.0283 52.4865 62.361 52.9634 61.6083 53.2555C60.6483 53.607 59.6279 53.7635 58.6068 53.7159C57.5857 53.6683 56.5842 53.4175 55.6611 52.9782C54.7406 52.5114 53.974 51.789 53.4532 50.8975C52.9263 49.9795 52.6573 48.936 52.6748 47.8775C52.6593 46.8287 52.9205 45.7944 53.432 44.8788C53.9241 44.0025 54.6518 43.2817 55.5326 42.7981C56.4613 42.2932 57.5046 42.037 58.5614 42.0543C59.5997 42.037 60.6246 42.2908 61.535 42.7907C62.4002 43.272 63.1105 43.9901 63.5825 44.8607C64.0871 45.8081 64.3405 46.8691 64.3185 47.9423C64.315 48.1265 64.2987 48.3894 64.2697 48.7308ZM56.3886 44.9425C55.7922 45.459 55.4085 46.1784 55.3117 46.9615H61.775C61.6875 46.1862 61.3151 45.4711 60.73 44.9553C60.1264 44.4364 59.3505 44.1623 58.555 44.187C57.7645 44.1642 56.9933 44.4325 56.3886 44.9425Z"
+    fill="white"></path>
+  <path
+    d="M43.377 17.193L49.6056 15.8679C49.6056 15.8679 52.2415 18.6552 52.1289 18.6881C49.1749 19.5846 46.116 20.0887 43.0307 20.1875C42.3935 17.5043 41.0129 15.8498 38.3218 15.7489C36.1182 15.666 34.6707 16.8019 33.563 19.3873C27.3673 17.9549 21.1206 16.6989 14.7125 17.0495C14.6956 17.0591 13.4658 14.2474 13.4658 14.2474L13.6091 14.0837C13.6091 14.0837 27.1698 16.6521 30.9006 17.3396C30.979 17.3523 31.0594 17.3444 31.1339 17.3166C31.2084 17.2889 31.2744 17.2422 31.3254 17.1813C28.2679 15.8551 19.5372 12.1147 16.3013 10.7088C16.2758 10.7279 19.4554 7.15004 19.4554 7.15004C19.4554 7.15004 31.3976 14.1496 33.853 15.3323C32.2727 13.4196 23.4602 2.81025 23.4602 2.81025L25.2656 0.718994L28.6014 1.46283C28.6014 1.46283 35.4491 12.5142 36.2722 13.6236L34.0887 2.6296L40.4989 4.03653C40.4989 4.03653 38.8889 12.7055 38.7509 13.9615C38.8369 13.9254 43.7349 6.3892 43.7349 6.3892L48.0349 12.4813L43.377 17.193Z"
+    fill="white"></path>
+  <path
+    d="M47.301 20.8633C42.7218 21.7149 38.0178 21.6314 33.4717 20.6178C27.6512 19.0297 21.6225 18.3399 15.594 18.5723L15.3752 18.5882L16.5243 21.1598L21.2693 31.7659H31.9031L31.918 31.7734C32.0325 31.8277 32.157 31.8578 32.2836 31.8616C32.4103 31.8655 32.5364 31.843 32.6539 31.7957L32.7017 31.768H43.943C43.943 31.768 45.1271 29.7299 46.1286 28.0616C46.5367 27.3223 46.9918 26.6099 47.4911 25.9289L47.4125 25.9618L49.9773 21.7113L50.5964 20.6816L50.8927 20.1885C49.7007 20.4404 48.5032 20.6654 47.301 20.8633Z"
+    fill="white"></path>
+</svg>

src/views/logos/LogoReset.astro

@@ -0,0 +1,13 @@
+<svg viewBox="0 0 512 90" fill="currentColor" xmlns="http://www.w3.org/2000/svg" {...Astro.props}>
+  <title>Re-set</title>
+  <path
+    d="M0 86.3649H17.8906V52.6717C17.8906 36.609 31.6034 31.2535 49.364 31.9074V17.2806C33.5632 17.1506 23.2461 21.5903 17.8906 32.5594V18.0645H0V86.3649ZM123.15 65.4705C120.93 72.1301 113.095 75.7877 99.9038 75.7877C83.3191 75.7877 73.132 69.5183 71.958 55.8055H140.912V51.1039C140.912 26.6838 121.584 16.6268 98.3378 16.6268C72.61 16.6268 53.8055 30.7315 53.8055 51.8878V52.9336C53.8055 74.3499 72.3499 87.6708 99.5137 87.6708C122.368 87.6708 137.125 79.9654 140.388 65.4705H123.15ZM98.3378 28.5117C113.357 28.5117 122.236 33.4734 123.15 44.9663H72.61C75.3537 32.8213 85.669 28.5117 98.3378 28.5117Z"
+  ></path>
+  <path
+    d="M323.554 87.6708C347.713 87.6708 360.903 79.7054 360.903 65.6006C360.903 50.7119 348.497 46.6642 324.728 44.5744C308.927 42.8765 303.311 41.0486 303.311 35.9551C303.311 30.8616 310.233 28.2498 321.334 28.2498C333.479 28.2498 339.354 30.9934 341.442 37.261H358.161C355.679 21.8504 341.184 16.6268 321.464 16.6268C303.179 16.6268 286.595 23.2881 286.595 37.3911C286.595 50.0599 296.128 55.2835 319.766 57.7652C336.874 59.4631 343.404 61.421 343.404 67.2985C343.404 73.044 337.525 76.0478 323.422 76.0478C308.797 76.0478 302.397 71.8682 301.221 64.9468H284.245C285.159 79.4435 299.132 87.8008 323.554 87.6708ZM437.17 65.4705C434.949 72.1301 427.113 75.7877 413.924 75.7877C397.338 75.7877 387.152 69.5183 385.976 55.8055H454.931V51.1039C454.931 26.6838 435.602 16.6268 412.356 16.6268C386.629 16.6268 367.824 30.7315 367.824 51.8878V52.9336C367.824 74.3499 386.368 87.6708 413.532 87.6708C436.386 87.6708 451.143 79.9655 454.409 65.4705H437.17ZM412.356 28.5117C427.375 28.5117 436.254 33.4734 437.17 44.9663H386.629C389.372 32.8213 399.689 28.5117 412.356 28.5117ZM498.549 87.5408C504.817 87.5408 508.734 86.7569 512 85.8429V73.044C508.996 73.958 505.993 74.3499 501.943 74.3499C494.239 74.3499 490.06 72 490.06 63.2489V30.3396H511.608V18.0645H490.06V2H472.037V18.0645H459.37V30.3396H472.037V64.4248C472.037 79.9655 481.179 87.5408 498.549 87.5408Z"
+  ></path>
+  <path d="M251.525 43.5033H160.432V58.7279H251.525V43.5033Z"></path>
+  <path d="M221.683 24.5525L232.45 13.7856L269.777 51.1147L259.012 61.8816L221.683 24.5525Z"></path>
+  <path d="M232.448 88.4439L221.683 77.6788L259.012 40.3496L269.777 51.1147L232.448 88.4439Z"
+  ></path>
+</svg>

tailwind.config.mjs

@@ -4,7 +4,6 @@ export default {
   theme: {
     fontFamily: {
       display: "var(--font-display)",
-      display2: "var(--font-display2)",
       body: "var(--font-body)",
     },
     fontSize: {
@@ -12,8 +11,8 @@ export default {
       sm: ["0.875rem", { lineHeight: "calc(var(--line-height-factor) * 1.25rem)" }],
       base: ["1rem", { lineHeight: "calc(var(--line-height-factor) * 1.5rem)" }],
       lg: ["1.125rem", { lineHeight: "calc(var(--line-height-factor) * 1.75rem)" }],
-      xl: ["1.25rem", { lineHeight: "calc(var(--line-height-factor) * 1.75rem)" }],
+      xl: ["1.25rem", { lineHeight: "calc(var(--line-height-factor) * 1.875rem)" }],
-      "2xl": ["1.5rem", { lineHeight: "calc(var(--line-height-factor) * 2rem)" }],
+      "2xl": ["1.5rem", { lineHeight: "calc(var(--line-height-factor) * 2.125rem)" }],
       "3xl": ["1.875rem", { lineHeight: "calc(var(--line-height-factor) * 2.25rem)" }],
       "4xl": ["2.25rem", { lineHeight: "calc(var(--line-height-factor) * 2.5rem)" }],
       "5xl": ["3rem", { lineHeight: "calc(var(--line-height-factor) * 1)" }],