ariadigitalmachines/assets/js/navbar.js

const html = `<div
    class="header-container container-fluid container-xl position-relative d-flex align-items-center justify-content-between">

    <a href="index.html" class="logo d-flex align-items-center me-auto me-xl-0">
        <!-- Uncomment the line below if you also wish to use an image logo -->
        <img src="assets/img/logo.png" alt="">
        <!--<h1 class="sitename text-primary">ADM</h1> -->
    </a>

    <nav id="navmenu" class="navmenu">
        <ul>
            <li><a href="/" class="active">Home</a></li>
            <li><a href="about.html">About</a></li>
            <li class="dropdown"><a href="#"><span>Products</span> <i
                        class="bi bi-chevron-down toggle-dropdown"></i></a>
                <ul>
                    <li><a href="zeno-aio-landing.html">Laptops</a></li>
                    <li><a href="zeno-aio-landing.html">All In One's</a></li>
                    <li><a href="#">Servers</a></li>
                    <li><a href="#">AI NVR (Coming Soon)</a></li>
                    <li><a href="#">Racks</a></li>
                </ul>
            </li>
            <li class="dropdown mega-menu"><a href="#"><span>Solutions</span> <i
                        class="bi bi-chevron-down toggle-dropdown"></i></a>
                <ul>
                    <li>
                        <span class="text-primary ps-2">Supply Chain Solutions</span>
                        <div>
                            <div><a href="dealer-automation.html">Dealer Automation</a></div>
                            <div><a href="secondary-sales.html">Secodary Sales </a></div>
                            <div><a href="e-governance.html">E-Governance </a></div>
                            <div><a href="loyalty-solutions.html">Loyalty Solutions</a></div>
                            <div><a href="block-chain-enabled.html">Block Chain Enabled</a></div>
                            <div><a href="track-and-trace.html">Track and Trace </a></div>
                        </div>
                    </li>
                    <li>
                        <span class="text-primary ps-2">Process Automation</span>
                        <div>
                            <div><a href="enterprises.html">Enterprises</a></div>
                            <div><a href="govermnets.html">Governments</a></div>
                            <div><a href="small-businesses.html">Small Businesses</a></div>
                        </div>
                    </li>
                    <li><span class="text-primary ps-2">VMS</span>
                        <div>
                            <div><a href="integrated-video-solutions.html">Integrated Video Solutions</a></div>
                            <div><a href="video-storage-solutions.html">Video Storage Solutions</a></div>
                            <div><a href="central-command-center.html">Central Command Center</a></div>
                            <div><a href="event-streaming.html">Event Streaming</a></div>
                        </div>
                    </li>
                </ul>
            </li>
            <li class="dropdown mega-menu"><a href="#"><span>Services</span> <i
                        class="bi bi-chevron-down toggle-dropdown"></i></a>
                <ul>
                    <li>
                        <div>
                            <div><a href="iot-technology.html">IoT Technologies</a></div>
                            <div><a href="video-analytics.html">Video Analytics</a></div>
                            <div><a href="rf-technology.html">RF Technology </a></div>
                        </div>
                    </li>
                    <li>
                        <div>
                            <div><a href="rooftop-solar.html">Rooftop Solar/Solar Pump</a></div>
                            <div><a href="software-development.html">Software Development</a></div>
                            <div><a href="home-automation.html">Home Automation</a></div>
                        </div>
                    </li>
                    <li>
                        <div>
                            <div><a href="it-telecommunications.html">IT & Telecommunication</a></div>
                            <div><a href="smart-cities.html">Smart Cities</a></div>
                            <div><a href="smart-communication.html">Smart Communication</a></div>
                        </div>
                    </li>
                </ul>
            </li>
                <li><a href="#">Investors</a></li>
                <li><a href="#">Contact</a></li>
        </ul>
        <i class="mobile-nav-toggle d-xl-none bi bi-list"></i>
    </nav>

    <a class="btn-getstarted d-none" href="#">Get Started</a>

</div>`;
    document.getElementById('header').innerHTML = html;