From 7fafa5c4cf0d708dd750a46f207ac13c92cba0f3 Mon Sep 17 00:00:00 2001
From: Alex Lebens <alexanderlebens@gmail.com>
Date: Sun, 8 Feb 2026 17:15:43 -0600
Subject: [PATCH] feat: update features

---
 src/components/ui/cards/FeaturesCard.astro       |  3 ++-
 src/components/ui/sections/FeaturesSection.astro | 10 ++++++++--
 2 files changed, 10 insertions(+), 3 deletions(-)

diff --git a/src/components/ui/cards/FeaturesCard.astro b/src/components/ui/cards/FeaturesCard.astro
index 76c5c6d..a7ee143 100644
--- a/src/components/ui/cards/FeaturesCard.astro
+++ b/src/components/ui/cards/FeaturesCard.astro
@@ -15,11 +15,12 @@ const borderClasses = 'border border-neutral-100 dark:border-stone-500/20';
 const bgColorClasses =
   'bg-neutral-100/80 hover:bg-neutral-100 dark:bg-neutral-800/60 dark:hover:bg-neutral-800/90';
 const shadowClasses = 'shadow-xs hover:shadow-md dark:shadow-md dark:hover:shadow-lg';
+const sizeClasses = 'h-30 w-100 md:w-[300px]';
 ---
 
 <div class={`${baseClasses}`}>
   <a
-    class={`rounded-xl duration-300 transition-all h-30 ${borderClasses} ${bgColorClasses} ${shadowClasses}`}
+    class={`rounded-xl duration-300 transition-all ${sizeClasses} ${borderClasses} ${bgColorClasses} ${shadowClasses}`}
     href={url}
     data-astro-prefetch
   >
diff --git a/src/components/ui/sections/FeaturesSection.astro b/src/components/ui/sections/FeaturesSection.astro
index d9421c8..9f1f6a1 100644
--- a/src/components/ui/sections/FeaturesSection.astro
+++ b/src/components/ui/sections/FeaturesSection.astro
@@ -7,12 +7,12 @@ import FeaturesCard from '@components/ui/cards/FeaturesCard.astro';
 const global = await directus.request(readSingleton('site_global'));
 ---
 
-<section class="mx-auto mb-20 max-w-[85rem] px-4 py-10 sm:px-6 lg:px-8 lg:py-14 2xl:max-w-full">
+<section class="mx-auto mb-20 max-w-340 px-4 py-10 sm:px-6 lg:px-8 lg:py-14 2xl:max-w-full">
   <div
     class="flex flex-col items-center justify-center gap-y-2 sm:flex-row sm:gap-x-12 sm:gap-y-0 lg:gap-x-24"
   >
     <div class="mx-auto max-w-5xl px-4 sm:px-6 lg:px-8">
-      <div class="grid gap-3 sm:grid-cols-2 sm:gap-6 lg:grid-cols-3">
+      <div class="flex flex-wrap gap-6 sm:grid-cols-2 sm:gap-6 lg:grid-cols-3 justify-center">
         <FeaturesCard
           title="Cloud Engineer"
           description="Full stack and cloud engineer."
@@ -25,6 +25,12 @@ const global = await directus.request(readSingleton('site_global'));
           url="/categories/homelab/"
           icon="mdi:home-variant-outline"
         />
+        <FeaturesCard
+          title="Documentation"
+          description="Reference and guides for my homelab."
+          url="https://docs.alexlebens.dev"
+          icon="mdi:file-document-multiple"
+        />
         <FeaturesCard
           title="Email"
           description={`Send me a message.`}