<script>
    import '../../app.css'
    let { logo = false } = $props()
</script>

{#if logo}
    <div class="flex items-center">
        <span style="font-size:25pt"
            ><span class="co"
                ><span class="g">G</span><span class="ra">RA</span>IN</span
            ></span
        ><img src="/grain/coturnix.svg" alt="Logo de Grain" />
    </div>
{:else}
    <span style="font-size:1.1em">
        <span class="co"
            ><span class="g">G</span><span class="ra">RA</span>IN</span
        ></span>
{/if}

<style>
    .co {
        color: #b81413;
    }
    .g {
        color: #de601e;
    }
    .ra {
        color: #d71c19;
    }
    img {
        margin-left: 8px;
        width: 40px;
        height: 40px;
    }
</style>
