Revert "Backport navbar rendering from upstream (#422)" (#423)

This reverts commit aa643b6.
twbs · Mar 11, 2024 · 5909636 · 5909636
1 parent aa643b6
commit 5909636
Show file tree

Hide file tree

Showing 4 changed files with 17 additions and 30 deletions.
diff --git a/src/assets/scss/_navbar.scss b/src/assets/scss/_navbar.scss
@@ -1,21 +1,12 @@
 .bd-navbar {
   padding: .75rem 0;
   background-color: transparent;
-  box-shadow: 0 .5rem 1rem rgba($black, .15), inset 0 -1px 0 rgba($white, .15);
-
-  &::after {
-    position: absolute;
-    inset: 0;
-    z-index: -1;
-    display: block;
-    content: "";
-    background-image: linear-gradient(rgba(var(--bd-violet-rgb), 1), rgba(var(--bd-violet-rgb), .95));
-  }
+  background-image: linear-gradient(to bottom, rgba(var(--bd-violet-rgb), 1), rgba(var(--bd-violet-rgb), .95));
+  box-shadow: 0 .5rem 1rem rgba(0, 0, 0, .15), inset 0 -1px 0 rgba(0, 0, 0, .15);
 
-  .bd-navbar-toggle {
-    @include media-breakpoint-down(lg) {
-      width: 4.25rem;
-    }
+  .bi {
+    width: 1em;
+    height: 1em;
   }
 
   .navbar-toggler {
@@ -38,8 +29,7 @@
   }
 
   .navbar-brand {
-    color: $white;
-    @include transition(transform .2s ease-in-out);
+    transition: .2s ease-in-out transform;
 
     &:hover {
       transform: rotate(-5deg) scale(1.1);
@@ -69,11 +59,11 @@
   }
 
   .offcanvas-lg {
-    background-color: var(--bd-violet-bg);
+    background-color: var(--bd-violet);
     border-left: 0;
 
-    @include media-breakpoint-down(lg) {
-      box-shadow: var(--bs-box-shadow-lg);
+    @media (max-width: 992px) {
+      box-shadow: $box-shadow-lg;
     }
   }
 
@@ -114,14 +104,11 @@
   .dropdown-menu-end {
     --bs-dropdown-min-width: 8rem;
   }
-
-  hr {
-    margin: 1rem 0;
-  }
 }
 
 @include color-mode(dark) {
   .bd-navbar {
     box-shadow: 0 .5rem 1rem rgba($black, .15), inset 0 -1px 0 rgba($white, .15);
   }
 }
+
diff --git a/src/layouts/partials/footer.html b/src/layouts/partials/footer.html
@@ -16,10 +16,10 @@ <h5>Links</h5>
         <ul class="list-unstyled">
           <li class="mb-2"><a href="{{ .Site.Params.main }}/">Home</a></li>
           <li class="mb-2"><a href="{{ .Site.Params.main }}/docs/{{ .Site.Params.docs_version }}/">Docs</a></li>
-          <li class="mb-2"><a href="{{ .Site.Params.main }}/docs/{{ .Site.Params.docs_version }}/examples">Examples</a></li>
+          <li class="mb-2"><a href="{{ .Site.Params.main }}/docs/{{ .Site.Params.docs_version }}/examples/">Examples</a></li>
           <li class="mb-2"><a href="{{ .Site.Params.icons }}">Icons</a></li>
           <li class="mb-2"><a href="{{ .Site.Params.themes }}">Themes</a></li>
-          <li class="mb-2"><a href="/">Blog</a></li>
+          <li class="mb-2"><a href="{{ .Site.Params.blog }}">Blog</a></li>
           <li class="mb-2"><a href="{{ .Site.Params.swag }}" target="_blank" rel="noopener">Swag Store</a></li>
         </ul>
       </div>

diff --git a/src/layouts/partials/icons/bootstrap-white-fill.svg b/src/layouts/partials/icons/bootstrap-white-fill.svg
diff --git a/src/layouts/partials/navbar.html b/src/layouts/partials/navbar.html
@@ -1,6 +1,6 @@
-<header class="navbar navbar-expand-lg bd-navbar sticky-top">
+<header class="navbar navbar-expand-lg navbar-dark bd-navbar sticky-top">
   <nav class="container-xxl bd-gutter flex-wrap flex-lg-nowrap" aria-label="Main navigation">
-    <div class="d-lg-none" style="width: 2rem;"></div>
+    <div class="d-lg-none" style="width: 2.25rem;"></div>
 
     <a class="navbar-brand p-0 me-0 me-lg-2" href="/" aria-label="Bootstrap">
       {{ partial "icons/bootstrap-white-fill.svg" (dict "class" "d-block my-1" "width" "40" "height" "32") }}
@@ -10,7 +10,7 @@
       <svg class="bi" width="24" height="24" aria-hidden="true"><use xlink:href="#three-dots"></use></svg>
     </button>
 
-    <div class="offcanvas-lg offcanvas-end flex-grow-1" tabindex="-1" id="bdNavbar" aria-labelledby="bdNavbarOffcanvasLabel">
+    <div class="offcanvas-lg offcanvas-end flex-grow-1" id="bdNavbar" aria-labelledby="bdNavbarOffcanvasLabel">
       <div class="offcanvas-header px-4 pb-0">
         <h5 class="offcanvas-title text-white" id="bdNavbarOffcanvasLabel">Bootstrap</h5>
         <button type="button" class="btn-close btn-close-white" data-bs-dismiss="offcanvas" aria-label="Close" data-bs-target="#bdNavbar"></button>
@@ -32,7 +32,7 @@ <h5 class="offcanvas-title text-white" id="bdNavbarOffcanvasLabel">Bootstrap</h5
             <a class="nav-link py-2 px-0 px-lg-2" href="{{ .Site.Params.themes }}" target="_blank" rel="noopener">Themes</a>
           </li>
           <li class="nav-item col-6 col-lg-auto">
-            <a class="nav-link py-2 px-0 px-lg-2 active" href="/">Blog</a>
+            <a class="nav-link py-2 px-0 px-lg-2 active" href="{{ .Site.Params.blog }}">Blog</a>
           </li>
         </ul>