Bootstrap 5.0 Nav dark, nav link style

Viewed 52

I am trying to convert a template we made years ago that was bootstrap 3.x.x into 5.

Trying to fix the navigation and although it is in dark mode, all the links come out blue and its ugly. they don't come out the way the bootstrap documentation shows, which was like an off white/grey I guess. in 3.x.x narbar-inverse just did it all but for some reason it isn't working here.

code below, hope it is formatted correctly as I did rip out some razor code that wasn't important.

<nav class="navbar navbar-dark bg-dark" style="border-top:1px solid rgba(255,255,255,.3);">
    <div class="container-fluid">
            @*<button type="button" class="navbar-toggler" data-bs-toggle="collapse" data-bs-target="#navbarText" aria-controls="navbarText" aria-expanded="false" aria-label="Toggle navigation">
                <span class="navbar-toggler-icon"></span>
            </button>*@
        <div class="collaps navbar-collapse" style="display: inline;" id="navbarText">
            <ul class="nav narbar-nav me-auto mb-2 mb-sm-0" id="ulNav" runat="server">
                <li class="nav-item">
                    <a class="nav-link" aria-current="page" href="#">Test</a>
                </li>
                <li class="nav-item">
                    <a class="nav-link" aria-current="page" href="#">Test</a>
                </li>
                
                        <li class="nav-item dropdown">
                            <a class="nav-link dropdown-toggle" href="#" id="reportDDL" role="button" data-bs-toggle="dropdown" aria-expanded="false">
                                Reports<span class="caret"></span>
                            </a>
                            <ul class="dropdown-menu">
                                <li><a class="dropdown-item" href="#">TEST LINK</a></li>
                            </ul>
                        </li>

                        <li class="nav-item dropdown">
                            <a class="nav-link dropdown-toggle" href="#" id="adminDDL" role="button" data-bs-toggle="dropdown" aria-expanded="false">
                                Administration<span class="caret"></span>
                            </a>
                            <ul class="dropdown-menu">
                               <li>@Html.ActionLink("User Maintenance", "Index", "UserMaint", new { @class = "dropdown-item" })</li>

                            </ul>
                        </li>
              
            </ul>
        </div>
    </div>
</nav>
0 Answers
Related