added content.svelte to handle page max width for specific elements; added alternative page banner

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

@@ -1,5 +1,6 @@
 <script lang="ts">
     import BannerTitle from "$lib/banner-title.svelte";
+    import Content from "$lib/content.svelte";
     import type { DevlogPost } from "$lib/devlog-posts";
     import { posts } from "$lib/devlog-posts";
 </script>
@@ -8,18 +9,19 @@
     <title>Project N5 Devlog | denizk0461</title> 
 </svelte:head>
 
-<BannerTitle title="Project N5; Development Log" banner="/projects/projectn5/devlog/20240323/unity_overview.webp" />
+<Content>
+    <BannerTitle title="Project N5; Development Log" banner="/projects/projectn5/devlog/20240323/unity_overview.webp" />
 
-<p>This is the development log for my game <strong>Project N5</strong>! It's an action-adventure jump-and-run game heavily inspired by games such as Ratchet & Clank. Development started on <b>2023-09-16</b>.</p>
+    <p>This is the development log for my game <strong>Project N5</strong>! It's an action-adventure jump-and-run game heavily inspired by games such as Ratchet & Clank. Development started on <b>2023-09-16</b>.</p>
 
-<p>2023 progress updates summarise an entire month's work, respectively. Progress updates thereafter denote noteworthy achievements in a more collected format.</p>
-
-<div class="post-container">
-    {#each posts as post}
-    {@render devlogPost({post})}
-    {/each}
-</div>
+    <p>2023 progress updates summarise an entire month's work, respectively. Progress updates thereafter denote noteworthy achievements in a more collected format.</p>
 
+    <div class="post-container">
+        {#each posts as post}
+        {@render devlogPost({post})}
+        {/each}
+    </div>
+</Content>
 
 {#snippet devlogPost({post}: {post: DevlogPost})}
 <a href="/projects/projectn5/devlog/{post.date}/" class="post">