fix featured cards

Author: Xeven777

src/components/FeaturedCarousel.tsx

@@ -10,7 +10,10 @@ import { ArrowRightIcon } from "lucide-react";
 import { Card, CardContent } from "@components/ui/card";
 import { Button } from "./ui/button";
 
-const PLACEHOLDER_IMAGES = ["/thumbnails/placeholder-1.png", "/thumbnails/placeholder-2.png"];
+const PLACEHOLDER_IMAGES = [
+  "/thumbnails/placeholder-1.png",
+  "/thumbnails/placeholder-2.png",
+];
 
 const FeaturedCarousel = ({ entries }: any) => {
   return (
@@ -26,9 +29,13 @@ const FeaturedCarousel = ({ entries }: any) => {
         {entries.map((entry: any) => {
           return (
             <CarouselItem key={entry.id} className="lg:basis-1/3 sm:basis-1/2">
-              <Card className="h-full hover:shadow-md group shadow transition-all duration-300 mb-1 overflow-hidden">
+              <Card className="h-full bg-gradient-to-r from-primary/5 to-primary/5 via-background border-primary/10 cursor-pointer hover:border-primary/30 hover:shadow-md group shadow transition-all duration-300 mb-1 overflow-hidden">
                 <img
-                  src={entry.data.Images && entry.data.Images.length > 0 ? entry.data.Images[0] : PLACEHOLDER_IMAGES[0]}
+                  src={
+                    entry.data.Images && entry.data.Images.length > 0
+                      ? entry.data.Images[0]
+                      : PLACEHOLDER_IMAGES[0]
+                  }
                   width={400}
                   height={500}
                   alt={entry.data.Name}

src/components/spotlight.astro

@@ -4,6 +4,12 @@ import FeaturedCarousel from "./FeaturedCarousel";
 import Container from "./container.astro";
 
 const softwareEntries = await getCollection("software");
+
+const featuredEntriestags = ["beeceptor", "keploy", "hatchfast"];
+
+const featuredEntries = softwareEntries.filter((entry) =>
+  featuredEntriestags.includes(entry.id)
+);
 ---
 
 <Container>
@@ -22,7 +28,7 @@ const softwareEntries = await getCollection("software");
           introduced innovative features in the development process.
         </p>
       </div>
-      <FeaturedCarousel entries={softwareEntries} client:visible />
+      <FeaturedCarousel entries={featuredEntries} client:visible />
     </div>
   </section>
 </Container>

src/layouts/Layout.astro

@@ -3,7 +3,6 @@ import { SEO } from "astro-seo";
 import "@styles/globals.css";
 import Footer from "@components/footer.astro";
 import Navbar from "@components/navbar/navbar.astro";
-import "@fontsource-variable/inter/index.css";
 import "@fontsource-variable/bricolage-grotesque";
 import { ViewTransitions } from "astro:transitions";