adjusted page width media query for devlog post buttons, and possibly some other things too

src/lib/header.svelte

@@ -1,20 +1,17 @@
-<!-- <div class="header-content transparent-header">
-    {@render headerContent()}
-</div> -->
-<div class="header-content coloured-header">
-    {@render headerContent()}
-</div>
-
 {#snippet headerContent()}
     <a class="favicon" href="/">
         <img class="favicon-image" src="/favicon.webp" alt="Favicon">
     </a>
     <a href="/projects">Projects</a>
-    <a href="/projects/projectn5/devlog">Devlog</a>
+    <a href="/projects/projectn5/devlog">Project N5</a>
     <a href="/">Blog</a>
     <a href="/about">About</a>
 {/snippet}
 
+<div class="header-content coloured-header">
+    {@render headerContent()}
+</div>
+
 <style>
     .header-content {
         box-sizing: border-box;
@@ -23,7 +20,7 @@
         display: flex;
         flex-direction: row;
         justify-content: flex-start;
-        gap: 16px;
+        gap: 20px;
         align-items: center;
         padding: 0 24px;
     }
@@ -33,9 +30,9 @@
     }
 
 
-    .transparent-header {
+    /* .transparent-header {
         background: linear-gradient(90deg, var(--color-background-highlight) 62%, var(--color-header-highlight) 95%);
-    }
+    } */
 
     .favicon {
         background: url("/favicon.webp");

src/routes/+layout.svelte

@@ -15,7 +15,6 @@
 </div>
 
 <style>
-
     /* #region Fonts */
     /* Roboto Flex */
     @font-face {

src/routes/+page.svelte

@@ -7,6 +7,7 @@
     import { quotes, type Quote } from "./quotes";
 
     import { posts, type DevlogPost } from "./projects/projectn5/devlog/posts";
+    import { type GalleryEntry } from "$lib/lists/gallery-entry.svelte";
 
     let meImg: string = $state("common/me/a.webp");
     let marqueeQuote: Quote = $state({
@@ -14,43 +15,12 @@
         content: "",
         source: "",
     });
-
-    onMount(() => {
-        setPicture();
-        setMarqueeText();
-    });
-
-    function getRandom(max: number): number {
-        return Math.floor(Math.random() * max);
-    }
-
-    let setPicture = function() {
-        var pictures = ["a", "b", "c", "e"];
-        var selectedPicture = pictures[getRandom(pictures.length)];
-        meImg = "common/me/" + selectedPicture + ".webp";
-    };
-
-    let setMarqueeText = function() {
-        marqueeQuote = quotes[getRandom(quotes.length)];
-    };
-
     let latestDevlogDate = posts.values().next().value?.date ?? "could not fetch";
-</script>
 
-<svelte:head>
-    <title>denizk0461's website</title> 
-    <meta name="description" content="I'm a developer posting about my gamedev, programming, electronics, and sometimes music projects!">
-</svelte:head>
-
-<Content>
-    <h1 class="gradient-title"><i>Moin!</i> ~ welcome to my website :)</h1>
-
-    <div class="container">
-        <div class="subcontainer">
-            <Gallery entries={[
+    const galleryEntries: GalleryEntry[] = [
         {
             title: "Project N5 – devlog",
-                    subtitle: "my active Godot game project about finding yourself in an unfamiliar future.\n<i>latest update: " + latestDevlogDate + "</i>",
+            subtitle: `my active Godot game project about finding yourself in an unfamiliar future.\n<i>latest update: ${latestDevlogDate}</i>`,
             fullWidth: true,
             img: "projects/projectn5/devlog/2025/0523/birds_eye.webp",
             imgAlt: "Project N5 screenshot of Laura looking down at two cuboids",
@@ -72,7 +42,39 @@
             imgAlt: "Screenshot of Hypertext Unity level. Crates are strewn across the floor, Waluigi is flying in front of the camera, and text such as 'COME AND TRY OUR ALL-NEW BLENDER' and 'omg! it's the brandenburg er tor!' is displayed",
             link: "//files.denizk0461.dev/",
         },
-            ]}/>
+    ];
+
+    onMount(() => {
+        setPicture();
+        setMarqueeText();
+    });
+
+    function getRandom(max: number): number {
+        return Math.floor(Math.random() * max);
+    }
+
+    let setPicture = function() {
+        var pictures = ["a", "b", "c", "e"];
+        var selectedPicture = pictures[getRandom(pictures.length)];
+        meImg = "common/me/" + selectedPicture + ".webp";
+    };
+
+    let setMarqueeText = function() {
+        marqueeQuote = quotes[getRandom(quotes.length)];
+    };
+</script>
+
+<svelte:head>
+    <title>denizk0461's website</title> 
+    <meta name="description" content="I'm a developer posting about my gamedev, programming, electronics, and sometimes music projects!">
+</svelte:head>
+
+<Content>
+    <h1 class="gradient-title"><i>Moin!</i> ~ welcome to my website :)</h1>
+
+    <div class="container">
+        <div class="subcontainer">
+            <Gallery entries={galleryEntries}/>
         </div>
         <div class="subcontainer">
             <div class="quote-marquee-container">

src/routes/projects/projectn5/devlog/+page.svelte

@@ -175,7 +175,7 @@
         }
     }
 
-    @media screen and (max-width: 900px) {
+    @media screen and (max-width: 700px) {
         .post-supercontainer {
             width: 100% !important;
         }