Finish main content, add MidnightLib wiki

src/components/CallToAction.astro

@@ -1,7 +1,15 @@
+---
+const { text, url_gh, url_mr, url_cf } = Astro.props
+---
+
 <div class="container">
   <div class="call-to-action mt-24 mb-32 flex flex-col items-center gap-12 rounded-xl p-12 md:p-24">
-    <h2 class="text-center text-3xl md:text-5xl">Get this theme on GitHub</h2>
-    <a href="https://github.com/markteekman/accessible-astro-starter" class="text-center text-lg"> Use this theme</a>
+    <h2 class="text-center text-3xl md:text-5xl">{text}</h2>
+    <div class="flex-row">
+      <a href={url_gh} class="text-center text-lg">GitHub</a>
+      <a href={url_mr} class="text-center text-lg">Modrinth</a>
+      <a href={url_cf} class="text-center text-lg">CurseForge</a>
+    </div>
   </div>
 </div>
 
@@ -13,7 +21,10 @@
 
   .call-to-action a:not(button),
   .call-to-action a:not(button):visited {
+    display: inline-block;
+    vertical-align: top;
     padding: 1rem;
+    margin: 0 1rem 0 1rem;
     color: var(--neutral-900);
     font-weight: bold;
     border: 3px solid var(--neutral-900);

src/components/ContentMedia.astro

@@ -4,7 +4,7 @@ import { Media } from 'accessible-astro-components'
 const { imgSrc, reverseImg = false } = Astro.props
 ---
 
-<section class="my-64">
+<section class="my-32">
   <div class="container">
     <div class="grid grid-cols-1 gap-24 md:grid-cols-2">
       {!reverseImg ? <Media class="rounded-lg" src={imgSrc} /> : ''}

src/components/Footer.astro

@@ -1,16 +1,13 @@
 ---
-import CallToAction from './CallToAction.astro'
-
 const currentYear = new Date().getFullYear()
 ---
 
 <footer>
-  <CallToAction />
   <section class="py-8">
     <div class="container">
       <p>
-        &copy; {currentYear} - Starter Theme for <a href="https://astro.build/">Astro</a>. Made with ❤️ by <a
-          href="https://github.com/markteekman">Mark Teekman</a
+        &copy; {currentYear} - MidnightDust. A project by <a
+          href="https://github.com/Motschen">Martin Prokoph</a
         >.
       </p>
     </div>

src/components/Header.astro

@@ -14,21 +14,26 @@ import { Icon } from 'astro-icon/components'
       <a href="/blog/">Blog</a>
     </li>
     <li class="menu-item has-dropdown">
-      <button aria-haspopup="true" aria-expanded="false">Example Pages</button>
+      <button aria-haspopup="true" aria-expanded="false">Mods</button>
       <ul class="dropdown-menu">
         <li class="submenu-item">
           <a href="/mdx-page/">MDX Page</a>
         </li>
         <li class="submenu-item">
-          <a href="/markdown-page/">Markdown Page</a>
+          <a href="/midnightlib/">MidnightLib</a>
         </li>
         <li class="submenu-item">
           <a href="/accessible-components">Accessible Components</a>
         </li>
       </ul>
     </li>
-    <li class="menu-item">
-      <a href="https://accessible-astro.dev" title="external link" rel="external noopener noreferrer">External Link</a>
+    <li class="menu-item has-dropdown">
+      <button aria-haspopup="true" aria-expanded="false">Wiki</button>
+      <ul class="dropdown-menu">
+        <li class="submenu-item">
+          <a href="/wiki/midnightlib/">MidnightLib</a>
+        </li>
+      </ul>
     </li>
     <li class="menu-item type-icon">
       <a href="https://github.com/markteekman/accessible-astro-starter" title="Go to the GitHub page">

src/components/Navigation.astro

@@ -2,14 +2,14 @@
 import ResponsiveToggle from './ResponsiveToggle.astro'
 import { DarkMode } from 'accessible-astro-components'
 import { Image } from 'astro:assets'
-import logo from '../assets/img/logo.svg'
+import logo from '../assets/img/logo.png'
 ---
 
 <div id="main-navigation" class="is-desktop py-8">
   <div class="container">
     <a href="/" class="flex items-center gap-2 !no-underline">
-      <Image src={logo} alt="MidnightDust Logo" width="47" height="37" />
-      <span class="font-bold">MidnightDust by Motschen</span>
+      <Image src={logo} alt="MidnightDust Logo" width="47" height="47" />
+      <span class="font-bold">MidnightDust – Mods by Motschen</span>
     </a>
     <div class="wrapper">
       <nav class="desktop-menu" aria-label="Main navigation desktop">