header.html

<div class="flex bg-white border-b border-gray-200 fixed top-0 inset-x-0 z-100 h-16 items-center">
  <div class="w-full max-w-screen-xl relative mx-auto px-6">
    <div class="flex items-center -mx-6">
      <div class="lg:w-1/4 xl:w-1/4 pl-6 pr-6 lg:pr-8">
        <div class="float-right flex items-center">
          <a href="/" class=" absolute block lg:mr-4">
            <img class="h-8 w-auto md:block" src="../assets/img/logo/resources-logo.png"></img>
          </a>
        </div>
      </div>
      <div class="flex flex-grow lg:w-full xl:w-full">
        <div class="text-right w-full lg:px-6 xl:w-3/4 xl:px-12">
          <div class="float-right lg:flex  xl:w-1/4 px-6">
            <div class="inline-flex ml-3 ">
              <a href="https://github.com/dntandan/webresources" class="flex items-center px-1 py-1 hover:bg-blue-100 hover:rounded-corner font-medium text-gray-900">
                <ion-icon name="logo-github" class="text-2xl text-gray-900"></ion-icon>
              </a>
              <a href="https://facebook.com/dntandan" class="flex items-center px-1 mx-1 py-1 hover:bg-blue-100 hover:rounded-corner font-medium text-gray-900">
                <ion-icon name="logo-facebook" class="text-2xl text-blue-600"></ion-icon>
              </a>
              <a href="https://twitter.com/dntandan" class=" flex items-center px-1 mx-1 py-1 hover:bg-blue-100 hover:rounded-corner font-medium text-gray-900">
                <ion-icon name="logo-twitter" class="text-2xl text-blue-500"></ion-icon>
              </a>
              <a href="https://linkedin.com/in/dntandan" class="flex items-center px-1 mx-1 py-1 hover:bg-blue-100 hover:rounded-corner font-medium text-gray-900">
                <ion-icon name="logo-linkedin" class="text-2xl text-blue-700"></ion-icon>
              </a>
            </div>
          </div>
        </div>
        <button type="button" id="sidebar-open" class="flex px-6 items-center lg:hidden text-gray-500 focus:outline-none focus:text-gray-700">
          <svg class="fill-current w-4 h-4" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20">
            <path d="M0 3h20v2H0V3zm0 6h20v2H0V9zm0 6h20v2H0v-2z" /></svg>
        </button>
        <button type="button" id="sidebar-close" class="hidden flex px-6 items-center lg:hidden text-gray-500 focus:outline-none focus:text-gray-700">
          <svg class="fill-current w-4 h-4" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20">
            <path d="M10 8.586L2.929 1.515 1.515 2.929 8.586 10l-7.071 7.071 1.414 1.414L10 11.414l7.071 7.071 1.414-1.414L11.414 10l7.071-7.071-1.414-1.414L10 8.586z" />
          </svg>
        </button>
      </div>
    </div>
  </div>
</div>