fixed font link for subpages; reduced width of devlog posts; reduced height of banner; removed old banner

src/routes/+layout.svelte

@@ -19,27 +19,27 @@
     /* Roboto Flex */
     @font-face {
         font-family: "Roboto Flex";
-        src: url("fonts/roboto-flex/flex.ttf");
+        src: url("/fonts/roboto-flex/flex.ttf");
     }
 
     /* Space Mono */
     @font-face {
         font-family: "Space Mono";
-        src: url("fonts/space-mono/regular.ttf");
+        src: url("/fonts/space-mono/regular.ttf");
     }
     @font-face {
         font-family: "Space Mono";
-        src: url("fonts/space-mono/italic.ttf");
+        src: url("/fonts/space-mono/italic.ttf");
         font-style: italic;
     }
     @font-face {
         font-family: "Space Mono";
-        src: url("fonts/space-mono/bold.ttf");
+        src: url("/fonts/space-mono/bold.ttf");
         font-weight: bold;
     }
     @font-face {
         font-family: "Space Mono";
-        src: url("fonts/space-mono/bolditalic.ttf");
+        src: url("/fonts/space-mono/bolditalic.ttf");
         font-style: italic;
         font-weight: bold;
     }
@@ -47,7 +47,7 @@
     /* IBM Plex Mono */
     @font-face {
         font-family: "IBM Plex Mono";
-        src: url("fonts/ibm-plex-mono/medium.ttf");
+        src: url("/fonts/ibm-plex-mono/medium.ttf");
         font-weight: 500;
     }
 
@@ -76,8 +76,10 @@
             --font-mono: 'IBM Plex Mono', monospace;
 
             --page-width: 1200px;
-
+            --content-width: 900px;
             --screen-width-mobile: 800px;
+
+            --margin-content-side: 24px;
         }
 
         html {
@@ -117,7 +119,8 @@
 
         p, span, li, pre, a {
             color: var(--color-text);
-            line-height: 1.8rem;
+            font-size: 1.1rem;
+            line-height: 1.6rem;
             font-weight: 400;
         }
         ul {
@@ -179,7 +182,7 @@
 
         h1, h2, h3, h4, h5, h6 {
             font-weight: 870;
-            font-family: var(--font-title);
+            font-family: var(--font-sans-serif);
             color: var(--color-highlight);
             margin-top: 12px;
             margin-bottom: 8px;
@@ -346,10 +349,8 @@
                 line-height: 1.4rem;
             }
 
-            p, span, li, pre, a {
-                font-size: 1.1rem;
-                line-height: 1.7rem;
-            }
+            /* p, span, li, pre, a {
+            } */
         }
     }
 </style>

src/routes/+page.svelte

@@ -39,7 +39,7 @@
 
 <svelte:head>
     <title>denizk0461's website</title> 
-    <meta name="description" content="German developer posting about gamedev, programming, electronics projects, and sometimes music too.">
+    <meta name="description" content="I'm a developer posting about my gamedev, programming, electronics, and sometimes music projects!">
 </svelte:head>
 
 <Content>

src/routes/feeds/+page.svelte

@@ -1,5 +1,5 @@
 <script lang="ts">
-    import BannerTitleAlt from "$lib/banner-title-alt.svelte";
+    import Banner2 from "$lib/banner2.svelte";
     import Content from "$lib/content.svelte";
     import LinkList, { type LinkEntry } from "$lib/link-list.svelte";
 
@@ -15,12 +15,10 @@
     <title>Feeds | denizk0461</title> 
 </svelte:head>
 
-<BannerTitleAlt
+<Banner2
     title="Feeds"
-    banner="/feeds/banner.webp"
-    bannerAlt="Music files in a Windows 10 Explorer window"
     subtitle="XML feeds"
-	pixelated
+	banner="banner.webp"
 />
 
 <Content>    

src/routes/projects/daisyfm/+page.svelte

@@ -1,5 +1,5 @@
 <script lang="ts">
-    import BannerTitle from "$lib/banner-title.svelte";
+    import BannerTitleAlt from "$lib/banner-title-alt.svelte";
     import Content from "$lib/content.svelte";
     import TableOfContents from "$lib/table-of-contents.svelte";
 </script>
@@ -8,12 +8,12 @@
     <title>Daisy FM Synth | denizk0461</title> 
 </svelte:head>
 
-<Content>
-    <BannerTitle
-        title="Daisy FM Synth"
-        banner="/projects/daisyfm/banner.webp"
-        bannerAlt="Close-up of Daisy, focussed on the effect knobs"/>
+<BannerTitleAlt
+    title="Daisy FM Synth"
+    banner="/projects/daisyfm/banner.webp"
+    bannerAlt="Close-up of Daisy, focussed on the effect knobs"/>
 
+<Content>
     <img src="/projects/daisyfm/fullview.webp" alt="Top view of the Daisy FM synth">
 
     <p>A friend showed me the <a href="https://electro-smith.com/products/daisy-seed">Daisy Seed</a>, an Arduino-compatible microcontroller made for developing audio equipment. With a little bit of motivation and absolutely no experience in either programming synthesisers or electronics in general, I quickly got my hands on one and started to toy around.</p>

src/routes/projects/projectn5/devlog/[year]/[date]/+page.svelte

@@ -1,6 +1,6 @@
 <script>
     import BannerTitleAlt from "$lib/banner-title-alt.svelte";
-    import ContentSidebar from "$lib/content-sidebar.svelte";
+    import Content from "$lib/content.svelte";
     import TableOfContents from "$lib/table-of-contents.svelte";
 
 	export let data;
@@ -19,12 +19,12 @@
     bannerAlt="{data.bannerAlt}"    
 />
 
-<ContentSidebar>
+<Content useContentWidth>
 
-    <TableOfContents slot="side-left" />
+    <TableOfContents disableStickyScrolling />
 
-    <div slot="main">
-		<svelte:component this={data.content} />
-	</div>
+    <!-- <div slot="main"> -->
+    <svelte:component this={data.content} />
+	<!-- </div> -->
 
-</ContentSidebar>
+</Content>