feat: Add dynamic page indicator to nav links.
- add {currentPage} to front matter of page templates
This commit is contained in:
3
.gitignore
vendored
3
.gitignore
vendored
@@ -1,2 +1,3 @@
|
|||||||
node_modules/
|
node_modules/
|
||||||
_site/
|
_site/
|
||||||
|
_site/*
|
||||||
|
@@ -25,7 +25,7 @@
|
|||||||
|
|
||||||
<body>
|
<body>
|
||||||
|
|
||||||
{% include "header.html" %}
|
{% include "header.njk" %}
|
||||||
|
|
||||||
<main>
|
<main>
|
||||||
|
|
||||||
@@ -33,7 +33,7 @@
|
|||||||
|
|
||||||
</main>
|
</main>
|
||||||
|
|
||||||
{% include "footer.html" %}
|
{% include "footer.njk" %}
|
||||||
|
|
||||||
<!-- <a href="https://www.svgbackgrounds.com/set/free-svg-backgrounds-and-patterns/">Free SVG Backgrounds and Patterns by SVGBackgrounds.com</a> -->
|
<!-- <a href="https://www.svgbackgrounds.com/set/free-svg-backgrounds-and-patterns/">Free SVG Backgrounds and Patterns by SVGBackgrounds.com</a> -->
|
||||||
|
|
||||||
|
@@ -16,10 +16,10 @@
|
|||||||
</div>
|
</div>
|
||||||
<div id="footer-nav">
|
<div id="footer-nav">
|
||||||
<ul>
|
<ul>
|
||||||
<li><a href="/" class="current-page">Home</a></li>
|
<li><a href="/" {% if currentPage == 'index' %}class="current-page" aria-current="page"{% endif %}>Home</a></li>
|
||||||
<li><a href="/gallery/">Gallery</a></li>
|
<li><a href="/gallery/" {% if currentPage == 'gallery' %}class="current-page" aria-current="page"{% endif %}>Gallery</a></li>
|
||||||
<li><a href="/about/">About Us</a></li>
|
<li><a href="/about/" {% if currentPage == 'about' %}class="current-page" aria-current="page"{% endif %}>About Us</a></li>
|
||||||
<li><a href="/community/">Community Events</a></li>
|
<li><a href="/community/" {% if currentPage == 'community' %}class="current-page" aria-current="page"{% endif %}>Community Events</a></li>
|
||||||
</ul>
|
</ul>
|
||||||
</div>
|
</div>
|
||||||
<div id="social-media">
|
<div id="social-media">
|
@@ -1,25 +0,0 @@
|
|||||||
<header role="banner">
|
|
||||||
<div class="logo">
|
|
||||||
<img
|
|
||||||
src="images/Client1_LogoPalette2_F0C06D.png"
|
|
||||||
alt="Bloom Valley Nursery Logo"/>
|
|
||||||
</div>
|
|
||||||
<h1>Bloom Valley Nursery</h1>
|
|
||||||
<!-- Navigation Bar -->
|
|
||||||
<nav role="navigation" aria-label="Main Navigation">
|
|
||||||
<ul>
|
|
||||||
<li>
|
|
||||||
<a href="/" aria-current="page" class="current-page">Home</a></li>
|
|
||||||
<li><a href="/gallery/">Gallery</a></li>
|
|
||||||
<li><a href="/about/">About Us</a></li>
|
|
||||||
<li><a href="/community/">Community Events</a></li>
|
|
||||||
</ul>
|
|
||||||
<div>
|
|
||||||
<button
|
|
||||||
id="shopping-cart"
|
|
||||||
aria-label="Open shopping cart"
|
|
||||||
class="fa-solid fa-cart-shopping fa-2xl">
|
|
||||||
</button>
|
|
||||||
</div>
|
|
||||||
</nav>
|
|
||||||
</header>
|
|
25
src/_includes/header.njk
Normal file
25
src/_includes/header.njk
Normal file
@@ -0,0 +1,25 @@
|
|||||||
|
<header role="banner">
|
||||||
|
<div class="logo">
|
||||||
|
<img
|
||||||
|
src="images/Client1_LogoPalette2_F0C06D.png"
|
||||||
|
alt="Bloom Valley Nursery Logo">
|
||||||
|
</div>
|
||||||
|
<h1>Bloom Valley Nursery</h1>
|
||||||
|
<!-- Navigation Bar -->
|
||||||
|
<nav role="navigation" aria-label="Main Navigation">
|
||||||
|
<ul>
|
||||||
|
<li>
|
||||||
|
<a href="/" {% if currentPage == 'index' %}class="current-page" aria-current="page"{% endif %}>Home</a></li>
|
||||||
|
<li><a href="/gallery/" {% if currentPage == 'gallery' %}class="current-page" aria-current="page"{% endif %}>Gallery</a></li>
|
||||||
|
<li><a href="/about/" {% if currentPage == 'about'%}class="current-page" aria-current="page"{% endif %}>About Us</a></li>
|
||||||
|
<li><a href="/community/" {% if currentPage == 'community' %}class="current-page" aria-current="page"{% endif %}>Community Events</a></li>
|
||||||
|
</ul>
|
||||||
|
<div>
|
||||||
|
<button
|
||||||
|
id="shopping-cart"
|
||||||
|
aria-label="Open shopping cart"
|
||||||
|
class="fa-solid fa-cart-shopping fa-2xl">
|
||||||
|
</button>
|
||||||
|
</div>
|
||||||
|
</nav>
|
||||||
|
</header>
|
@@ -8,7 +8,7 @@ stylesheet:
|
|||||||
- "/styles/header-footer.css"
|
- "/styles/header-footer.css"
|
||||||
- "/styles/about.css"
|
- "/styles/about.css"
|
||||||
fontAwesome: "https://kit.fontawesome.com/c42448086d.js"
|
fontAwesome: "https://kit.fontawesome.com/c42448086d.js"
|
||||||
isLandingPage: false
|
currentPage: "about"
|
||||||
pageScripts:
|
pageScripts:
|
||||||
- "/scripts/feedback.js"
|
- "/scripts/feedback.js"
|
||||||
- "/scripts/cart.js"
|
- "/scripts/cart.js"
|
||||||
|
@@ -8,7 +8,7 @@ stylesheet:
|
|||||||
- "/styles/header-footer.css"
|
- "/styles/header-footer.css"
|
||||||
- "/styles/community.css"
|
- "/styles/community.css"
|
||||||
fontAwesome: "https://kit.fontawesome.com/c42448086d.js"
|
fontAwesome: "https://kit.fontawesome.com/c42448086d.js"
|
||||||
isLandingPage: false
|
currentPage: "community"
|
||||||
pageScripts:
|
pageScripts:
|
||||||
- "/scripts/cart.js"
|
- "/scripts/cart.js"
|
||||||
- "/scripts/newsletter.js"
|
- "/scripts/newsletter.js"
|
||||||
|
@@ -8,7 +8,7 @@ stylesheet:
|
|||||||
- "/styles/header-footer.css"
|
- "/styles/header-footer.css"
|
||||||
- "/styles/gallery.css"
|
- "/styles/gallery.css"
|
||||||
fontAwesome: "https://kit.fontawesome.com/c42448086d.js"
|
fontAwesome: "https://kit.fontawesome.com/c42448086d.js"
|
||||||
isLandingPage: false
|
currentPage: "gallery"
|
||||||
pageScripts:
|
pageScripts:
|
||||||
- "/scripts/gallery-carousel.js"
|
- "/scripts/gallery-carousel.js"
|
||||||
- "/scripts/script.js"
|
- "/scripts/script.js"
|
||||||
|
@@ -8,7 +8,7 @@ stylesheet:
|
|||||||
- "/styles/header-footer.css"
|
- "/styles/header-footer.css"
|
||||||
- "/styles/index.css"
|
- "/styles/index.css"
|
||||||
fontAwesome: "https://kit.fontawesome.com/c42448086d.js"
|
fontAwesome: "https://kit.fontawesome.com/c42448086d.js"
|
||||||
isLandingPage: true
|
currentPage: "index"
|
||||||
pageScripts:
|
pageScripts:
|
||||||
- "/scripts/script.js"
|
- "/scripts/script.js"
|
||||||
- "/scripts/cart.js"
|
- "/scripts/cart.js"
|
||||||
|
Reference in New Issue
Block a user