app.component.html

<div class="container is-fluid">
  <nav class="navbar" role="navigation" aria-label="main navigation">
    <div class="navbar-brand">
      <img routerLink="/" src="assets/covex_logo.png" class="menu-icon is-hoverable navbar-item" alt="logo" width="200"/>
      <a role="button" class="navbar-burger burger" aria-label="menu" aria-expanded="false">
        <span aria-hidden="true"></span>
        <span aria-hidden="true"></span>
        <span aria-hidden="true"></span>
      </a>
    </div>

    <div class="navbar-menu">
      <div class="navbar-start">
        <a routerLink="/" routerLinkActive="is-active" class="navbar-item is-hoverable">
          <span class="icon"><i class="fa fa-home"></i></span>
          <span>Home</span>
        </a>
        <a routerLink="/explorer" routerLinkActive="is-active" class="navbar-item is-hoverable">
          <span class="icon"><i class="fa fa-project-diagram"></i></span>
          <span>Explorer</span>
        </a>
        <a routerLink="/about" routerLinkActive="is-active" class="navbar-item is-hoverable">
          <span class="icon"><i class="fa fa-question"></i></span>
          <span>About</span>
        </a>
      </div>
    </div>
  </nav>
</div>

<main>
  <router-outlet></router-outlet>
</main>