dereklseitz
732be668f7
- Split header-footer.css into:
- header.css
- footer.css
- modals.css
- Split footer.njk into:
- footer.njk
- modals.njk
- Updated front matter of:
- index.njk
- about.njk
- credits.njk
- gallery.njk
- community.njk
64 lines
2.1 KiB
Plaintext
64 lines
2.1 KiB
Plaintext
---
|
|
layout: base.njk
|
|
metaDesc: "Demo eCommerce website by Derek L. Seitz - dlseitz.dev"
|
|
seoIndexing: false
|
|
title: "Gallery - Bloom Valley Nursery Demo"
|
|
stylesheet:
|
|
- "/styles/variables.css"
|
|
- "/styles/base.css"
|
|
- "/styles/header.css"
|
|
- "/styles/gallery.css"
|
|
- "/styles/footer.css"
|
|
- "/styles/modals.css"
|
|
fontAwesome: "https://kit.fontawesome.com/c42448086d.js"
|
|
currentPage: "gallery"
|
|
pageScripts:
|
|
- "/scripts/gallery-carousel.js"
|
|
- "/scripts/script.js"
|
|
- "/scripts/cart.js"
|
|
- "/scripts/newsletter.js"
|
|
---
|
|
|
|
<div id="gallery-top">
|
|
<section id="product-carousel-feature" aria-label="Interactive Carousel of Available Products by Category.">
|
|
<h2>Products by Category</h2>
|
|
<div id="product-category-card">
|
|
<button
|
|
id="scroll-left"
|
|
aria-label="Scroll products left"
|
|
aria-controls="product-carousel"
|
|
class="fa-solid fa-chevron-left"
|
|
>
|
|
</button>
|
|
<div id="product-carousel">
|
|
<div id="product-list"><!--Product Cards will be dynamically inserted here--></div>
|
|
</div>
|
|
<button
|
|
id="scroll-right"
|
|
aria-label="Scroll products right"
|
|
aria-controls="product-carousel"
|
|
class="fa-solid fa-chevron-right"
|
|
>
|
|
</button>
|
|
</div>
|
|
</section>
|
|
<aside id="right-aside">
|
|
<div id="category-nav-container" aria-label="Available Product Categories">
|
|
<h2>Shop by Category</h2>
|
|
<div class="categories">
|
|
<ul>
|
|
<li><a href="/gallery/?category=trees#" class="cat-btn">Trees</a></li>
|
|
<li><a href="/gallery/?category=trees#" class="cat-btn">Shrubs</a></li>
|
|
<li><a href="/gallery/?category=indoor#" class="cat-btn">Indoor</a></li>
|
|
<li><a href="/gallery/?category=indoor#" class="cat-btn">Patio</a></li>
|
|
<li><a href="/gallery/?category=tools#" class="cat-btn">Tools</a></li>
|
|
<li><a href="/gallery/?category=tools#" class="cat-btn">Accessories</a></li>
|
|
<li><a href="/gallery/?category=tools#" class="cat-btn">Landscaping</a></li>
|
|
</ul>
|
|
</div>
|
|
</div>
|
|
</aside>
|
|
</div>
|
|
<div id="gallery-bottom">
|
|
<button id="cart-details">View Shopping Cart</button>
|
|
</div> |