No notes defined.
<header class="relative" x-data="{ open: false }">
<div class="pt-6">
<nav class="relative max-w-7xl mx-auto flex items-center justify-between px-4 sm:px-6" aria-label="Global">
<div class="flex items-center flex-1">
<div class="flex items-center justify-between w-full md:w-auto">
<a href="">
<span class="sr-only">Workflow</span>
<img src="/dist/images/webmarks_horizontal_white_small.png" srcset="/dist/images/webmarks_horizontal_white_small.png 1x, /dist/images/[email protected] 2x" alt="Webmarks Design & Marketing" class="w-56">
</a>
</div>
</div>
<div class="hidden sm:flex sm:items-center sm:space-x-4">
<span x-on:click="openModal = true">
<button class="inline-flex items-center justify-center px-5 py-2 text-base font-medium rounded-md text-white bg-gradient-to-r from-red-500 to-orange-500 hover:bg-gradient-to-l hover:from-blue-500 hover:to-green-600 transition" onclick="plausible('Schedule a call', {props: {page: '', location: 'header', lang: ''}})">
Let's chat
</button>
</span>
</div>
<div class="pl-4 -mr-2 flex items-center">
<button type="button" class="bg-gray-800 rounded-md p-2 inline-flex items-center justify-center text-gray-300 hover:text-gray-200 hover:bg-gray-900 focus:outline-none focus:ring-2 focus-ring-inset focus:ring-white" aria-expanded="false" x-on:click="open = true">
<span class="sr-only">Open main menu</span>
<!-- Heroicon name: outline/menu -->
<svg class="h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" aria-hidden="true">
<path stroke-linecap="round" stroke-linejoin="round" d="M4 6h16M4 12h16M4 18h16" />
</svg>
</button>
</div>
</nav>
</div>
<div x-dialog x-model="open" style="display: none" class="fixed inset-0 z-10 overflow-hidden">
<!-- Slideover -->
<!-- Overlay -->
<div x-dialog:overlay x-transition.opacity class="fixed inset-0 bg-black bg-opacity-50"></div>
<!-- Panel -->
<div class="fixed inset-y-0 right-0 w-full max-w-xs">
<div x-dialog:panel x-transition:enter="transition ease-out duration-300" x-transition:enter-start="translate-x-full" x-transition:enter-end="translate-x-0" x-transition:leave="transition ease-in duration-300" x-transition:leave-start="translate-x-0" x-transition:leave-end="translate-x-full" class="h-full w-full">
<div class="flex h-full flex-col justify-between overflow-y-auto bg-gradient-to-b from-gray-800 to-gray-900 shadow-lg">
<!-- Close Button -->
<div class="absolute top-0 right-0 pt-4 pr-4">
<button type="button" @click="$dialog.close()" class="p-2 inline-flex items-center justify-center text-gray-400 hover:bg-gray-100 focus:outline-none focus:ring-2 focus:ring-inset focus:ring-gray-600">
<span class="sr-only">Close menu</span>
<!-- Heroicon name: outline/x -->
<svg class="h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" aria-hidden="true">
<path stroke-linecap="round" stroke-linejoin="round" d="M6 18L18 6M6 6l12 12" />
</svg>
</button>
</div>
<!-- Body -->
<div class="p-8">
<div class="pt-12 space-y-2">
<a class="block px-4 py-2 rounded-md text-lg font-medium text-gray-100 hover:bg-gray-700" href="">
Our Work
</a>
<a class="block px-4 py-2 rounded-md text-lg font-medium text-gray-100 hover:bg-gray-700" href="">
Our Process
</a>
<a class="block px-4 py-2 rounded-md text-lg font-medium text-gray-100 hover:bg-gray-700" href="">
About
</a>
<a class="block px-4 py-2 rounded-md text-lg font-medium text-gray-100 hover:bg-gray-700" href="">
Contact
</a>
</div>
<div class="mt-8 flex flex-col justify-center">
<div class="inline-flex">
<span x-on:click="openModal = true">
<button class="inline-flex items-center justify-center px-5 py-3 text-base font-medium rounded-md text-white bg-gradient-to-r from-red-500 to-orange-500 hover:bg-gradient-to-l hover:from-blue-500 hover:to-green-600 transition" onclick="plausible('Schedule a call', {props: {page: '', location: 'navigation', lang: ''}})">
Schedule a call
</button>
</span>
</div>
</div>
<div class="mt-12 mb-2 border border-gray-700"></div>
<div class="py-2">
<a href="" class="group flex items-center px-3 py-2 rounded-md text-base font-medium text-gray-300 hover:bg-gray-700">
<div class="rounded-full bg-gray-300 h-2 w-2"></div>
<div class="ml-3">
English
</div>
</a>
<a href="" class="group flex items-center px-3 py-2 rounded-md text-base font-medium text-gray-300 hover:bg-gray-700">
<div class="rounded-full bg-transparent h-2 w-2 group-hover:bg-gray-100 transition"></div>
<div class="ml-3">
Français
</div>
</a>
</div>
</div>
<div class="mb-12 px-2 py-4">
<p class="text-center text-gray-300 text-lg italic font-serif">
<a href="/fr/">
Nous parlons français!
</a>
</p>
</div>
</div>
</div>
</div>
</header>
<header class="relative" x-data="{ open: false }">
<div class="pt-6">
<nav class="relative max-w-7xl mx-auto flex items-center justify-between px-4 sm:px-6"
aria-label="Global">
<div class="flex items-center flex-1">
<div class="flex items-center justify-between w-full md:w-auto">
<a href="{{ siteUrl }}">
<span class="sr-only">Workflow</span>
<img src="/dist/images/webmarks_horizontal_white_small.png"
srcset="/dist/images/webmarks_horizontal_white_small.png 1x, /dist/images/[email protected] 2x"
alt="Webmarks Design & Marketing" class="w-56">
</a>
</div>
</div>
<div class="hidden sm:flex sm:items-center sm:space-x-4">
<span x-on:click="openModal = true">
<button
class="inline-flex items-center justify-center px-5 py-2 text-base font-medium rounded-md text-white bg-gradient-to-r from-red-500 to-orange-500 hover:bg-gradient-to-l hover:from-blue-500 hover:to-green-600 transition"
onclick="plausible('Schedule a call', {props: {page: '{{ entry.title }}', location: 'header', lang: '{{ lang }}'}})"
>
Let's chat
</button>
</span>
</div>
<div class="pl-4 -mr-2 flex items-center">
<button type="button"
class="bg-gray-800 rounded-md p-2 inline-flex items-center justify-center text-gray-300 hover:text-gray-200 hover:bg-gray-900 focus:outline-none focus:ring-2 focus-ring-inset focus:ring-white"
aria-expanded="false"
x-on:click="open = true"
>
<span class="sr-only">Open main menu</span>
<!-- Heroicon name: outline/menu -->
<svg class="h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none"
viewBox="0 0 24 24" stroke-width="2" stroke="currentColor"
aria-hidden="true">
<path stroke-linecap="round" stroke-linejoin="round"
d="M4 6h16M4 12h16M4 18h16"/>
</svg>
</button>
</div>
</nav>
</div>
<div
x-dialog
x-model="open"
style="display: none"
class="fixed inset-0 z-10 overflow-hidden"
>
{{> @webmarks-nav-mobile }}
</div>
</header>
/* No context defined. */