feat: custom navbar items and footer

src/config.ts

@@ -1,6 +1,14 @@
 export const siteConfig = {
     title: '/var/log/mercury',
     description: 'A blog about software development, technology, and life.',
+    navBarItems: [
+        // additional items in the navbar
+        // the order of the items will be the same as the order in the array
+        // format is { text: string, link: string }
+        { text: "RSS", link: "/rss.xml" },
+        { text: "GitHub", link: "https://github.com/GrassBlock1/mercury" },
+    ],
+    customFooter: '<i>I have no mouth, and I must SCREAM</i>',
     comments: {
         type: 'fediverse', // 'artalk','giscus','fediverse','hatsu'
         artalk: {

src/layouts/Layout.astro

@@ -13,6 +13,9 @@ interface Props {
 const defaultTitle = siteConfig.title
 const formattedPath = defaultTitle.toLowerCase().replace(/\s+/g, '-');
 
+const navBarItems = siteConfig.navBarItems
+const customFooter = siteConfig.customFooter
+
 const { title, path = formattedPath } = Astro.props;
 // TODO: make the path dynamic
 ---
@@ -36,6 +39,7 @@ const { title, path = formattedPath } = Astro.props;
         <nav class="nav">
           <a href="/">Home</a>
           <a href="/blog">Blog</a>
+          {navBarItems.map((item) => <a href={item.link}>{item.text}</a>)}
         </nav>
 
         <Search />
@@ -52,7 +56,8 @@ const { title, path = formattedPath } = Astro.props;
         <ThemeSwitcher/>
       </div>
       <div class="container">
-        Powered by <a href="https://git.gb0.dev/gb/mercury"><img src="/mercury.svg" width="16px" alt="mercury logo" /> mercury</a>
+        <Fragment set:html={customFooter} />
+        <p>Powered by <a href="https://git.gb0.dev/gb/mercury"><img src="/mercury.svg" width="16px" alt="mercury logo" /> mercury</a></p>
       </div>
     </footer>
   </body>