<script lang="ts">
    import threeBusses from "../assets/images/three_busses.jpg";
    import twoBusses from "../assets/images/two_busses.jpg";
    import fiveBusses from "../assets/images/five_busses.jpg";
    import singleRampLeftClosed from "../assets/images/single_ramp_left_closed.jpg";
    import threeRampsOpen from "../assets/images/three_ramps_open.jpg";
    import twoTourBuses from "../assets/images/two_tour_busses.jpg";
    import tourBusSide from "../assets/images/tour_bus_side.jpg";
    import tourBusSideLogo from "../assets/images/tour_bus_side_logo.jpg";
    import Carousel from "../lib/components/carousel/Carousel.svelte";

    let minibusCarouselItems: string[] = [threeBusses, twoBusses, fiveBusses, singleRampLeftClosed, threeRampsOpen];

    let tourBusCarouselItems: string[] = [twoTourBuses, tourBusSide, tourBusSideLogo];
</script>

<h1 class="text-xl font-semibold md:text-2xl">Buss</h1>

<section id="minibus" class="mt-4 justify-between gap-5 rounded-md bg-primary-300 p-4 shadow-inner md:flex">
    <div>
        <h2 class="grow text-lg font-semibold md:text-xl">Minibusser</h2>
        <p class="md:text-lg">
            Vi har idag fire minibusser, to Mercedes Sprinter og to Ford Transit. Vi har også en fullelektrisk Mercedes EQV og en Mitsubishi Outlander.
            <br />Vi finner løsninger for grupper fra 5 - 32 passasjerer med støtte for inntil 3 rullestolbrukere samtidig
        </p>
    </div>
    <div class="md:w-96">
        <Carousel items={minibusCarouselItems} buttonClass="bg-primary-200" let:item>
            <div class="w-96 overflow-hidden shadow-sm">
                <img class="card w-full object-cover" src={item} alt="" />
            </div>
        </Carousel>
    </div>
</section>

<section id="tour" class="mt-12 justify-between gap-5 rounded-md bg-primary-300 p-4 shadow-inner md:flex">
    <div>
        <h2 class="grow text-lg font-semibold md:text-xl">Turbusser</h2>
        <p class="md:text-lg">
            Vi er medeier i Storfjord Turbuss AS som har tre turbusser.
            <br />Storfjord Turbuss AS ble etablert i 2018, og vi utfører turkjøring og lager pakkeløsninger etter dine ønsker og behov.
            <br />Vår målsetning er å alltid være det naturlige førstevalget av transportør
        </p>
    </div>
    <div class="md:w-96">
        <Carousel items={tourBusCarouselItems} buttonClass="bg-primary-200" let:item>
            <div class="w-96 overflow-hidden shadow-sm">
                <img class="card w-full object-cover" src={item} alt="" />
            </div>
        </Carousel>
    </div>
</section>
