commit 8c966ba60b094a107a59d4568fb2fc7785e6ff64 Author: Tristan Smith Date: Sat May 25 22:59:54 2024 -0400 first commit diff --git a/Readme.md b/Readme.md new file mode 100644 index 0000000..e698b55 --- /dev/null +++ b/Readme.md @@ -0,0 +1,51 @@ +# Willow Me Creations Website + +Welcome to the Willow Me Creations website! This is a small business specializing in handcrafted clothing and wearables. The website provides information about the creator, the products offered, and how to get in touch. + +## Table of Contents + +- [About](#about) +- [Products](#products) +- [Contact](#contact) +- [Getting Started](#getting-started) +- [Contributing](#contributing) +- [License](#license) + +## About + +Willow Me Creations is a small independent maker located in the beautiful Midwest, specifically in the state of Indiana. The creator, Bethany, loves to craft beautiful goods for people to wear and show off. The website showcases meticulously crafted sweaters, scarves, shawls, and more, all available for purchase through the online store. + +## Products + +The website's [Products](products.html) page provides detailed information about the handcrafted items available. Each product is crafted in small batches, ensuring a unique and personalized touch to every piece. Custom orders are also welcomed, allowing customers to request personalized items. + +## Contact + +For inquiries, custom orders, or general communication, feel free to reach out: (update email) + +- **Email:** [bethany@willowmecreations.com](mailto:) + +Connect with Willow Me Creations on social media: (need to update these links) + +- [Facebook](https://facebook.com/) +- [Instagram](https://instagram.com/) +- [TikTok](https://tiktok.com/bethanyrhodes6) + +## Getting Started + +To explore the website, simply navigate through the following sections: + +- [Home](index.html): Overview of Willow Me Creations and the creator. +- [About](about.html): Learn more about the creator and the crafting process. +- [Products](products.html): Browse through the available handcrafted items. +- [Contact](contact.html): Find contact information and connect on social media. + +## Contributing + +Contributions to Willow Me Creations are not currently open, as this is a personal website. However, suggestions and feedback are always welcome. + +## License + +This website is licensed under the [MIT License](LICENSE). Feel free to explore the code, but please respect the intellectual property and creative efforts behind Willow Me Creations. Or don't. I used AI to build a fair amount of this. + +© 2023-24 Willow Me Creations diff --git a/about.html b/about.html new file mode 100644 index 0000000..1e4d7ea --- /dev/null +++ b/about.html @@ -0,0 +1,75 @@ + + + + + About Bethany - WillowMeCreations + + + + + + + +
+
+ + +
+
+ +
+
+
+

About Bethany

+

Meet Bethany Rhodes, the creative force behind the charming crochet shop known as WillowMeCreations. + Born and raised in the picturesque state of Indiana, Bethany discovered her passion for crafting at + a young age. What started as a hobby soon blossomed into a small business, where she lovingly + handcrafts sweaters and other wearables. Her quaint shop has become a local gem, drawing visitors to + the farmers' markets with the promise of cozy, one-of-a-kind creations.

+

Bethany's journey into entrepreneurship is a tale of dedication and love for her craft. After years + of perfecting her crochet techniques, Bethany decided to share her creations with the world. The + decision to set up shop at farmers' markets was driven by a desire to connect with the community and + bring warmth to the chilly Midwestern winters. Her booth, adorned with vibrant yarn and a display of + intricately designed sweaters, quickly became a focal point at local markets.

+

Beyond her commercial success, Bethany has a heartwarming tradition that sets her apart. Moved by a + desire to make a difference in the lives of animals, she occasionally crafts miniature sweaters for + lost cats. These tiny garments not only provide comfort and warmth but also serve as a beacon of + hope for these feline friends in search of a home. Bethany's dedication to her community extends + beyond humans, showcasing the compassion that infuses every stitch of her work.

+

Each item crafted by Bethany is a testament to her meticulous attention to detail and commitment + to quality. Working in small batches, she ensures that every piece is a work of art, blending + functionality with aesthetic appeal. From cozy scarves to stylish shawls, WillowMeCreations offers a + diverse range of handmade products, reflecting the diversity of her skills and the unique + preferences of her clientele.

+

For Bethany, WillowMeCreations is more than just a business; it's a reflection of her passion, + creativity, and the warmth she wishes to share with the world.

