<nav id=“mainNav” class=“navbar position-fixed navbar-expand-lg sticky-top justify-content-between navbar-dark”>

<a class="navbar-brand" href="/">
  <img src="/assets/brand/logo.svg" width="30" height="30" class="d-inline-block align-top" alt="Mi logo">
  {{ site.title }}
</a>

<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
  <span class="navbar-toggler-icon"></span>
</button>

{% if page.path == "index.md" %}
<div class="collapse navbar-collapse" id ="navbarSupportedContent">
  <div class="navbar-nav">
    <a data-scroll class="nav-item nav-link active" href="#about">ABOUT</a>
    <a data-scroll class="nav-item nav-link" href="#portfolio">PORTFOLIO</a>
  </div>
</div>
{% else %}
<div class="collapse navbar-collapse" id ="navbarSupportedContent">
  <div class="navbar-nav">
    <a data-scroll class="nav-item nav-link active" href="/">HOME</a>
  </div>
</div>
{% endif %}

</nav>