campfire/src/lib/ui/core/PageHeader.svelte

<script>
    export let title;
</script>

<header>
    <h1>{title}</h1>
    <div class="header-items">
        <slot/>
    </div>
</header>

<style>
    header {
        width: 100%;
        height: 64px;
        margin: 16px 0;
        padding: 0 8px;
        display: flex;
        flex-direction: row;
        user-select: none;
        box-sizing: border-box;

    }

    header h1 {
        font-size: 1.5em;
    }

    header .header-items {
        margin-left: auto;
        display: flex;
        flex-direction: row;
        align-items: center;
        gap: 8px;
    }
</style>