<script lang="ts">
    import ItemBox from "$lib/components/itemBox.svelte";

    const homeLinks: string[] = [
    "nextcloud",
    "gitea"
]
</script>

<header>FJLA Gateway</header>

<div id="boxContainer">
    {#each homeLinks as detail}
        <ItemBox {detail} />
    {/each}
</div>

<style>
    header {
        margin: auto;
        color: white;
        font-family: MuseoModerno, 'Lucida Sans', 'Lucida Sans Regular', 'Lucida Grande', 'Lucida Sans Unicode', Geneva, Verdana, sans-serif;
        font-size: 6vw;
        text-align: center;
        padding-top: 20px;
        padding-bottom: 20px;
    }

    #boxContainer {
        display: flex;
        flex-wrap: wrap;
        justify-content: center;
    }
</style>