136 lines
5.4 KiB
PHP
136 lines
5.4 KiB
PHP
<?php
|
|
|
|
/**
|
|
* Header Navigation template.
|
|
*
|
|
* @package ThemeStarter
|
|
*/
|
|
|
|
require_once(get_theme_file_path('/includes/helper_functions.php'));
|
|
|
|
?>
|
|
|
|
<!-- <header class="mb-32 lg:mb-44 shadow-lg"> -->
|
|
<header class="shadow-lg">
|
|
|
|
|
|
<!-- Header -->
|
|
<nav id="header-nav" class="w-full top-0 z-50">
|
|
|
|
|
|
<section class="relative">
|
|
<?php get_search_form(); ?>
|
|
|
|
<!-- Top Banner -->
|
|
<div id="top-banner" class="bg-stone-800 px-4 open">
|
|
<div class="max-w-7xl mx-auto py-4">
|
|
<ul class="flex justify-between items-center text-white align-middle content-center">
|
|
<li>
|
|
<a href="https://maps.app.goo.gl/BoaahZWWMvaWoGsx5" class="flex space-x-4">
|
|
<i class="bi-geo-alt-fill"></i>
|
|
<p class="hidden lg:block">
|
|
55 Village Centre Place, Suite 200, Mississauga, ON L4Z 1V9
|
|
</p>
|
|
</a>
|
|
</li>
|
|
<li class="relative">
|
|
<button id="hours-dropdown-toggle" class="flex space-x-4" aria-label="Hours Dropdown">
|
|
<i class="bi-clock-fill"></i>
|
|
<p id="todays-business-hours" class="hidden lg:block font-medium">Business Hours</p>
|
|
<i class="bi-caret-down-fill hours-dropdown-icon"></i>
|
|
</button>
|
|
<div id="hours-dropdown-menu" class="hidden top-full right-0 text-black absolute z-50 mt-2 w-56 rounded-md shadow-lg bg-white ring-1 ring-black ring-opacity-5">
|
|
<div class="py-1" role="menu" aria-orientation="vertical" aria-labelledby="hours-dropdown-toggle">
|
|
<div class="px-4 py-2 text-sm" role="none">
|
|
<p class="font-bold text-xl">Hours</p>
|
|
<p class="mt-1">
|
|
<span class="font-bold">Mon - Fri:</span> 9:00 am - 5:00 pm
|
|
</p>
|
|
<p class="mt-1">
|
|
<span class="font-bold">Weekends:</span> <span class="text-red-500">Closed</span>
|
|
</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</li>
|
|
</ul>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Core Nav -->
|
|
<div class="relative p-4 bg-white backdrop-blur-lg w-full shadow-md">
|
|
|
|
<div class="relative z-50 flex justify-between max-w-7xl mx-auto">
|
|
<!-- Header Logo -->
|
|
<a class="relative z-50 flex items-center space-x-4" href="<?php echo get_site_url(); ?>">
|
|
<img class="lg:hidden" width="35px" src="<?php echo get_template_directory_uri(); ?>/assets/images/logos/harplabs-icon.svg" alt="Harplabs Inc Icon" />
|
|
<img class="hidden lg:block" width="200px" src="<?php echo get_template_directory_uri(); ?>/assets/images/logos/harplabs-logo-dark.png" alt="Harplabs Inc Dark Logo" />
|
|
</a>
|
|
|
|
<!-- Header Buttons -->
|
|
<div class="flex space-x-8 items-center">
|
|
<a href="https://calendly.com/harplabs/discovery"><i class="md:hidden bi bi-calendar2-plus text-2xl"></i></a>
|
|
<a href="<?= get_permalink('4828') ?>"><i class="md:hidden bi bi-tags text-2xl"></i></a>
|
|
<div class="hidden md:block items-center justify-center"><?php get_template_part('template-parts/partials/book-a-meeting-button'); ?></div>
|
|
<div class="hidden md:block">
|
|
<?php get_template_part('template-parts/partials/get-a-quote-button'); ?>
|
|
</div>
|
|
<div class="flex relative">
|
|
<button aria-label="Search Toggle" id="toggle-search">
|
|
<i class="bi bi-search"></i>
|
|
</button>
|
|
</div>
|
|
<div class="flex relative">
|
|
<button aria-label="Mobile Menu Toggle" id="toggle-nav" class="toggle-menu">
|
|
<i></i> <i></i>
|
|
</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Agency Menu -->
|
|
<div class="hidden lg:block bg-stone-100 px-4 shadow-lg border-b-2 border-yellow-300">
|
|
<div class="max-w-7xl mx-auto">
|
|
|
|
<?php $args = [
|
|
'menu' => "Agency Menu",
|
|
'menu_class' => "w-full flex items-center justify-between px-4",
|
|
'container_class' => "flex justify-between items-center text-xl text-stone-800 align-middle content-center",
|
|
];
|
|
wp_nav_menu($args); ?>
|
|
|
|
</div>
|
|
</div>
|
|
|
|
</section>
|
|
</nav>
|
|
<div id="header-padder"></div>
|
|
<!-- Slide Out Section -->
|
|
<section id="slide-out-menu" class="fixed z-50 top-0 bg-gray-200 bg-opacity-80 backdrop-blur-sm w-10/12 sm:w-3/5 lg:w-2/5 xl:w-4/12 2xl:w-3/12 h-full px-2">
|
|
<nav class="h-full space-y-8 overflow-x-hidden overflow-y-scroll no-scrollbar pt-12 pb-28">
|
|
|
|
<!-- Menu Section -->
|
|
<div>
|
|
|
|
<div class="mb-2">
|
|
<a href="<?= esc_url(get_home_url()); ?>" class="flex items-center justify-center space-x-4 ">
|
|
<img class="w-2/5" src="<?php echo get_template_directory_uri(); ?>/assets/images/logos/harplabs-logo-dark.png" alt="Harplabs Inc Full Logo" />
|
|
</a>
|
|
</div>
|
|
|
|
<div class="mx-auto mb-4 w-11/12 h-1 border-t border-stone-400"></div>
|
|
|
|
<?php get_template_part('template-parts/partials/menu-accordion-loop')
|
|
?>
|
|
|
|
</div>
|
|
|
|
<div class="mt-10 space-y-2 md:flex md:space-x-2 md:space-y-0 px-4">
|
|
<?php get_template_part('template-parts/partials/book-a-meeting-button') ?>
|
|
<?php get_template_part('template-parts/partials/get-a-quote-button') ?>
|
|
</div>
|
|
</nav>
|
|
</section>
|
|
|
|
</header>
|