From c9535fefafc92be3dd41d870e2d1df8dd154cca3 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Julian=20T=C3=B6lle?= Date: Sun, 26 Mar 2023 00:37:32 +0100 Subject: [PATCH] feat: nicer design, font, logo Font is "Vinque" from 1001freefonts Logo is generated by Midjourney --- src/app.css | 12 +++++++++ src/lib/about/hero.svelte | 2 +- src/lib/credits/actor.svelte | 2 +- src/lib/layout/NavLink.svelte | 5 ++-- src/routes/+layout.svelte | 23 +++++++++++------ src/routes/+page.svelte | 26 ++----------------- static/logo.png | 3 +++ static/vinque.ttf | Bin 0 -> 42872 bytes tailwind.config.cjs | 46 ++++++++++++++++++++++++++++++++-- 9 files changed, 81 insertions(+), 38 deletions(-) create mode 100644 static/logo.png create mode 100644 static/vinque.ttf diff --git a/src/app.css b/src/app.css index 1a7b7cf..cd2cd69 100644 --- a/src/app.css +++ b/src/app.css @@ -1,4 +1,16 @@ /* Write your global styles here, in PostCSS syntax */ @tailwind base; + +@layer base { + html { + @apply font-vinque bg-cocoa-brown-700 p-4; + } +} + @tailwind components; @tailwind utilities; + +@font-face { + font-family: "Vinque"; + src: url("vinque.ttf"); +} diff --git a/src/lib/about/hero.svelte b/src/lib/about/hero.svelte index b3a89ac..f0dadf2 100644 --- a/src/lib/about/hero.svelte +++ b/src/lib/about/hero.svelte @@ -11,7 +11,7 @@ {`Grafik
-

{name}

+

{name}

{description} diff --git a/src/lib/credits/actor.svelte b/src/lib/credits/actor.svelte index e58e9ca..4f6c1e4 100644 --- a/src/lib/credits/actor.svelte +++ b/src/lib/credits/actor.svelte @@ -4,5 +4,5 @@

- {role} - {actor} + {role} - {actor}
diff --git a/src/lib/layout/NavLink.svelte b/src/lib/layout/NavLink.svelte index 890c401..5dc5bd7 100644 --- a/src/lib/layout/NavLink.svelte +++ b/src/lib/layout/NavLink.svelte @@ -3,10 +3,9 @@ export let text: string; -
  • +
  • {text} diff --git a/src/routes/+layout.svelte b/src/routes/+layout.svelte index 3e40cdf..a60783c 100644 --- a/src/routes/+layout.svelte +++ b/src/routes/+layout.svelte @@ -3,12 +3,19 @@ import NavLink from "$lib/layout/NavLink.svelte"; -
    - +
    + Logo, Illustration von einem Pfeil über einem Herz
    -