RSS feeds length and categories fixes (#1516)

Hi guys! Recently I've tried to follow NixOS'es news feed, but faced
some issues:

1. There was no publicly available link to the feed (found it [in the
issues](#1245)). Also
mentioned [in this
issue](#1195)
2. When I imported feed url to my reader, it was flooded by ~200 entries
from beginning of times (year 2004) unlike other feeds usually having
5-10 entries.

And since we're all foss-guys, I've decided to fix issues by myself:)

While fixing length of the rss-feed, I've discovered that [trying to
apply](https://github.com/NixOS/nixos-homepage/blob/main/src/pages/blog/%5Bid%5D-rss.xml.js#L20)
`filter` to `const` variable isn't a way to get some proper results.

And after making rss-feeds for different categories really differ, I've
added three new links on the Blog page under category blocks.


![image](https://github.com/user-attachments/assets/d1c08a70-8313-4fa9-a645-e85a81787c9b)

src/pages/blog.astro

@@ -65,7 +65,8 @@ const blogMenu = await getEntry("menus", "blog");
     >
       {
         blogMenu.data.map((e) => (
-          <div>
+	<div class="flex flex-row md:flex-col gap-4">
+          <div class="flex-1">
             <input
               name="category"
               type="checkbox"
@@ -96,7 +97,19 @@ const blogMenu = await getEntry("menus", "blog");
               <InlineSVG src={e.icon} class="w-12 md:w-24" />
               <span class="font-light">{e.title}</span>
             </label>
-          </div>
+	  </div>
+          <div class="md:hidden pt-6">
+            <label
+              class="
+            relative p-4 md:p-8 gap-2 w-full md:w-auto text-nix-blue border-1 fill-nix-blue hover:fill-white border-nix-blue rounded-2xl flex md:flex-col items-center hover:bg-nix-blue-darker hover:text-white cursor-pointer peer-checked:bg-nix-blue peer-checked:text-white peer-checked:fill-white hover:peer-checked:border-nix-blue-darker hover:peer-checked:bg-nix-blue-darker peer-focus:ring-2 peer-focus:ring-black peer-focus:ring-offset-2"
+            >
+	    <a href={"/blog/" + e.id + "-rss.xml"}><InlineSVG src="/src/assets/image/blog-menu/rss.svg" class="inline-block w-12 h-12" /></a>
+            </label>
+	  </div>
+	  <div class="hidden md:flex flex-row rss-small" style="justify-content: center">
+	    <a href={"/blog/" + e.id + "-rss.xml"}><InlineSVG src="/src/assets/image/blog-menu/rss.svg" class="inline-block w-4 h-4" />rss</a>
+	  </div>
+	</div>
         ))
       }
     </div>

src/pages/blog/[id]-rss.xml.js

@@ -17,7 +17,8 @@ export async function GET(context) {
   const blog = await getCollection("blog");
   const title =
     context.params.id.charAt(0).toUpperCase() + context.params.id.slice(1);
-  blog
+  const numOfPosts = 10;
+  const posts = blog
     .sort((a, b) => {
       const dateA = new Date(a.data.date);
       const dateB = new Date(b.data.date);
@@ -30,7 +31,7 @@ export async function GET(context) {
     title: `NixOS ${title}`,
     site: `${context.site}/blog`,
     description: `${title} on NixOS, the purely functional Linux distribution.`,
-    items: blog.map((post) => ({
+    items: posts.slice(0,numOfPosts).map((post) => ({
       title: post.data.title ?? "Untitled",
       pubDate: post.data.date ?? new Date().toISOString(),
       content: sanitizeHtml(parser.render(post.body)),