Move all content into Nuxt Content

Previously, we had two pages which were directly rendered through Nuxt:
the homepage, and the news overview. This worked mostly fine, but caused
404 errors when Nuxt Content queried for `/news` and `/`. These 404
errors were harmless in (dynamic) production, but caused "nuxi generate"
to fail.

Move all content into Nuxt Content by simply making them templates. In
addition to resolving the 404 error, it also simplifies our directory
structure. Now all content is served through Nuxt Content in the
`content` directory -- simple and easy!

components/FfHomepage.vue

@@ -0,0 +1,116 @@
+<!--
+Homepage
+-->
+<template>
+  <FfHeaderHero />
+
+  <!--
+  Signpost with large icon.
+  https://fossi-foundation.zeroheight.com/styleguide/s/72268/p/53507c-signposts
+  -->
+
+  <FfContainer>
+    <!--
+    TODO: Enable once we have a tools/project listing up.
+    <div class="flex flex-col mb-32 tablet:flex-row my-24 tablet:my-48 desktop:my-64">
+      <div class="basis-1/2">
+        <IconPhPolygon class="text-ultraviolet mx-auto text-[100px] tablet:text-[150px]" />
+      </div>
+      <div class="basis-1/2">
+        <FfH3 class="mb-20">
+          Make a difference, don't reinvent UART
+        </FfH3>
+        <FfPara>
+          Pour your creativity into where you can make a difference! Open source
+          components give you a head-start. High-quality IP blocks, fast
+          simulators and synthesis tools, and much more is available for you to
+          build and use.
+        </FfPara>
+        <FfBtnCta>Browse Projects</FfBtnCta>
+      </div>
+    </div>-->
+    <div class="flex flex-col mb-32 tablet:flex-row my-24 tablet:my-48 desktop:my-64">
+      <div class="basis-1/2">
+        <IconPhUsersThree class="text-ultraviolet mx-auto text-[100px] tablet:text-[150px]" />
+      </div>
+      <div class="basis-1/2">
+        <FfH3>
+          Unlock the full potential: be a contributor
+        </FfH3>
+        <FfPara>
+          Open source is so much more than free of cost: it gives everybody,
+          including you, the ability to shape the future of a project. Unlock the
+          full benefits of open source today and become a contributor! Participate
+          in discussions, report bugs, share your improvements, or even start a
+          new free and open source silicon project!
+        </FfPara>
+        <FfBtnCta linkTo="/get-involved">Get involved in open silicon</FfBtnCta>
+      </div>
+    </div>
+    <div class="flex flex-col mb-32 tablet:flex-row my-24 tablet:my-48 desktop:my-64">
+      <div class="basis-1/2">
+        <IconPhCpu class="text-ultraviolet mx-auto text-[100px] tablet:text-[150px]" />
+      </div>
+      <div class="basis-1/2">
+        <FfH3>
+          Chip design is hard. Using open source isn't
+        </FfH3>
+        <FfPara>
+          The FOSSi Foundation is here to enable everyone to collaborate,
+          innovate, and enjoy the benefits of open source chip design. Get to know
+          like-minded developers at conferences like ORConf. Read about what's
+          happening in our world in our newsletter El Correo Libre. And reach out
+          to us if you feel confused. We're here to help.
+        </FfPara>
+        <FfBtnCta linkTo="/our-work">Explore how the FOSSi Foundation helps</FfBtnCta>
+      </div>
+    </div>
+  </FfContainer>
+
+  <!--
+  Event announcement
+  -->
+  <!--
+  <FfSignpostBanner
+    class="bg-[url('~/assets/images/banner-orconf.jpg')]"
+    title="Get your dose of FOSSi excitement at ORConf!"
+    subtitle="Join us from Sept 15 to 17 2023 in Munich, Germany for a weekend full of interesting talks, eye-opening hallway discussions, and excitement around free and open source silicon."
+    ctaLabel="Register now for ORConf 2023"
+    ctaTo="/events"
+  />
+  -->
+
+  <!--
+  News
+  -->
+  <div class="bg-pastel-grey">
+    <FfContainer class="py-32 bg-pastel-grey">
+      <FfH3 class="text-warm-black text-center mx-auto mb-32">
+        Latest FOSSi Foundation News
+      </FfH3>
+
+      <FfCards>
+        <FfBlogPostCard v-for="post in blogPosts" :post="post" />
+      </FfCards>
+    </FfContainer>
+  </div>
+
+  <!--
+  Callout: El Correo Libre
+  -->
+  <FfCalloutNewsletter/>
+</template>
+
+<script setup>
+import IconPhPolygon from '~icons/ph/polygon-bold'
+import IconPhUsersThree from '~icons/ph/users-three-bold'
+import IconPhCpu from '~icons/ph/cpu-bold'
+
+// Get the three most recent blog posts
+const blogPosts = await queryContent('/blog')
+.sort({date: -1 }) // show latest articles first
+.where({_partial: false })
+.where({ _id: { $ne: 'content:blog:index.md' } }) // Filter out the blog overview page.
+.limit(3)
+.find()
+</script>

