// Navbars
.bd-example {
- .navbar-fixed-top {
+ .fixed-top,
+ .sticky-top {
position: static;
margin: -1rem -1rem 1rem;
}
- .navbar-fixed-bottom {
+ .fixed-bottom {
position: static;
margin: 1rem -1rem -1rem;
}
@include media-breakpoint-up(sm) {
- .navbar-fixed-top {
+ .fixed-top,
+ .sticky-top {
margin: -1.5rem -1.5rem 1rem;
}
- .navbar-fixed-bottom {
+ .fixed-bottom {
margin: 1rem -1.5rem -1.5rem;
}
}
$zindex-dropdown-backdrop: 990 !default;
$zindex-navbar: 1000 !default;
$zindex-dropdown: 1000 !default;
-$zindex-navbar-fixed: 1030 !default;
-$zindex-navbar-sticky: 1030 !default;
+$zindex-fixed: 1030 !default;
+$zindex-sticky: 1030 !default;
$zindex-modal-backdrop: 1040 !default;
$zindex-modal: 1050 !default;
$zindex-popover: 1060 !default;
</head>
<body data-spy="scroll" data-target=".navbar" data-offset="70">
<div class="container">
- <nav class="navbar navbar-fixed-top navbar-dark bg-inverse">
+ <nav class="navbar fixed-top navbar-dark bg-inverse">
<a class="navbar-brand" href="#">Scrollspy test</a>
<ul class="nav navbar-nav">
<li class="nav-item">
}
-// Navbar position
-//
-// Display the navbar across the entirety of the page or fixed it to the top or
-// bottom of the page.
-
-// Fix the top/bottom navbars when screen real estate supports it
-.navbar-fixed-top,
-.navbar-fixed-bottom {
- position: fixed;
- right: 0;
- left: 0;
- z-index: $zindex-navbar-fixed;
-}
-
-.navbar-fixed-top {
- top: 0;
-}
-
-.navbar-fixed-bottom {
- bottom: 0;
-}
-
-.navbar-sticky-top {
- position: sticky;
- top: 0;
- z-index: $zindex-navbar-sticky;
-}
-
-
// Navbar themes
//
// Styles for switching between navbars with light or dark background.
// of components dependent on the z-axis and are designed to all work together.
$zindex-dropdown-backdrop: 990 !default;
-$zindex-navbar: 1000 !default;
-$zindex-dropdown: 1000 !default;
-$zindex-navbar-fixed: 1030 !default;
-$zindex-navbar-sticky: 1030 !default;
-$zindex-modal-backdrop: 1040 !default;
-$zindex-modal: 1050 !default;
-$zindex-popover: 1060 !default;
-$zindex-tooltip: 1070 !default;
+$zindex-navbar: 1000 !default;
+$zindex-dropdown: 1000 !default;
+$zindex-fixed: 1030 !default;
+$zindex-sticky: 1030 !default;
+$zindex-modal-backdrop: 1040 !default;
+$zindex-modal: 1050 !default;
+$zindex-popover: 1060 !default;
+$zindex-tooltip: 1070 !default;
// Navbar