+
+
+
+ + + + + + + \ No newline at end of file diff --git a/contact.html b/contact.html new file mode 100644 index 0000000..d3297a0 --- /dev/null +++ b/contact.html @@ -0,0 +1,64 @@ + + + + + Contact Us - WillowMeCreations + + + + + + + +
+
+ + +
+
+ +
+
+
+

Hello from WillowMeCreations!

+

We're thrilled that you're considering reaching out to us. Your inquiries, thoughts, and shared + enthusiasm for the world of yarn mean a lot to us. Whether you're seeking advice on the perfect yarn + for your next project, have a custom order in mind, or just want to share your crafting experiences, + we're here for it all. Feel free to drop us a message using the form below or connect with us + through our social media channels. Let's weave a thread of creativity and conversation together at + WillowMeCreations – where every message is a stitch in our community's vibrant tapestry.

+

Contact Information

+

Email: bethany@willowmecreations.com
TikTok: + bethanyrhodes6

+
+
+
+ + + + + + + \ No newline at end of file diff --git a/img/hero1.jpg b/img/hero1.jpg new file mode 100644 index 0000000..857c1dd Binary files /dev/null and b/img/hero1.jpg differ diff --git a/img/hero2.jpg b/img/hero2.jpg new file mode 100644 index 0000000..13b175f Binary files /dev/null and b/img/hero2.jpg differ diff --git a/img/hero3.jpg b/img/hero3.jpg new file mode 100644 index 0000000..ad8b36a Binary files /dev/null and b/img/hero3.jpg differ diff --git a/img/hero4.jpg b/img/hero4.jpg new file mode 100644 index 0000000..a11892f Binary files /dev/null and b/img/hero4.jpg differ diff --git a/img/logo.png b/img/logo.png new file mode 100644 index 0000000..8839bb5 Binary files /dev/null and b/img/logo.png differ diff --git a/img/product1.jpg b/img/product1.jpg new file mode 100644 index 0000000..857c1dd Binary files /dev/null and b/img/product1.jpg differ diff --git a/img/product1.png b/img/product1.png new file mode 100644 index 0000000..3d9c584 Binary files /dev/null and b/img/product1.png differ diff --git a/img/product2.png b/img/product2.png new file mode 100644 index 0000000..8d539eb Binary files /dev/null and b/img/product2.png differ diff --git a/img/product3.png b/img/product3.png new file mode 100644 index 0000000..f505f08 Binary files /dev/null and b/img/product3.png differ diff --git a/img/productpage3.jpg b/img/productpage3.jpg new file mode 100644 index 0000000..ad8b36a Binary files /dev/null and b/img/productpage3.jpg differ diff --git a/index.html b/index.html new file mode 100644 index 0000000..5436d76 --- /dev/null +++ b/index.html @@ -0,0 +1,121 @@ + + + + + Home - Willow Me Creations + + + + + + + +
+
+ + +
+
+ +
+
+
+
+
+ Hero Image 1 +
+

Welcome to Willow Me Creations

+

Beautifully hand-crafted crochet items made with love in Indiana.

+ Shop Now +
+
+
+ Hero Image 2 +
+

Handmade with Love

+

Each piece is crafted with care and attention to detail.

+ Shop Now +
+
+
+ Hero Image 3 +
+

Unique Designs

+

Discover our exclusive collection of crochet items.

+ Shop Now +
+
+
+ + +
+
+ +
+
+

About Us

+

Willow Me Creations is a small business that makes handmade clothing and wearables. Located in the + beautiful Midwest, we take pride in creating unique, high-quality crochet items. Each piece is + crafted with care and attention to detail.

+
+
+ +
+
+

Our Products

+
+
+ Product 1 +

Greyscale Hexie

+

Soft and warm, perfect for chilly days.

+
+
+ Product 2 +

Flower Crop Top

+

Add a touch of elegance to any outfit.

+
+
+ Product 3 +

Neon Rainbow Hexie

+

Shit is bright, son.

+
+
+ View All Products +
+
+ +
+
+

Contact Us

+

Have questions or special requests? Reach out to us!

+ Email Us +
+
+
+ + + + + + + \ No newline at end of file diff --git a/news.html b/news.html new file mode 100644 index 0000000..9823038 --- /dev/null +++ b/news.html @@ -0,0 +1,91 @@ + + + + + News - WillowMeCreations + + + + + + + +
+
+ + +
+
+ +
+
+
+

News

+
Latest News
+ summer crochet +

Greetings, fellow yarn enthusiasts!

+