components/FfNewsOverview.vue

@@ -0,0 +1,58 @@
+<!--
+News homepage (blog overview)
+
+TODO:
+- Instead of showing all blog posts as cards, show only a subset and link to
+  an archive or a way to load more posts.
+- Highlight blog posts in various categories, e.g., ECL posts.
+-->
+<template>
+  <!-- Latest (featured) blog post, shown large, if available -->
+  <div v-if="featuredBlogPost" class="bg-pastel-grey">
+    <FfContainer>
+      <ContentRenderer :value="featuredBlogPost" :excerpt="true">
+        <!-- Using the Content blocks/Image & text component. -->
+        <div class="flex flex-col tablet:flex-row my-auto py-24 tablet:py-64">
+          <div class="flex-auto">
+          <FfH3>Latest news</FfH3>
+            <NuxtLink :to="featuredBlogPost._path">
+              <FfH2 :href="featuredBlogPost._path">{{ featuredBlogPost.title }}</FfH2>
+              <ContentRendererMarkdown :value="featuredBlogPost" :excerpt="true" />
+            </NuxtLink>
+            <p>
+              <FfLinkUnderline v-if="featuredBlogPost._path" :to="featuredBlogPost._path">Read more ...</FfLinkUnderline>
+            </p>
+          </div>
+          <div class="flex-none max-w-[344px] order-first tablet:order-none">
+            <NuxtLink :to="featuredBlogPost._path">
+              <img class="w-max" v-if="featuredBlogPost.coverImage" :src="featuredBlogPost.coverImage"/>
+              <img class="w-max" v-else src="~/assets/images/pattern-guardianship.png"/>
+            </NuxtLink>
+          </div>
+        </div>
+      </ContentRenderer>
+    </FfContainer>
+  </div>
+
+  <FfContainer>
+    <!-- A selection of blog posts posts displayed as cards -->
+    <FfCards>
+      <FfBlogPostCard v-for="post in blogPosts" :post="post" />
+    </FfCards>
+  </FfContainer>
+</template>
+
+<script setup lang="ts">
+// Get all blog posts.
+const blogPosts = await queryContent('/blog')
+  .sort({ date: -1 }) // show latest articles first
+  .where({ _partial: false })
+  .where({ _id: { $ne: 'content:blog:index.md' } }) // Filter out this page.
+  .only(["title", "excerpt", "coverImage", "_path"])
+  .find()
+
+// Designate the most recent blog post as "featured", remove it from the list
+// of posts.
+const featuredBlogPost = blogPosts.shift()
+
+</script>

content/index.md

@@ -0,0 +1,7 @@
+---
+title: "FOSSi Foundation: the international not for profit organisation which promotes and protects the open source silicon chip movement"
+layout: default
+---
+
+::ff-homepage
+::

content/news.md

@@ -0,0 +1,8 @@
+---
+title: News
+layout: default
+header: News from the FOSSi Foundation
+---
+
+::ff-news-overview
+::