Polestar/src/MobileNavigation.astro

<div class="mobile-navigation">
    <slot name="items"/>
</div>

<style lang="scss" is:global>
    .mobile-navigation {
        position: fixed;
        bottom: 0px;
        left: 0px;
        width: 100%;
        color: white;
        backdrop-filter: blur(24px) brightness(0.2) contrast(0.8);
        padding: 0px;
        z-index: 5;
        display: grid;
        grid-template-columns: auto auto auto auto;
        justify-items: stretch;
        align-items: baseline;
        justify-content: space-evenly;
        a {
            color: white;
            text-decoration: none;
            display: flex;
            flex-direction: column;
            align-items: center;
            gap: 12px;
            padding: 24px 0px;
        }
    }
</style>