dereklseitz
af7e76f01f
This commit introduces a new script that fetches and normalizes event data from Zoho Calendar using OAuth2. The script makes an API call to retrieve calendar events for the current month. The event data is then processed and formatted to be used by a Nunjucks template. Key Changes: - test(dummy-data): Created a dummy calendar and dummy events for development and testing. - feat(events): Added a new script to fetch event data from Zoho Calendar. - feat(oauth2): Implemented OAuth2 authentication for secure API access. - refactor(data): Normalized the fetched data payload for consistency. - feat(ui): Integrated the normalized data with a Nunjucks template to dynamically populate "event cards" on the community events page.
121 lines
4.6 KiB
Plaintext
121 lines
4.6 KiB
Plaintext
---
|
|
layout: base.njk
|
|
metaDesc: "Demo eCommerce website by Derek L. Seitz - dlseitz.dev"
|
|
title: "About - Bloom Valley Nursery Demo"
|
|
stylesheet:
|
|
- "/styles/variables.css"
|
|
- "/styles/base.css"
|
|
- "/styles/header-footer.css"
|
|
- "/styles/about.css"
|
|
fontAwesome: "https://kit.fontawesome.com/c42448086d.js"
|
|
currentPage: "about"
|
|
pageScripts:
|
|
- "/scripts/feedback.js"
|
|
- "/scripts/cart.js"
|
|
- "/scripts/newsletter.js"
|
|
---
|
|
|
|
<div class="about">
|
|
<div id="main-top">
|
|
<section
|
|
id="business-info"
|
|
aria-label="Hours of operation and contact info"
|
|
>
|
|
<h3>Contact Us</h3>
|
|
<div id="phone">
|
|
<h4><strong>Phone:</strong></h4>
|
|
<p>(555) 123-4567</p>
|
|
</div>
|
|
<h3>Hours of Operation</h3>
|
|
<div id="hours">
|
|
<h4><strong>Monday - Friday:</strong></h4>
|
|
<p>9:00 AM - 6:00 PM</p>
|
|
<h4><strong>Saturday & Sunday:</strong></h4>
|
|
<p>10:00 AM - 5:00 PM</p>
|
|
</div>
|
|
</section>
|
|
<section class="story-section">
|
|
<div id="story" aria-label="History of Bloom Valley Nursery">
|
|
<h2>The Story of Bloom Valley</h2>
|
|
<p>
|
|
Legend has it that in 1822, Benjamin Bloom, his wife Violet, and
|
|
their young daughter Nora stumbled upon a breathtaking valley
|
|
brimming with vibrant, rare flowers during their journey westward.
|
|
Enchanted by its beauty, they decided to settle there, abandoning
|
|
their plans to reach California. This picturesque haven became known
|
|
as Bloom Valley.
|
|
</p>
|
|
<p>
|
|
Today, on the very land where the Bloom family found their paradise,
|
|
stands Bloom Valley Nursery. Still family-owned and operated,
|
|
siblings Bethany, Vincent, and Nathaniel Bloom carry forward a
|
|
legacy of preserving and sharing the natural beauty that captivated
|
|
the hearts of their ancestors over two centuries ago.
|
|
</p>
|
|
<p>Though many things have changed through the years, our commitment to serving our community has remained the same. Let us help you cultivate joy, one bloom at a time!</p>
|
|
</div>
|
|
</section>
|
|
</div>
|
|
<div id="main-bottom">
|
|
<div id="feedback" aria-label="Feedback form">
|
|
<div id="feedback-intro">
|
|
<h2>We Want to Hear From You!</h2>
|
|
<h3>Your feedback provides us with valuable insight into where we stand in our commitment to our neighbors, friends, and the entire Bloom Valley community.</h3>
|
|
<p>Feel free to contact us by filling out the form below if you have any questions, concerns, or simply want to tell us how we can better serve you in the future. You are also welcome to give us a call at the number above if you need to speak with someone directly. Our friendly staff can help answer your questions or guide you in placing custom orders as well!</p>
|
|
</div>
|
|
<div id="feedback-form">
|
|
<form action="#" method="POST">
|
|
<div id="customer-info">
|
|
<div id="name-field">
|
|
<label for="name">Name:</label>
|
|
<input
|
|
type="text"
|
|
id="name"
|
|
name="name"
|
|
aria-label="Enter your name here" placeholder="Your Name"
|
|
required/>
|
|
</div>
|
|
<div id="phone-field">
|
|
<label for="tel">Phone Number:</label>
|
|
<input
|
|
type="tel"
|
|
id="tel"
|
|
name="telephone"
|
|
aria-label="Enter your contact phone number here" placeholder="Your Phone Number"
|
|
required/>
|
|
</div>
|
|
<div id="email-field">
|
|
<label for="email">Email:</label>
|
|
<input
|
|
type="email"
|
|
id="email"
|
|
name="email"
|
|
aria-label="Enter your contact email here" placeholder="user@domain.com"
|
|
required/>
|
|
</div>
|
|
</div>
|
|
<div id="customer-message">
|
|
<div id="message-field">
|
|
<label for="message">Message:</label>
|
|
<textarea
|
|
id="message"
|
|
name="message"
|
|
rows="5"
|
|
aria-label="Enter feedback or inquiries here" placeholder="Enter feedback or inquiries here..."
|
|
required>
|
|
</textarea>
|
|
</div>
|
|
<div id="form-submit-btn">
|
|
<button
|
|
id="form-submit"
|
|
type="submit"
|
|
aria-label="Submit feedback or inquiry"
|
|
>Submit
|
|
</button>
|
|
</div>
|
|
</div>
|
|
</form>
|
|
</div>
|
|
</div>
|
|
</div>
|