nav.html

<nav class="navbar navbar-expand-lg navbar-light bg-color">

    <a class="navbar-brand navbar-brand-centered" href="/index.html"><img src="/images/logo3.jpg" alt="joshpatel.ca"
            class="logo2"></a>
    <ul class="navbar-nav ml-auto">
        <li class="nav-item active">
            <a class="nav-link" href="/index.html">Projects<span class="sr-only">(current)</span></a>
        </li>
        <!-- <li class="nav-item">
            <a class="nav-link" href="/vfx.html">VFX</a>
        </li> -->
        <li class="nav-item">
            <a class="nav-link" href="/about.html">About</a>
        </li>
        <!-- <li class="nav-item">
            <a class="nav-link" href="#bottom">Contact</a>
        </li> -->
        <!--
        <li class="nav-item">
            <a class="nav-link fab fa-lg fa-imdb" href="https://www.imdb.com/name/nm2583117/"></a>
        </li>
        -->
        <li class="nav-item">
            <a class="nav-link fab fa-lg fa-linkedin" href="https://www.linkedin.com/in/joshilpatel/"></a>
        </li>
        <li class="nav-item">
            <a class="nav-link fab fa-lg fa-github" href="https://github.com/joshilp"></a>
        </li>
    </ul>


    <script>
        $(document).ready(function () {
            $('li.active').removeClass('active');
            $('a[href="' + location.pathname + '"]').closest('li').addClass('active');
        });
    </script>


</nav>

<hr class="nav-hr">