Hugging Face's logo

Spaces:
Jerevas-1
/
Farming-sales
Running

App Files Community
Jerevas-1 commited on
Commit
e82304a
·
verified ·
1 Parent(s): 7dd3415

Add 3 files

Browse files
Files changed (3) hide show
  1. README.md +7 -5
  2. index.html +258 -19
  3. prompts.txt +1 -0
README.md CHANGED
@@ -1,10 +1,12 @@
1
  ---
2
- title: Farmers Produce Sales
3
- emoji: 🔥
4
- colorFrom: purple
5
- colorTo: green
6
  sdk: static
7
  pinned: false
 
 
8
  ---
9
 
10
- Check out the configuration reference at https://huggingface.co/docs/hub/spaces-config-reference
 
1
  ---
2
+ title: farmers-produce-sales
3
+ emoji: 🐳
4
+ colorFrom: red
5
+ colorTo: gray
6
  sdk: static
7
  pinned: false
8
+ tags:
9
+ - deepsite
10
  ---
11
 
12
+ Check out the configuration reference at https://huggingface.co/docs/hub/spaces-config-reference
index.html CHANGED
@@ -1,19 +1,258 @@
1
- <!doctype html>
2
- <html>
3
- <head>
4
- <meta charset="utf-8" />
5
- <meta name="viewport" content="width=device-width" />
6
- <title>My static Space</title>
7
- <link rel="stylesheet" href="style.css" />
8
- </head>
9
- <body>
10
- <div class="card">
11
- <h1>Welcome to your static Space!</h1>
12
- <p>You can modify this app directly by editing <i>index.html</i> in the Files and versions tab.</p>
13
- <p>
14
- Also don't forget to check the
15
- <a href="https://huggingface.co/docs/hub/spaces" target="_blank">Spaces documentation</a>.
16
- </p>
17
- </div>
18
- </body>
19
- </html>
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
1
+ <!DOCTYPE html>
2
+ <html lang="en">
3
+ <head>
4
+ <meta charset="UTF-8">
5
+ <meta name="viewport" content="width=device-width, initial-scale=1.0">
6
+ <title>FreshHarvest - Farm Produce Marketplace</title>
7
+ <script src="https://cdn.tailwindcss.com"></script>
8
+ <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css">
9
+ <style>
10
+ /* Custom CSS for elements that need more styling than Tailwind provides */
11
+ .hero-section {
12
+ background: linear-gradient(rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.5)), url('https://images.unsplash.com/photo-1500382017468-9049fed747ef?ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D&auto=format&fit=crop&w=1470&q=80');
13
+ background-size: cover;
14
+ background-position: center;
15
+ height: 80vh;
16
+ }
17
+
18
+ .product-card:hover {
19
+ transform: translateY(-5px);
20
+ box-shadow: 0 10px 20px rgba(0, 0, 0, 0.1);
21
+ }
22
+
23
+ .category-btn.active {
24
+ background-color: #4CAF50;
25
+ color: white;
26
+ }
27
+
28
+ @keyframes fadeIn {
29
+ from { opacity: 0; }
30
+ to { opacity: 1; }
31
+ }
32
+
33
+ .fade-in {
34
+ animation: fadeIn 0.5s ease-in;
35
+ }
36
+ </style>
37
+ </head>
38
+ <body class="font-sans bg-gray-50">
39
+ <!-- Navigation -->
40
+ <nav class="bg-white shadow-md sticky top-0 z-50">
41
+ <div class="container mx-auto px-4 py-3 flex justify-between items-center">
42
+ <div class="flex items-center space-x-2">
43
+ <i class="fas fa-leaf text-green-600 text-2xl"></i>
44
+ <a href="#" class="text-xl font-bold text-green-700">FreshHarvest</a>
45
+ </div>
46
+
47
+ <div class="hidden md:flex space-x-6">
48
+ <a href="#home" class="text-gray-700 hover:text-green-600">Home</a>
49
+ <a href="#products" class="text-gray-700 hover:text-green-600">Products</a>
50
+ <a href="#farmers" class="text-gray-700 hover:text-green-600">Our Farmers</a>
51
+ <a href="#about" class="text-gray-700 hover:text-green-600">About</a>
52
+ <a href="#contact" class="text-gray-700 hover:text-green-600">Contact</a>
53
+ </div>
54
+
55
+ <div class="flex items-center space-x-4">
56
+ <a href="#" class="relative">
57
+ <i class="fas fa-shopping-cart text-gray-700 text-xl"></i>
58
+ <span class="absolute -top-2 -right-2 bg-green-600 text-white text-xs rounded-full h-5 w-5 flex items-center justify-center" id="cart-count">0</span>
59
+ </a>
60
+ <button class="md:hidden text-gray-700" id="mobile-menu-button">
61
+ <i class="fas fa-bars text-xl"></i>
62
+ </button>
63
+ </div>
64
+ </div>
65
+
66
+ <!-- Mobile Menu -->
67
+ <div class="md:hidden hidden bg-white py-2 px-4 shadow-lg" id="mobile-menu">
68
+ <a href="#home" class="block py-2 text-gray-700 hover:text-green-600">Home</a>
69
+ <a href="#products" class="block py-2 text-gray-700 hover:text-green-600">Products</a>
70
+ <a href="#farmers" class="block py-2 text-gray-700 hover:text-green-600">Our Farmers</a>
71
+ <a href="#about" class="block py-2 text-gray-700 hover:text-green-600">About</a>
72
+ <a href="#contact" class="block py-2 text-gray-700 hover:text-green-600">Contact</a>
73
+ </div>
74
+ </nav>
75
+
76
+ <!-- Hero Section -->
77
+ <section class="hero-section flex items-center justify-center text-white" id="home">
78
+ <div class="text-center px-4">
79
+ <h1 class="text-4xl md:text-6xl font-bold mb-4">Fresh From Farm To Your Table</h1>
80
+ <p class="text-xl md:text-2xl mb-8">Directly sourced from local farmers for the freshest quality</p>
81
+ <a href="#products" class="bg-green-600 hover:bg-green-700 text-white font-bold py-3 px-8 rounded-full text-lg transition duration-300 inline-block">Shop Now</a>
82
+ </div>
83
+ </section>
84
+
85
+ <!-- Features Section -->
86
+ <section class="py-16 bg-white">
87
+ <div class="container mx-auto px-4">
88
+ <div class="grid grid-cols-1 md:grid-cols-3 gap-8">
89
+ <div class="text-center p-6 rounded-lg hover:bg-gray-50 transition duration-300">
90
+ <div class="bg-green-100 w-16 h-16 mx-auto rounded-full flex items-center justify-center mb-4">
91
+ <i class="fas fa-truck text-green-600 text-2xl"></i>
92
+ </div>
93
+ <h3 class="text-xl font-bold mb-2">Fast Delivery</h3>
94
+ <p class="text-gray-600">Get your fresh produce delivered within 24 hours of harvest</p>
95
+ </div>
96
+
97
+ <div class="text-center p-6 rounded-lg hover:bg-gray-50 transition duration-300">
98
+ <div class="bg-green-100 w-16 h-16 mx-auto rounded-full flex items-center justify-center mb-4">
99
+ <i class="fas fa-seedling text-green-600 text-2xl"></i>
100
+ </div>
101
+ <h3 class="text-xl font-bold mb-2">Organic Certified</h3>
102
+ <p class="text-gray-600">100% organic produce with no harmful chemicals</p>
103
+ </div>
104
+
105
+ <div class="text-center p-6 rounded-lg hover:bg-gray-50 transition duration-300">
106
+ <div class="bg-green-100 w-16 h-16 mx-auto rounded-full flex items-center justify-center mb-4">
107
+ <i class="fas fa-hand-holding-usd text-green-600 text-2xl"></i>
108
+ </div>
109
+ <h3 class="text-xl font-bold mb-2">Fair Prices</h3>
110
+ <p class="text-gray-600">Direct from farm means better prices for you and fair wages for farmers</p>
111
+ </div>
112
+ </div>
113
+ </div>
114
+ </section>
115
+
116
+ <!-- Products Section -->
117
+ <section class="py-16 bg-gray-50" id="products">
118
+ <div class="container mx-auto px-4">
119
+ <h2 class="text-3xl font-bold text-center mb-12">Our Fresh Produce</h2>
120
+
121
+ <!-- Category Filter -->
122
+ <div class="flex flex-wrap justify-center gap-3 mb-8">
123
+ <button class="category-btn active px-4 py-2 rounded-full bg-gray-200 hover:bg-green-600 hover:text-white transition" data-category="all">All</button>
124
+ <button class="category-btn px-4 py-2 rounded-full bg-gray-200 hover:bg-green-600 hover:text-white transition" data-category="vegetables">Vegetables</button>
125
+ <button class="category-btn px-4 py-2 rounded-full bg-gray-200 hover:bg-green-600 hover:text-white transition" data-category="fruits">Fruits</button>
126
+ <button class="category-btn px-4 py-2 rounded-full bg-gray-200 hover:bg-green-600 hover:text-white transition" data-category="dairy">Dairy</button>
127
+ <button class="category-btn px-4 py-2 rounded-full bg-gray-200 hover:bg-green-600 hover:text-white transition" data-category="grains">Grains</button>
128
+ </div>
129
+
130
+ <!-- Products Grid -->
131
+ <div class="grid grid-cols-1 sm:grid-cols-2 md:grid-cols-3 lg:grid-cols-4 gap-8" id="products-container">
132
+ <!-- Products will be loaded here via JavaScript -->
133
+ </div>
134
+ </div>
135
+ </section>
136
+
137
+ <!-- Farmers Section -->
138
+ <section class="py-16 bg-white" id="farmers">
139
+ <div class="container mx-auto px-4">
140
+ <h2 class="text-3xl font-bold text-center mb-12">Meet Our Farmers</h2>
141
+
142
+ <div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-8">
143
+ <div class="bg-gray-50 rounded-lg overflow-hidden shadow-md hover:shadow-lg transition duration-300">
144
+ <img src="https://images.unsplash.com/photo-1605244863941-5fbdf0e689ce?ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D&auto=format&fit=crop&w=1470&q=80" alt="Farmer John" class="w-full h-64 object-cover">
145
+ <div class="p-6">
146
+ <h3 class="text-xl font-bold mb-2">John Peterson</h3>
147
+ <p class="text-gray-600 mb-4">Organic Vegetable Farmer</p>
148
+ <p class="text-gray-700">"I've been growing vegetables for over 20 years using sustainable methods that protect the land for future generations."</p>
149
+ </div>
150
+ </div>
151
+
152
+ <div class="bg-gray-50 rounded-lg overflow-hidden shadow-md hover:shadow-lg transition duration-300">
153
+ <img src="https://images.unsplash.com/photo-1586771107445-d3ca888129ce?ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D&auto=format&fit=crop&w=1470&q=80" alt="Farmer Maria" class="w-full h-64 object-cover">
154
+ <div class="p-6">
155
+ <h3 class="text-xl font-bold mb-2">Maria Gonzalez</h3>
156
+ <p class="text-gray-600 mb-4">Fruit Orchard Owner</p>
157
+ <p class="text-gray-700">"Our family orchard has been producing the finest fruits for three generations. We take pride in every piece of fruit we grow."</p>
158
+ </div>
159
+ </div>
160
+
161
+ <div class="bg-gray-50 rounded-lg overflow-hidden shadow-md hover:shadow-lg transition duration-300">
162
+ <img src="https://images.unsplash.com/photo-1560253023-3ec5d502959f?ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D&auto=format&fit=crop&w=1470&q=80" alt="Farmer Robert" class="w-full h-64 object-cover">
163
+ <div class="p-6">
164
+ <h3 class="text-xl font-bold mb-2">Robert Johnson</h3>
165
+ <p class="text-gray-600 mb-4">Dairy Farmer</p>
166
+ <p class="text-gray-700">"Our cows are pasture-raised and grass-fed, producing milk that's rich in nutrients and flavor."</p>
167
+ </div>
168
+ </div>
169
+ </div>
170
+ </div>
171
+ </section>
172
+
173
+ <!-- Testimonials -->
174
+ <section class="py-16 bg-green-700 text-white">
175
+ <div class="container mx-auto px-4">
176
+ <h2 class="text-3xl font-bold text-center mb-12">What Our Customers Say</h2>
177
+
178
+ <div class="grid grid-cols-1 md:grid-cols-3 gap-8">
179
+ <div class="bg-green-800 p-6 rounded-lg">
180
+ <div class="flex items-center mb-4">
181
+ <img src="https://randomuser.me/api/portraits/women/32.jpg" alt="Customer" class="w-12 h-12 rounded-full mr-4">
182
+ <div>
183
+ <h4 class="font-bold">Sarah Johnson</h4>
184
+ <div class="flex text-yellow-400">
185
+ <i class="fas fa-star"></i>
186
+ <i class="fas fa-star"></i>
187
+ <i class="fas fa-star"></i>
188
+ <i class="fas fa-star"></i>
189
+ <i class="fas fa-star"></i>
190
+ </div>
191
+ </div>
192
+ </div>
193
+ <p>"The vegetables are so fresh and flavorful! I can really taste the difference compared to supermarket produce."</p>
194
+ </div>
195
+
196
+ <div class="bg-green-800 p-6 rounded-lg">
197
+ <div class="flex items-center mb-4">
198
+ <img src="https://randomuser.me/api/portraits/men/45.jpg" alt="Customer" class="w-12 h-12 rounded-full mr-4">
199
+ <div>
200
+ <h4 class="font-bold">Michael Chen</h4>
201
+ <div class="flex text-yellow-400">
202
+ <i class="fas fa-star"></i>
203
+ <i class="fas fa-star"></i>
204
+ <i class="fas fa-star"></i>
205
+ <i class="fas fa-star"></i>
206
+ <i class="fas fa-star"></i>
207
+ </div>
208
+ </div>
209
+ </div>
210
+ <p>"I love knowing exactly where my food comes from and that I'm supporting local farmers directly."</p>
211
+ </div>
212
+
213
+ <div class="bg-green-800 p-6 rounded-lg">
214
+ <div class="flex items-center mb-4">
215
+ <img src="https://randomuser.me/api/portraits/women/68.jpg" alt="Customer" class="w-12 h-12 rounded-full mr-4">
216
+ <div>
217
+ <h4 class="font-bold">Emily Rodriguez</h4>
218
+ <div class="flex text-yellow-400">
219
+ <i class="fas fa-star"></i>
220
+ <i class="fas fa-star"></i>
221
+ <i class="fas fa-star"></i>
222
+ <i class="fas fa-star"></i>
223
+ <i class="fas fa-star-half-alt"></i>
224
+ </div>
225
+ </div>
226
+ </div>
227
+ <p>"The milk from Robert's farm is the best I've ever tasted. My kids won't drink any other milk now!"</p>
228
+ </div>
229
+ </div>
230
+ </div>
231
+ </section>
232
+
233
+ <!-- About Section -->
234
+ <section class="py-16 bg-white" id="about">
235
+ <div class="container mx-auto px-4">
236
+ <div class="flex flex-col md:flex-row items-center">
237
+ <div class="md:w-1/2 mb-8 md:mb-0 md:pr-8">
238
+ <img src="https://images.unsplash.com/photo-1586773860418-d37222d8fce3?ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D&auto=format&fit=crop&w=1473&q=80" alt="Farm" class="rounded-lg shadow-lg w-full">
239
+ </div>
240
+ <div class="md:w-1/2">
241
+ <h2 class="text-3xl font-bold mb-6">Our Story</h2>
242
+ <p class="text-gray-700 mb-4">FreshHarvest was founded in 2015 with a simple mission: to connect consumers directly with local farmers, eliminating middlemen and ensuring fair prices for both farmers and customers.</p>
243
+ <p class="text-gray-700 mb-4">We believe in sustainable agriculture that respects the land and produces food that's not only good for you but also tastes amazing. Our network of small family farms uses organic and regenerative farming practices.</p>
244
+ <p class="text-gray-700">Today, we deliver fresh produce to thousands of happy customers while supporting over 200 local farming families.</p>
245
+ </div>
246
+ </div>
247
+ </div>
248
+ </section>
249
+
250
+ <!-- Newsletter -->
251
+ <section class="py-16 bg-gray-100">
252
+ <div class="container mx-auto px-4 text-center">
253
+ <h2 class="text-3xl font-bold mb-4">Join Our Community</h2>
254
+ <p class="text-gray-700 mb-8 max-w-2xl mx-auto">Subscribe to our newsletter for seasonal recipes, farm updates, and exclusive offers.</p>
255
+
256
+ <form class="max-w-md mx-auto flex">
257
+ <input type="email" placeholder="Your email address" class="flex-grow px-4 py-3 rounded-l-lg border border-gray-300 focus:outline-none focus:ring-
258
+ </html>
prompts.txt ADDED
@@ -0,0 +1 @@
 
 
1
+ want a website for selling all farm produce