jacobshenning · July 26, 2020 02:04 · Jul 26, 2020
diff --git a/my_header_snippet.php b/my_header_snippet.php
@@ -0,0 +1,37 @@
+<!-- header -->
+			<header id="header" class="relative bg-white" role="banner">
+
+                <!-- header container -->
+                <ul :class="{ 'h-20': !open, 'h-60': open }" class="w-full flex items-center flex-col lg:flex-row py-3 text-gray-900 lg:px-0 px-3 lg:h-auto overflow-hidden duration-300 relative float-center">
+
+                    <li class="block lg:w-1/5 lg:pt-4 text-center order-2 lg:order-1 flex-shrink-0">
+                        <a href="/" class="text-xl font-medium py-1 block">Blog</a>
+                    </li>
+                    <li class="block lg:w-1/5 lg:pt-4 text-center order-3 lg:order-2 flex-shrink-0">
+                        <a href="/" class="text-xl font-medium py-1 block">Projects</a>
+                    </li>
+
+                    <!-- brand -->
+                    <li class="logo py-3 w-full flex items-center justify-between lg:justify-center lg:w-1/5 order-1 lg:order-3 flex-shrink-0">
+                        <a class="font-black text-xl text-gray-900 hover:opacity-75 flex items-center lg:flex-col" href="<?php echo home_url(); ?>">
+                            <svg class="h-10 fill-current mr-3 text-indigo-600" viewBox="0 0 84 84" xmlns="http://www.w3.org/2000/svg" fill-rule="evenodd" clip-rule="evenodd" stroke-linejoin="round" stroke-miterlimit="2"><path d="M66.667 8.333h16.666v62.5c0 6.858-5.642 12.5-12.5 12.5H12.5c-6.857 0-12.5-5.642-12.5-12.5V0h66.667v8.333zm0 8.334v54.166c0 2.286 1.881 4.167 4.166 4.167C73.119 75 75 73.119 75 70.833V16.667h-8.333zM8.333 8.333v62.5C8.333 73.119 10.214 75 12.5 75h46.542a12.425 12.425 0 01-.709-4.167v-62.5h-50zm8.334 33.334H50V50H16.667v-8.333zm0 16.666H50v8.334H16.667v-8.334zm0-41.666H50v16.666H16.667V16.667z" fill-rule="nonzero"/></svg>
+                            <span class="lg:pt-1">JSHCoder</span>
+                        </a>
+                        <a class="cursor-pointer block lg:hidden" @click="toggleMenu()">
+                            <svg class="h-8" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path class="heroicon-ui" d="M4 5h16a1 1 0 0 1 0 2H4a1 1 0 1 1 0-2zm0 6h16a1 1 0 0 1 0 2H4a1 1 0 0 1 0-2zm0 6h16a1 1 0 0 1 0 2H4a1 1 0 0 1 0-2z"/></svg>
+                        </a>
+                    </li>
+                    <!-- /logo -->
+
+                    <li class="block lg:w-1/5 lg:pt-4 text-center order-4 lg:order-4 flex-shrink-0">
+                        <a href="/" class="text-xl font-medium py-1 block">Portfolio</a>
+                    </li>
+                    <li class="block lg:w-1/5 lg:pt-4 text-center order-5 lg:order-5 flex-shrink-0">
+                        <a href="/" class="text-xl font-medium py-1 block">About</a>
+                    </li>
+
+                </ul>
+
+
+			</header>
+			<!-- /header -->