The nabvar will collapse on small devices. The point of collapsing is defined by @grid-float-breakpoint in variables. By default this will by before 768px. For screens below the 768 pixels screen width, the navbar will look like:
It's possible to change the @grid-float-breakpoint in variables.less and recompile Bootstrap. When doing this you also will have to change @screen-xs-max in navbar.less. You will have to set this value to your new @grid-float-breakpoint -1. See also: https://github.com/twbs/bootstrap/pull/10465. This is needed to change navbar forms and dropdowns at the @grid-float-breakpoint to their mobile version too.
Easiest way is to customize bootstrap
find variable:
@grid-float-breakpoint
which is set to @screen-sm, you can change it according to your needs. Hope it helps!
For SAAS Users
add your custom variables like $grid-float-breakpoint: 0px; before the @import "bootstrap.scss";