We're excited to share some delightful updates from the sunny world of WillowMeCreations.

+ +

1. New Summer Collection Unveiled!

+

Get ready to embrace the warmth of summer with our latest collection of hand-crocheted wonders. From + lightweight and breezy tops to colorful and fun accessories, our artisans have been working + tirelessly to bring you a spectrum of vibrant colors and textures. Dive into our online store to + discover the perfect piece that will add a touch of handmade charm to your summer wardrobe.

+ +

2. Custom Beachwear Orders Now Open

+

Did you know that at WillowMeCreations, we love turning your creative visions into reality? We're + delighted to announce that our custom order slots are now open for summer beachwear! Whether it's a + personalized swimsuit cover-up, a unique sunhat, or a special gift for a loved one, let us bring + your crochet dreams to life. Contact us today, and let the summer crafting adventure begin.

+ +

3. Summer Yarn Workshops Coming Soon

+

Calling all crochet enthusiasts and beginners alike! We're brewing up something special for you. In + the upcoming months, WillowMeCreations will be hosting a series of interactive summer yarn + workshops. Join us for a hands-on experience where you can learn new stitches, explore summer color + palettes, and share the joy of creating with fellow yarn lovers. Stay tuned for more details on how + you can be a part of this sunny community gathering.

+ +

4. Featured Product of the Month

+

This month, we're shining the spotlight on our colorful summer tote bag. Perfect for adding a touch + of handmade elegance to your beach outings, this hand-crocheted masterpiece is now available in a + variety of bright and cheerful colors. Treat yourself or surprise someone special with this + functional and stylish accessory. Visit our 'Products' page to explore this month's featured item. +

+ +

Thank you for being a part of the WillowMeCreations family. Your support fuels our passion for + crafting and creativity. Keep an eye on our website and social media for more updates, events, and + delightful summer yarny surprises!

+ + Warm regards, + Bethany +
+
+
+ + + + + + + \ No newline at end of file diff --git a/privacy.html b/privacy.html new file mode 100644 index 0000000..307b9c7 --- /dev/null +++ b/privacy.html @@ -0,0 +1,118 @@ + + + + Contact Us - WillowMeCreations + + + + + + +
+
+ + + +
+
+ Home + About + News + Products + Contact +
+ +
+
+

Welcome to WillowMeCreations! At WillowMeCreations, we are committed to protecting your privacy and ensuring the security of your personal information. This Privacy Policy outlines how we collect, use, and safeguard your data when you interact with our website or engage with our products and services.

+ +

Information We Collect:

+ +
    +
  1. + Personal Information: +

    When you place an order or register on our website, we collect personal information such as your name, email address, shipping address, and contact details to process your order and provide customer support.

    +
    2. + +
  2. + Payment Information: +

    WillowMeCreations does not directly process payments. Payments are securely processed through third-party payment processors, and we do not store your credit card details.

    +
    3. + +
  3. + Communications: +

    If you contact us via email or through our website, we may retain the content of your communication, including your email address, to respond to your inquiries and provide assistance.

    +
    4. +
+ +

How We Use Your Information:

+ +
    +
  1. + Order Fulfillment: +

    We use your personal information to process and fulfill your orders, including shipping and delivery.

    +
    2. + +
  2. + Communication: +

    We may use your contact information to communicate with you about your orders, provide updates on our products and services, and respond to your inquiries.

    +
    3. + +
  3. + Marketing: +

    With your consent, we may send you marketing communications, such as newsletters and promotional offers. You can opt-out of these communications at any time.

    +
    4. +
+ +

Data Security:

+ +

We implement reasonable security measures to protect the confidentiality and integrity of your personal information. However, please be aware that no method of transmission over the internet or electronic storage is completely secure, and we cannot guarantee absolute security.

+ +

Your Choices:

+ +

You have the right to access, correct, or delete your personal information. You can also opt-out of marketing communications by following the instructions provided in the communication.

+ +

Changes to this Privacy Policy:

+ +

We may update this Privacy Policy from time to time to reflect changes in our practices. The revised policy will be effective immediately upon posting on our website.

+ +

Contact Us:

+ +

If you have any questions about our Privacy Policy, please contact us.

+
+
+
+

Email: bethany@willowmecreations.com

+
+ + + +
+

Quick Links

+

+ Home | + About | + Products | + Contact +

+
+ +
+

Privacy Policy

+

Read our privacy policy

+
+ +
+

