1.2 Background added

This commit is contained in:
Flatlogic Bot 2025-10-13 11:09:02 +00:00
parent 3f6295d575
commit c89e4629a2
2 changed files with 72 additions and 62 deletions

View File

@ -1,4 +1,3 @@
/* assets/css/style.css */ /* assets/css/style.css */
:root { :root {
--primary-color: #D87533; /* A warm, pumpkin orange */ --primary-color: #D87533; /* A warm, pumpkin orange */
@ -103,6 +102,15 @@ body {
} }
/* Product Section */ /* Product Section */
.product-section-background {
background-color: #103900;
color: #F0F0F0;
}
.product-section-background .product-section h2 {
color: #F4A261;
}
.product-section { .product-section {
padding: 4rem 0; padding: 4rem 0;
text-align: center; text-align: center;

122
index.php
View File

@ -52,81 +52,83 @@
<a href="#products" class="cta-button">Shop Now</a> <a href="#products" class="cta-button">Shop Now</a>
</section> </section>
<section class="product-section" id="products"> <div class="product-section-background">
<div class="container"> <section class="product-section" id="products">
<h2>Our Pumpkins</h2> <div class="container">
<div class="product-grid"> <h2>Our Pumpkins</h2>
<!-- Product 1: Pumpkins --> <div class="product-grid">
<div class="product-card"> <!-- Product 1: Pumpkins -->
<img src="assets/pasted-20251013-104427-e367c0e6.jpg?v=<?php echo time(); ?>" alt="Pumpkin"> <div class="product-card">
<div class="product-info"> <img src="assets/pasted-20251013-104427-e367c0e6.jpg?v=<?php echo time(); ?>" alt="Pumpkin">
<h3>Festive Pumpkins</h3> <div class="product-info">
<p>Perfect for carving, decorating, or making delicious pies.</p> <h3>Festive Pumpkins</h3>
<div class="product-price">$12.99</div> <p>Perfect for carving, decorating, or making delicious pies.</p>
<div class="product-price">$12.99</div>
</div>
</div> </div>
</div>
<!-- Product 2: More Pumpkins --> <!-- Product 2: More Pumpkins -->
<div class="product-card"> <div class="product-card">
<img src="assets/pasted-20251013-104527-870b56ba.jpg?v=<?php echo time(); ?>" alt="Cinderella pumpkin"> <img src="assets/pasted-20251013-104527-870b56ba.jpg?v=<?php echo time(); ?>" alt="Cinderella pumpkin">
<div class="product-info"> <div class="product-info">
<h3>Heirloom Pumpkins</h3> <h3>Heirloom Pumpkins</h3>
<p>A variety of shapes and sizes for the perfect autumn display.</p> <p>A variety of shapes and sizes for the perfect autumn display.</p>
<div class="product-price">$15.99</div> <div class="product-price">$15.99</div>
</div>
</div> </div>
</div>
<!-- Product 3: Small Pumpkins --> <!-- Product 3: Small Pumpkins -->
<div class="product-card"> <div class="product-card">
<img src="assets/pasted-20251013-104632-6da13ed6.jpg?v=<?php echo time(); ?>" alt="Jarrahdale pumpkin"> <img src="assets/pasted-20251013-104632-6da13ed6.jpg?v=<?php echo time(); ?>" alt="Jarrahdale pumpkin">
<div class="product-info"> <div class="product-info">
<h3>Mini Pumpkins</h3> <h3>Mini Pumpkins</h3>
<p>Ideal for tabletop decorations and adding a festive touch.</p> <p>Ideal for tabletop decorations and adding a festive touch.</p>
<div class="product-price">$7.99 / set of 3</div> <div class="product-price">$7.99 / set of 3</div>
</div>
</div> </div>
</div>
</div>
</div> </div>
</div> </section>
</section>
<section class="product-section" id="persimmons"> <section class="product-section" id="persimmons">
<div class="container"> <div class="container">
<h2>Our Persimmons</h2> <h2>Our Persimmons</h2>
<div class="product-grid"> <div class="product-grid">
<!-- Product 1: Persimmons --> <!-- Product 1: Persimmons -->
<div class="product-card"> <div class="product-card">
<img src="assets/pasted-20251013-104838-d263cbfd.jpg?v=<?php echo time(); ?>" alt="Fuyu persimmon"> <img src="assets/pasted-20251013-104838-d263cbfd.jpg?v=<?php echo time(); ?>" alt="Fuyu persimmon">
<div class="product-info"> <div class="product-info">
<h3>Sweet Persimmons</h3> <h3>Sweet Persimmons</h3>
<p>Juicy, sweet, and ready to eat. A true taste of autumn.</p> <p>Juicy, sweet, and ready to eat. A true taste of autumn.</p>
<div class="product-price">$8.99 / lb</div> <div class="product-price">$8.99 / lb</div>
</div>
</div> </div>
</div>
<!-- Product 2: More Persimmons --> <!-- Product 2: More Persimmons -->
<div class="product-card"> <div class="product-card">
<img src="assets/pasted-20251013-105020-30d37036.png?v=<?php echo time(); ?>" alt="Hachiya persimmon"> <img src="assets/pasted-20251013-105020-30d37036.png?v=<?php echo time(); ?>" alt="Hachiya persimmon">
<div class="product-info"> <div class="product-info">
<h3>Fuyu Persimmons</h3> <h3>Fuyu Persimmons</h3>
<p>Crisp, sweet, and non-astringent. Perfect for salads.</p> <p>Crisp, sweet, and non-astringent. Perfect for salads.</p>
<div class="product-price">$9.99 / lb</div> <div class="product-price">$9.99 / lb</div>
</div>
</div> </div>
</div>
<!-- Product 3: Dried Persimmons --> <!-- Product 3: Dried Persimmons -->
<div class="product-card"> <div class="product-card">
<img src="assets/pasted-20251013-105058-e81307c0.webp?v=<?php echo time(); ?>" alt="Triumph persimmon"> <img src="assets/pasted-20251013-105058-e81307c0.webp?v=<?php echo time(); ?>" alt="Triumph persimmon">
<div class="product-info"> <div class="product-info">
<h3>Dried Persimmons</h3> <h3>Dried Persimmons</h3>
<p>A sweet and chewy snack, naturally preserved.</p> <p>A sweet and chewy snack, naturally preserved.</p>
<div class="product-price">$19.99 / bag</div> <div class="product-price">$19.99 / bag</div>
</div>
</div> </div>
</div>
</div>
</div> </div>
</div> </section>
</section> </div>
</main> </main>
<footer class="main-footer" id="about"> <footer class="main-footer" id="about">