dereklseitz/BloomValleyNursery
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

style: Enhance desktop layout and fix navigation

Browse Source 
- Center featured section heading with proper spacing
- Adjust logo positioning with left margin
- Improve category list spacing
- Increase figcaption font size for better readability
- Fix navigation link hover states to prevent layout shift
- Ensure consistent spacing in featured images container
This commit is contained in:
Derek L. Seitz
2025-09-01 17:52:15 -05:00
parent 3e210572a2
commit 8f09695bff
4 changed files with 187 additions and 103 deletions
Download Patch File Download Diff File Expand all files Collapse all files

75
src/_includes/header.njk
View File

@@ -1,37 +1,44 @@
<header role="banner">
<div class="logo">
<img
src="/images/Client1_LogoPalette2_F0C06D.png"
alt="Bloom Valley Nursery Logo">
<div class="header-container">
<div class="header-left">
<div class="logo">
<img
src="/images/Client1_LogoPalette2_F0C06D.png"
alt="Bloom Valley Nursery Logo">
</div>
</div>
<div class="header-center">
<div class="business-name-container">
<p class="business-name">Bloom Valley Nursery</p>
</div>
<div class="nav-container">
<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>
</nav>
</div>
</div>
<div class="header-right">
<button id="menu-toggle" class="menu-toggle" aria-label="Open navigation menu" aria-expanded="false">
<i class="fa-solid fa-bars fa-2xl"></i>
</button>
<button id="shopping-cart" aria-label="Shopping Cart">
<i class="fa-solid fa-cart-shopping"></i>
</button>
</div>
</div>
<p class="business-name">Bloom Valley Nursery</p>
<!-- Navigation Bar -->
<button id="menu-toggle" class="menu-toggle" aria-label="Open navigation menu" aria-expanded="false">
<i class="fa-solid fa-bars fa-2xl"></i>
</button>
<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>
</nav>
<button
id="shopping-cart"
aria-label="Open shopping cart"
class="fa-solid fa-cart-shopping fa-xl">
</button>
</header>