Note that when you resize the window to a smaller size or view it on a smart phone, it doesn't collapse to a hamburger menu. Also, note that this particular example is not fixed to the top of the page when you scroll the page. To do that you have to add fixed-top to your html in the same class where you have placed nav-pills.
To get it to look like pills, you specifically have to set in your own css:
.nav-pills .nav-link {
border-radius: 12.25rem;
background-color: var(--mrAltDarkColor);
margin-right: 8px;
}
There's also a tab menu and a Navbar menu.
Note that bootstrap adds an inline style to the opening body tag of : <body style="padding-top: 70px"> whenever you add a fixed menu. That's frequently more than you need.