<nav class="main-header navbar navbar-expand my-navbar">
  <!-- Example: Only “Sign In” link on the right -->
  <ul class="navbar-nav ml-auto">
    <li class="nav-item">
      <a class="nav-link" href="/login">
        <i class="fa fa-sign-in-alt mr-2"></i> Sign In
      </a>
    </li>
  </ul>
</nav>

<aside class="main-sidebar my-sidebar elevation-4">
  <!-- Sidebar toggler -->
  <div class="sidebar-hamburger mt-2 ml-2">
    <a class="nav-link" href="#" role="button">
      <i class="fas fa-bars"></i>
    </a>
  </div>
  
  <div class="sidebar">
    <!-- Minimal or empty sidebar -->
  </div>
</aside>

<script>
  // Optional: Script to collapse the sidebar
  document.addEventListener('DOMContentLoaded', function() {
    document.querySelector('.sidebar-hamburger a.nav-link')
      .addEventListener('click', function(e) {
        e.preventDefault();
        document.querySelector('aside.main-sidebar')
          .classList.toggle('collapsed');
    });
  });
</script>
