ng-implementation/sae-csc/src/app/shared/navigation/top-navigation/top-navigation.html

<div class="top-navigation">

  <nav class="navbar" role="navigation" aria-label="main navigation">
    <div class="navbar-brand">
      <a class="navbar-item" href="https://cipherbliss.com">

        <img src="safran_logo.svg" alt="logo">
      </a>

      <a role="button" class="navbar-burger" aria-label="menu" aria-expanded="false"
         data-target="navbarBasicExample">
        <span aria-hidden="true"></span>
        <span aria-hidden="true"></span>
        <span aria-hidden="true"></span>
        <span aria-hidden="true"></span>
      </a>
    </div>

    <div id="navbarBasicExample" class="navbar-menu">

      <div class="navbar-start">
        <a class="navbar-item" routerLink="home" routerLinkActive="is-active">
          <img src="csc_logo.svg" alt="logo">
          CSC Solution Matcher
        </a>
      </div>
      <div class="navbar-end">

<!--        <a class="navbar-item">-->
<!--          Home-->
<!--        </a>-->
        <a class="navbar-item is-active">
          <i class="ri-admin-line"></i>
          Admin

        </a>
        <a class="navbar-item">
          <i class="ri-compass-3-line"></i>
          Quick Start

        </a>
        <a class="navbar-item">
          <!--  exit-->
          <i class="ri-door-line"></i>
        </a>
        <a class="navbar-item">
          <!--  user -->
          <i class="ri-user-2-fill"></i>
          borhène
        </a>

      </div>
    </div>
  </nav>

<!--  <app-alert-box></app-alert-box>-->
</div>