diff --git a/src/_includes/main/base.njk b/src/_includes/main/base.njk
index a2b3c72a..989c7511 100644
--- a/src/_includes/main/base.njk
+++ b/src/_includes/main/base.njk
@@ -45,14 +45,14 @@
{% include "main/header.njk" %}
- {% include "main/navbar.njk" %}
+ {% renderTemplate "webc" %}
+
+ {% endrenderTemplate %}
-
{{ content | safe }}
-
diff --git a/src/_includes/main/navbar.njk b/src/_includes/main/navbar.njk
deleted file mode 100644
index 74dc9ffd..00000000
--- a/src/_includes/main/navbar.njk
+++ /dev/null
@@ -1,14 +0,0 @@
-
\ No newline at end of file
diff --git a/src/_includes/main/navbar.webc b/src/_includes/main/navbar.webc
new file mode 100644
index 00000000..9dd358b5
--- /dev/null
+++ b/src/_includes/main/navbar.webc
@@ -0,0 +1,77 @@
+
+
+
+
+
\ No newline at end of file
diff --git a/src/assets/css/main.css b/src/assets/css/main.css
index 113877f3..de94c6d0 100644
--- a/src/assets/css/main.css
+++ b/src/assets/css/main.css
@@ -256,52 +256,6 @@ dd {
filter: drop-shadow(0.1rem 0.1rem 0.2rem black);
}
-/* NAVIGATION BAR COMPONENT */
-.navbar {
- background: var(--clr-navbar-bg);
- padding: 0 0.6rem;
- width: 100%;
- z-index: 999;
-}
-
-.navbar a {
- color: var(--clr-navbar-link);
- text-decoration: none;
- cursor: pointer;
-}
-
-.navbar a:hover {
- color: var(--clr-link-hover);
-}
-
-.navbar a:focus {
- outline-offset: 0.3em;
- outline: 0.15em solid var(--clr-navbar-link);
-}
-
-.nav__menu {
- list-style: none;
- padding: 0;
- display: flex;
- justify-content: space-evenly;
- flex-wrap: wrap;
- gap: 0.5rem;
-}
-
-/* Added to the navbar with JS when it reaches its scroll position */
-.sticky-nav {
- position: fixed;
- width: 100%;
- top: 0;
-}
-
-/* Add some top padding to the page content to prevent sudden quick movement
-as the navigation bar gets a new position at the top of the page
-(position:fixed and top:0) */
-.sticky-nav + main {
- padding-top: 2rem;
-}
-
/* MAIN CONTENT */
main,
.content-container,
diff --git a/src/assets/js/navbar.js b/src/assets/js/navbar.js
deleted file mode 100644
index 4af68202..00000000
--- a/src/assets/js/navbar.js
+++ /dev/null
@@ -1,13 +0,0 @@
-// Make the navigation bar sticky
-const header = document.querySelector(".main-header");
-const navbar = document.querySelector(".navbar");
-
-window.addEventListener("scroll", e => {
- const scrollPos = window.scrollY || document.documentElement.scrollTop;
- const stickyLine = header.scrollHeight - navbar.scrollHeight;
- if (scrollPos > stickyLine) {
- navbar.classList.add("sticky-nav");
- } else {
- navbar.classList.remove("sticky-nav");
- }
-});