vendure/docs/layouts/partials/top-bar.html

<div
    class="z-30 transition-colors top-0"
    :class="{ 'bg-transparent bg-none absolute w-full': isLandingPage, 'bg-white border-b border-dotted border-blue-200': !isLandingPage }"
    x-data="{ ...Components.popover(false), isLandingPage: {{ default false .isLandingPage }} }"
>
    <div
        :class="{ 'hidden': isLandingPage }"
        class="absolute w-full h-1 bg-gradient-to-r from-blue-300 via-green-300 to-blue-100"
    ></div>
    {{ partial "announcement-banner" (dict "content" ` 🚨 Announcing
    <a href="https://vendure.io/" class="text-white font-medium underline"
        >Announcing Vendure v2<span aria-hidden="true">&rarr;</span></a
    >
    `) }}
    <div class="max-w-screen-2xl mx-auto px-4 py-4 sm:px-6 md:pr-10">
        <div class="flex justify-between items-center md:space-x-10">
            <div class="flex justify-start lg:w-0 lg:flex-1">
                <a class="logo flex space-x-4 items-center" href="https://vendure.io" title="back to landing page">
                    <div>
                        <img class="w-10" src="/logo.png" alt="Vendure logo" />
                    </div>
                    <div>
                        <div class="font-wordmark font-bold text-blue-500 text-3xl mt-0">vendure</div>
                        <div class="text-gray-500">documentation</div>
                    </div>
                </a>
            </div>
            <div class="flex items-center space-x-4">
                <a href="https://vendure.io/community" target="_blank" title="Join our Discord community!">
                    <img src="/logo/discord-logo.png" class="w-6 h-6" alt="Discord logo" />
                </a>
                <a href="https://github.com/vendure-ecommerce/vendure" class="">
                    <img
                        class=""
                        alt="GitHub star counter"
                        src="https://img.shields.io/github/stars/vendure-ecommerce/vendure.svg?style=social"
                    />
                </a>
            </div>
        </div>
    </div>
</div>