"Apps Page test"
Bootstrap 4.1.1 Snippet by sparkktv

<link href="//maxcdn.bootstrapcdn.com/bootstrap/4.1.1/css/bootstrap.min.css" rel="stylesheet" id="bootstrap-css"> <script src="//maxcdn.bootstrapcdn.com/bootstrap/4.1.1/js/bootstrap.min.js"></script> <script src="//cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script> <!------ Include the above in your HEAD tag ----------> <nav class="container-fluid d-flex justify-content-end align-items-center py-2 px-4" style="background: linear-gradient(180deg,#17184b,#0E0E20 100vh); font-size: 16px;"> <ul class="nav"> <!-- Watchlist Icon --> <li class="nav-item me-3"> <a href="#" class="nav-link text-white fw-900" style="font-size: 16px;"> <i class="fas fa-bookmark"></i> </a> </li> <!-- Search Icon --> <li class="nav-item me-3"> <a href="#" class="nav-link text-white fw-900" style="font-size: 16px;"> <i class="fas fa-search"></i> </a> </li> <!-- User Dropdown --> <li class="nav-item dropdown"> <a href="#" class="nav-link dropdown-toggle text-white fw-900" id="userDropdown" role="button" data-bs-toggle="dropdown" aria-expanded="false" style="font-size: 16px;"> <i class="fas fa-user"></i> </a> <ul class="dropdown-menu border-0 mt-2" aria-labelledby="userDropdown" style="background-color: #17184b; border-radius: 1rem; transform: translateX(-10px);"> <li><a class="dropdown-item text-white fw-900" href="#" onmouseover="this.classList.add('text-secondary')" onmouseout="this.classList.remove('text-secondary')">Account</a></li> <li><a class="dropdown-item text-white fw-900" href="#" onmouseover="this.classList.add('text-secondary')" onmouseout="this.classList.remove('text-secondary')">Help</a></li> <li><a class="dropdown-item text-white fw-900" href="#" onmouseover="this.classList.add('text-secondary')" onmouseout="this.classList.remove('text-secondary')">Sign Out</a></li> </ul> </li> </ul> </nav> <!-- Required Bootstrap JS --> <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/js/bootstrap.bundle.min.js"></script> <!-- Font Awesome --> <link href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.5.0/css/all.min.css" rel="stylesheet">
@import url(https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.5.2/css/all.min.css); body{background:#17184b;color:#fff;} .fw-900{font-weight:900;}

Related: See More


Questions / Comments: