---
import HobbyLayout from "@layouts/HobbyLayout.astro";
import Carousel from "@components/CustomCarousel/CustomCarousel.astro";

import type {carouselGroup} from "@interfaces/image-carousel.ts";

import rack_from_above from "@assets/hobby/homelab/home-server-rack/rack-from-above.jpg";
import rack_from_below from "@assets/hobby/homelab/home-server-rack/rack-from-below.jpg";
import rack_middle from "@assets/hobby/homelab/home-server-rack/rack-middle.jpg";
import rack_top from "@assets/hobby/homelab/home-server-rack/rack-top.jpg";



const headerCarouselGroup: carouselGroup = {
    animation: "slide",
    images: [
        rack_from_below,
        rack_from_above,
        rack_top,
        rack_middle
    ]
}
---

<HobbyLayout title="Home Server Rack">
    <Carousel carouselGroup={headerCarouselGroup}/>

    <!--<h2 class="font-bold md:text-2xl my-4">Prior Homelab</h2>-->
</HobbyLayout>