Change layout to wide.

Author: nikoshell

astro.config.mjs

@@ -11,12 +11,19 @@ import metaTags from "astro-meta-tags";
 import pagefind from "astro-pagefind";
 import deleteUnusedImages from "astro-delete-unused-images";
 import preload from "astro-preload";
+import { execSync } from "node:child_process";
 
 // https://astro.build/config
 export default defineConfig({
   vite: {
     define: {
-      "process.env.VITE_BUILD_TIME": JSON.stringify(new Date().toISOString()),
+      "import.meta.env.TIMESTAMP": new Date()
+        .toISOString()
+        .replace(/[-:T.Z]/g, "")
+        .slice(0, 14),
+      "import.meta.env.GIT_VERSION": new String(
+        execSync("git rev-parse --short HEAD")
+      ),
     },
     resolve: {
       alias: {

src/components/BaseHead.astro

@@ -5,6 +5,8 @@ interface Props {
   image?: string;
 }
 
+const buildTimestamp = import.meta.env.TIMESTAMP;
+const gitVersion = import.meta.env.GIT_VERSION;
 const canonicalURL = new URL(Astro.url.pathname, Astro.site);
 
 const { title, description, image = "/social-card.png" } = Astro.props;
@@ -15,6 +17,8 @@ const { title, description, image = "/social-card.png" } = Astro.props;
 <meta name="viewport" content="width=device-width,initial-scale=1" />
 <link rel="icon" type="image/svg+xml" href="/favicon.ico" />
 <meta name="generator" content="Astro" />
+<meta name="build-version" content={gitVersion} />
+<meta name="build-timestamp" content={buildTimestamp} />
 <link rel="sitemap" href="/sitemap-index.xml" />
 
 <meta name="referrer" content="no-referrer-when-downgrade" />

src/components/Footer.astro

@@ -8,10 +8,8 @@ const buildTimestamp = import.meta.env.TIMESTAMP;
 const gitVersion = import.meta.env.GIT_VERSION;
 ---
 
-      <div class="mt-auto">
-<Fullbleed className="bg-primary text-white">
-  <footer
-    class="max-w-4xl lg:max-w-6xl mx-auto py-16 lg:grid grid-cols-2 px-6 gap-60"
+  <div
+    class="text-white max-w-4xl lg:max-w-6xl mx-auto py-10 lg:grid grid-cols-2 px-6 gap-60"
   >
     <div>
       <nav class="mb-12">
@@ -34,7 +32,7 @@ const gitVersion = import.meta.env.GIT_VERSION;
       </nav>
     </div>
 
-    <article
+    <div
       class="flex flex-col lg:flex-row self-center gap-8 lg:gap-12 justify-end"
     >
       <div>
@@ -99,12 +97,9 @@ const gitVersion = import.meta.env.GIT_VERSION;
             twitter.com/europython <span> ↗</span>
           </a>
         </p>
-
         <p class="mb-4" style="color: rgba(255, 255, 255, 0.4)">
-          version: {gitVersion} @ {buildTimestamp}
+        version: {gitVersion} @ {buildTimestamp}
         </p>
       </div>
-    </article>
+    </div>
   </footer>
-</Fullbleed>
-</div>

src/components/Header.astro

@@ -3,6 +3,7 @@ import { promises as fs } from "fs";
 import { NavItems } from "@components/nav-items";
 import HeaderActions from "@components/header/header-actions.astro";
 import HeaderLogo from "@components/header/header-logo.astro";
+import Search from "@components/Search.astro";
 
 import links from "../data/links.json";
 ---
@@ -54,4 +55,5 @@ import links from "../data/links.json";
       />
     </nav>
   </div>
+<Search />
 </header>

src/components/card/card.astro

@@ -14,7 +14,7 @@ const { title, subtitle, url, image } = Astro.props;
 ---
 
 <div
-  class="min-w-[250px] w-full md:w-[40%] lg:w-[30%] p-4 bg-[#D5D6E6] rounded-2xl text-center flex flex-col"
+  class="prose-xl min-w-[250px] w-full md:w-[40%] lg:w-[30%] p-4 bg-[#D5D6E6] rounded-2xl text-center flex flex-col"
 >
   <a href={url} class="block">
     <div class="relative w-full">