© 2024 Willow Me Creations

+
+
+ + + \ No newline at end of file diff --git a/products.html b/products.html new file mode 100644 index 0000000..a54d0b4 --- /dev/null +++ b/products.html @@ -0,0 +1,74 @@ + + + + + Products - WillowMeCreations + + + + + + + +
+
+ + +
+
+ +
+
+
+

Products

+
+
+ Sweater 1 +

Sweater 1

+

Price: $80

+ +
+
+ Sweater 2 +

Flower Crop Top

+

Price: $90

+ +
+
+ Sweater 3 +

Sweater 3

+

Price: $105

+ +
+
+
+
+
+ + + + + + + \ No newline at end of file diff --git a/script.js b/script.js new file mode 100644 index 0000000..22285a4 --- /dev/null +++ b/script.js @@ -0,0 +1,31 @@ +let currentIndex = 0; +let slides = document.getElementsByClassName("carousel-item"); +let totalSlides = slides.length; + +function showSlides() { + for (let i = 0; i < totalSlides; i++) { + slides[i].classList.remove("active"); + } + currentIndex++; + if (currentIndex >= totalSlides) { + currentIndex = 0; + } + slides[currentIndex].classList.add("active"); + setTimeout(showSlides, 3000); // Change image every 3 seconds +} + +function moveSlides(n) { + currentIndex += n; + if (currentIndex >= totalSlides) { + currentIndex = 0; + } else if (currentIndex < 0) { + currentIndex = totalSlides - 1; + } + for (let i = 0; i < totalSlides; i++) { + slides[i].classList.remove("active"); + } + slides[currentIndex].classList.add("active"); +} + +// Initial call to start the slideshow +showSlides(); diff --git a/style.css b/style.css new file mode 100644 index 0000000..48fb8f8 --- /dev/null +++ b/style.css @@ -0,0 +1,418 @@ +body { + font-family: 'Montserrat', sans-serif; + color: #333; + margin: 0; + padding: 0; + box-sizing: border-box; + background-color: #FAF3E0; + /* Warm, cozy background color */ +} + +header { + background-color: #333; + color: #fff; + padding: 20px 0; +} + +.container { + width: 90%; + max-width: 1200px; + margin: 0 auto; +} + +.logo img { + width: 150px; +} + +.topnav { + text-align: center; +} + +.topnav a { + color: #fff; + margin: 0 15px; + text-decoration: none; + font-weight: 700; +} + +.topnav a:hover { + color: #FFD700; +} + +.products { + padding: 60px 0; + text-align: center; +} + +.products h2 { + font-family: 'Playfair Display', serif; + font-size: 2.5em; + margin-bottom: 20px; +} + +.product-grid { + display: flex; + justify-content: center; + gap: 20px; + flex-wrap: wrap; +} + +.product-card { + background-color: #fff; + padding: 20px; + border-radius: 10px; + box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1); + width: calc(33.333% - 20px); + margin-bottom: 20px; +} + +.product-card img { + width: 100%; + border-radius: 10px; + margin-bottom: 15px; +} + +.product-card h3 { + font-size: 1.5em; + margin-bottom: 10px; +} + +.product-card p { + font-size: 1em; +} + +.product-card button { + background-color: #333; + color: #fff; + padding: 10px 20px; + text-decoration: none; + font-weight: bold; + border-radius: 5px; + border: none; + cursor: pointer; +} + +.product-card button:hover { + background-color: #FFD700; + color: #333; +} + +.hero { + position: relative; + overflow: hidden; + text-align: center; + height: 60vh; + /* Adjust height as needed */ +} + +.carousel { + position: relative; + height: 100%; +} + +.carousel-inner { + display: flex; + transition: transform 0.5s ease-in-out; + height: 100%; +} + +.carousel-item { + position: absolute; + opacity: 0; + transition: opacity 1s ease-in-out; + /* Smooth fade effect */ + width: 100%; + height: 100%; + box-sizing: border-box; +} + +.carousel-item.active { + opacity: 1; + position: relative; +} + +.carousel-item img { + width: 100%; + height: 100%; + object-fit: cover; + /* Ensure images cover the container without distortion */ +} + +.carousel-caption { + position: absolute; + bottom: 20%; + left: 50%; + transform: translateX(-50%); + color: #fff; + text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.5); + background: rgba(0, 0, 0, 0.5); + /* Semi-transparent background for better readability */ + padding: 20px; + border-radius: 10px; + max-width: 90%; + /* Ensure the caption doesn't overflow */ + text-align: center; +} + +.carousel-caption h1 { + font-family: 'Playfair Display', serif; + font-size: 3em; + margin-bottom: 20px; +} + +.carousel-caption p { + font-size: 1.2em; + margin-bottom: 20px; +} + +.carousel-caption .btn { + background-color: #FFD700; + color: #333; + padding: 10px 20px; + text-decoration: none; + font-weight: bold; + border-radius: 5px; +} + +.prev, +.next { + position: absolute; + top: 50%; + transform: translateY(-50%); + color: #fff; + font-size: 2em; + cursor: pointer; + padding: 16px; + margin-top: -22px; + user-select: none; +} + +.prev { + left: 10px; +} + +.next { + right: 10px; +} + +.prev:hover, +.next:hover { + background-color: rgba(0, 0, 0, 0.8); +} + +.about, +.products, +.contact { + padding: 60px 0; + text-align: center; +} + +.about h2, +.products h2, +.contact h2 { + font-family: 'Playfair Display', serif; + font-size: 2.5em; + margin-bottom: 20px; +} + +.about p, +.products p, +.contact p { + font-size: 1.1em; + line-height: 1.8; + margin-bottom: 20px; + max-width: 800px; + margin-left: auto; + margin-right: auto; +} + +.product-grid { + display: flex; + justify-content: center; + gap: 20px; + flex-wrap: wrap; +} + +.product-card { + background-color: #fff; + padding: 20px; + border-radius: 10px; + box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1); + width: calc(33.333% - 20px); + margin-bottom: 20px; +} + +.product-card img { + width: 100%; + border-radius: 10px; + margin-bottom: 15px; +} + +.product-card h3 { + font-size: 1.5em; + margin-bottom: 10px; +} + +.product-card p { + font-size: 1em; +} + +.productbtn { + background-color: #333; + color: #fff; + padding: 10px 20px; + text-decoration: none; + font-weight: bold; + border-radius: 5px; +} + +.contact .btn { + background-color: #333; + color: #fff; + padding: 10px 20px; + text-decoration: none; + font-weight: bold; + border-radius: 5px; +} + +.news { + padding: 60px 0; + text-align: center; +} + +.news h2, .news h3 { + font-family: 'Playfair Display', serif; +} + +.news h2 { + font-size: 2.5em; + margin-bottom: 20px; +} + +.news h3 { + font-size: 1.8em; + margin-bottom: 15px; +} + +.news p { + font-size: 1.1em; + line-height: 1.8; + margin-bottom: 20px; + max-width: 800px; + margin-left: auto; + margin-right: auto; +} + +.news img { + width: 100%; + border-radius: 10px; + margin-bottom: 20px; +} + +.footer { + background-color: #333; + color: #fff; + padding: 20px 0; + text-align: center; +} + +.footer .social-media a { + color: #FFD700; + margin: 0 10px; + font-size: 1.5em; + text-decoration: none; +} + +.footer .social-media a:hover { + color: #fff; +} + +/* Media Queries for Responsiveness */ + +@media (max-width: 768px) { + .product-card { + width: calc(50% - 20px); + } + + .products p { + font-size: 1em; + max-width: 90%; + } +} + +@media (max-width: 480px) { + .product-card { + width: calc(100% - 20px); + } + + .products p { + font-size: 0.9em; + max-width: 90%; + } +} + +@media (max-width: 768px) { + .news p { + font-size: 1em; + max-width: 90%; + } +} + +@media (max-width: 480px) { + .news p { + font-size: 0.9em; + max-width: 90%; + } +} + +@media (max-width: 768px) { + .hero { + height: 40vh; + /* Adjust height for smaller screens */ + } + + .carousel-caption h1 { + font-size: 2em; + } + + .carousel-caption p { + font-size: 1em; + } + + .prev, + .next { + font-size: 1.5em; + } + + .about p { + font-size: 1em; + max-width: 90%; + } +} + +@media (max-width: 480px) { + .hero { + height: 30vh; + /* Adjust height for smaller screens */ + } + + .carousel-caption h1 { + font-size: 1.5em; + } + + .carousel-caption p { + font-size: 0.8em; + } + + .prev, + .next { + font-size: 1.2em; + } + + .about p { + font-size: 0.9em; + max-width: 90%; + } +} + +/* I fucking hate css */ \ No newline at end of file