Hugging Face's logo

Spaces:
John2121
/
DGCchat
Running

App Files Community
John2121 commited on
Commit
032114f
·
1 Parent(s): 84d74f3

feat: replace all images with Facebook post embed in portfolio section

Browse files
Files changed (1) hide show
  1. index.html +40 -138
index.html CHANGED
@@ -1,6 +1,6 @@
1
-
2
  <!DOCTYPE html>
3
  <html lang="en">
 
4
  <head>
5
  <meta charset="UTF-8">
6
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
@@ -47,31 +47,32 @@
47
  }
48
  }
49
  </script>
50
- <style>
51
  .portfolio-grid {
52
  display: grid;
53
  grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
54
  gap: 1rem;
55
  padding: 1rem;
56
  }
57
-
58
  .portfolio-item {
59
  position: relative;
60
  overflow: hidden;
61
  border-radius: 0.75rem;
62
  box-shadow: 0 10px 25px -5px rgba(0, 0, 0, 0.3);
63
  }
64
-
65
  .portfolio-item img {
66
  width: 100%;
67
  height: 300px;
68
  object-fit: cover;
69
  transition: transform 0.3s ease;
70
  }
71
-
72
  .portfolio-item:hover img {
73
  transform: scale(1.05);
74
  }
 
75
  .portfolio-overlay {
76
  position: absolute;
77
  bottom: 0;
@@ -83,27 +84,31 @@
83
  transform: translateY(100%);
84
  transition: transform 0.3s ease;
85
  }
86
- .portfolio-item:hover .portfolio-overlay {
 
87
  transform: translateY(0);
88
  }
89
  </style>
90
  </head>
 
91
  <body class="font-body bg-gray-900 text-white min-h-screen">
92
  <!-- Header -->
93
  <header class="bg-green-900/80 backdrop-blur-sm border-b border-green-600/30 sticky top-0 z-50">
94
- <div class="container mx-auto px-4 py-4">
95
  <div class="flex justify-between items-center">
96
- <h1 class="text-2xl font-bold text-green-300">BuckRub Taxidermy - Central WI</h1>
97
- <div class="flex gap-4">
98
- <a href="tel:5551234567" class="bg-green-600 text-white px-6 py-3 rounded-lg font-bold hover:bg-green-500 transition-colors flex items-center gap-2">
 
99
  <i data-feather="phone"></i>
100
  Call
101
  </a>
102
- <a href="sms:5551234567" class="border-2 border-green-500 text-green-400 px-6 py-3 rounded-lg font-bold hover:bg-green-500 hover:text-white transition-colors flex items-center gap-2">
 
103
  <i data-feather="message-square"></i>
104
  Text
105
  </a>
106
- </div>
107
  </div>
108
  </div>
109
  </header>
@@ -112,129 +117,23 @@
112
  <div class="container mx-auto px-4 text-center">
113
  <h2 class="text-4xl md:text-6xl font-bold mb-6">Central Wisconsin's Premier Taxidermy</h2>
114
  <p class="text-xl md:text-2xl text-green-100 mb-8">Serving hunters and outdoorsmen throughout Central WI</p>
115
- <a href="quote-calculator.html" class="inline-block bg-green-600 text-white px-8 py-4 rounded-lg font-bold text-lg hover:bg-green-500 transition-colors">
 
116
  Get Instant Quote
117
  </a>
118
- </div>
119
  </section>
120
- <!-- Portfolio Grid -->
121
  <section class="py-12">
122
  <div class="container mx-auto px-4">
123
  <div class="portfolio-grid">
124
- <!-- Portfolio Items - Replace with your uploaded images -->
125
- <div class="portfolio-item">
126
- <img src="http://static.photos/nature/640x360/1" alt="Shoulder Mount Deer">
127
- <div class="portfolio-overlay">
128
- <h3 class="font-bold text-lg">Whitetail Deer - Shoulder Mount</h3>
129
- <p class="text-green-100">Central WI's most popular trophy mount</p>
130
- </div>
131
- </div>
132
- <div class="portfolio-item">
133
- <img src="http://static.photos/nature/640x360/2" alt="Full Body Bear">
134
- <div class="portfolio-overlay">
135
- <h3 class="font-bold text-lg">Black Bear - Full Body</h3>
136
- <p class="text-green-100">Northern WI bear hunting trophies</p>
137
- </div>
138
- </div>
139
- <div class="portfolio-item">
140
- <img src="http://static.photos/nature/640x360/3" alt="Elk Mount">
141
- <div class="portfolio-overlay">
142
- <h3 class="font-bold text-lg">Bull Elk - Shoulder Mount</h3>
143
- <p class="text-green-100">Western hunt memories preserved</p>
144
- </div>
145
- </div>
146
- <div class="portfolio-item">
147
- <img src="http://static.photos/nature/640x360/4" alt="Waterfowl">
148
- <div class="portfolio-overlay">
149
- <h3 class="font-bold text-lg">Mallard Duck - Flying Pose</h3>
150
- <p class="text-green-100">Central WI waterfowl hunting trophies</p>
151
- </div>
152
- </div>
153
- <div class="portfolio-item">
154
- <img src="http://static.photos/nature/640x360/5" alt="Fish Mount">
155
- <div class="portfolio-overlay">
156
- <h3 class="font-bold text-lg">Muskie - Trophy Fish Mount</h3>
157
- <p class="text-green-100">Northwoods muskie fishing memories</p>
158
- </div>
159
- </div>
160
- <div class="portfolio-item">
161
- <img src="http://static.photos/nature/640x360/6" alt="Turkey">
162
- <div class="portfolio-overlay">
163
- <h3 class="font-bold text-lg">Wild Turkey - Full Strut</h3>
164
- <p class="text-green-100">Spring turkey hunting success</p>
165
- </div>
166
- </div>
167
- <div class="portfolio-item">
168
- <img src="http://static.photos/nature/640x360/7" alt="European Mount">
169
- <div class="portfolio-overlay">
170
- <h3 class="font-bold text-lg">European Mount - Whitetail</h3>
171
- <p class="text-green-100">Clean, modern skull presentation</p>
172
- </div>
173
- </div>
174
- <div class="portfolio-item">
175
- <img src="http://static.photos/nature/640x360/8" alt="Ruffed Grouse">
176
- <div class="portfolio-overlay">
177
- <h3 class="font-bold text-lg">Ruffed Grouse - Habitat Mount</h3>
178
- <p class="text-green-100">Wisconsin's favorite upland game bird</p>
179
- </div>
180
- </div>
181
- <div class="portfolio-item">
182
- <img src="http://static.photos/nature/640x360/9" alt="Coyote">
183
- <div class="portfolio-overlay">
184
- <h3 class="font-bold text-lg">Coyote - Full Body</h3>
185
- <p class="text-green-100">Predator hunting trophies</p>
186
- </div>
187
- </div>
188
- <div class="portfolio-item">
189
- <img src="http://static.photos/nature/640x360/10" alt="Bobcat">
190
- <div class="portfolio-overlay">
191
- <h3 class="font-bold text-lg">Bobcat - Stalking Pose</h3>
192
- <p class="text-green-100">Northern WI predator mounts</p>
193
- </div>
194
- </div>
195
- <div class="portfolio-item">
196
- <img src="http://static.photos/nature/640x360/11" alt="Raccoon">
197
- <div class="portfolio-overlay">
198
- <h3 class="font-bold text-lg">Raccoon - Habitat Scene</h3>
199
- <p class="text-green-100">Small game and fur bearer mounts</p>
200
- </div>
201
- </div>
202
- <div class="portfolio-item">
203
- <img src="http://static.photos/nature/640x360/12" alt="Squirrel">
204
- <div class="portfolio-overlay">
205
- <h3 class="font-bold text-lg">Fox Squirrel - Natural Pose</h3>
206
- <p class="text-green-100">Small game hunting memories</p>
207
- </div>
208
- </div>
209
- <div class="portfolio-item">
210
- <img src="http://static.photos/nature/640x360/13" alt="Beaver">
211
- <div class="portfolio-overlay">
212
- <h3 class="font-bold text-lg">Beaver - Habitat Mount</h3>
213
- <p class="text-green-100">Wisconsin fur bearer specimens</p>
214
- </div>
215
- </div>
216
- <div class="portfolio-item">
217
- <img src="http://static.photos/nature/640x360/14" alt="Wood Duck">
218
- <div class="portfolio-overlay">
219
- <h3 class="font-bold text-lg">Wood Duck - Perching</h3>
220
- <p class="text-green-100">Beautiful waterfowl for display</p>
221
- </div>
222
- </div>
223
- <div class="portfolio-item">
224
- <img src="http://static.photos/nature/640x360/15" alt="Pheasant">
225
- <div class="portfolio-overlay">
226
- <h3 class="font-bold text-lg">Ring-necked Pheasant - Rooster</h3>
227
- <p class="text-green-100">Popular upland game bird mounts</p>
228
- </div>
229
- </div>
230
- <div class="portfolio-item">
231
- <img src="http://static.photos/nature/640x360/16" alt="Mount Restoration">
232
- <div class="portfolio-overlay">
233
- <h3 class="font-bold text-lg">Vintage Mount Restoration</h3>
234
- <p class="text-green-100">Restoring family heirlooms</p>
235
- </div>
236
- </div>
237
- </div>
238
  </div>
239
  </section>
240
  <!-- Call to Action -->
@@ -243,18 +142,21 @@
243
  <h2 class="text-3xl md:text-5xl font-bold mb-6">Serving Central Wisconsin Hunters</h2>
244
  <p class="text-lg text-green-100 mb-8">From Stevens Point to Wausau and throughout Central WI</p>
245
  <div class="flex flex-col sm:flex-row gap-4 justify-center">
246
- <a href="quote-calculator.html" class="bg-white text-green-700 px-8 py-4 rounded-lg font-bold text-lg hover:bg-green-50 transition-colors">
247
- Get Instant Quote
248
- </a>
249
- <a href="tel:5551234567" class="border-2 border-white text-white px-8 py-4 rounded-lg font-bold text-lg hover:bg-white hover:text-green-700 transition-colors">
250
- Call Now: (555) 123-4567
251
- </a>
252
- </div>
 
 
253
  </section>
254
- <script>
255
  document.addEventListener('DOMContentLoaded', () => {
256
  feather.replace();
257
  });
258
  </script>
259
  </body>
260
- </html>
 
 
 
1
  <!DOCTYPE html>
2
  <html lang="en">
3
+
4
  <head>
5
  <meta charset="UTF-8">
6
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
 
47
  }
48
  }
49
  </script>
50
+ <style>
51
  .portfolio-grid {
52
  display: grid;
53
  grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
54
  gap: 1rem;
55
  padding: 1rem;
56
  }
57
+
58
  .portfolio-item {
59
  position: relative;
60
  overflow: hidden;
61
  border-radius: 0.75rem;
62
  box-shadow: 0 10px 25px -5px rgba(0, 0, 0, 0.3);
63
  }
64
+
65
  .portfolio-item img {
66
  width: 100%;
67
  height: 300px;
68
  object-fit: cover;
69
  transition: transform 0.3s ease;
70
  }
71
+
72
  .portfolio-item:hover img {
73
  transform: scale(1.05);
74
  }
75
+
76
  .portfolio-overlay {
77
  position: absolute;
78
  bottom: 0;
 
84
  transform: translateY(100%);
85
  transition: transform 0.3s ease;
86
  }
87
+
88
+ .portfolio-item:hover .portfolio-overlay {
89
  transform: translateY(0);
90
  }
91
  </style>
92
  </head>
93
+
94
  <body class="font-body bg-gray-900 text-white min-h-screen">
95
  <!-- Header -->
96
  <header class="bg-green-900/80 backdrop-blur-sm border-b border-green-600/30 sticky top-0 z-50">
97
+ <div class="container mx-auto px-4 py-4">
98
  <div class="flex justify-between items-center">
99
+ <h1 class="text-2xl font-bold text-green-300">BuckRub Taxidermy - Central WI</h1>
100
+ <div class="flex gap-4">
101
+ <a href="tel:5551234567"
102
+ class="bg-green-600 text-white px-6 py-3 rounded-lg font-bold hover:bg-green-500 transition-colors flex items-center gap-2">
103
  <i data-feather="phone"></i>
104
  Call
105
  </a>
106
+ <a href="sms:5551234567"
107
+ class="border-2 border-green-500 text-green-400 px-6 py-3 rounded-lg font-bold hover:bg-green-500 hover:text-white transition-colors flex items-center gap-2">
108
  <i data-feather="message-square"></i>
109
  Text
110
  </a>
111
+ </div>
112
  </div>
113
  </div>
114
  </header>
 
117
  <div class="container mx-auto px-4 text-center">
118
  <h2 class="text-4xl md:text-6xl font-bold mb-6">Central Wisconsin's Premier Taxidermy</h2>
119
  <p class="text-xl md:text-2xl text-green-100 mb-8">Serving hunters and outdoorsmen throughout Central WI</p>
120
+ <a href="quote-calculator.html"
121
+ class="inline-block bg-green-600 text-white px-8 py-4 rounded-lg font-bold text-lg hover:bg-green-500 transition-colors">
122
  Get Instant Quote
123
  </a>
124
+ </div>
125
  </section>
126
+ <!-- Portfolio Grid -->
127
  <section class="py-12">
128
  <div class="container mx-auto px-4">
129
  <div class="portfolio-grid">
130
+ <!-- Facebook Post Embed -->
131
+ <iframe
132
+ src="https://www.facebook.com/plugins/post.php?href=https%3A%2F%2Fwww.facebook.com%2Fjohn.dondlinger.1%2Fposts%2Fpfbid021DDdwEk8NvvhF9ZHUw1VUeBM2CL8bzVnWovjL1fj6ZCguwCbCpTRRNGpVtQLZy98l&show_text=true&width=500"
133
+ width="500" height="692" style="border:none;overflow:hidden" scrolling="no" frameborder="0"
134
+ allowfullscreen="true"
135
+ allow="autoplay; clipboard-write; encrypted-media; picture-in-picture; web-share"></iframe>
136
+ </div>
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
137
  </div>
138
  </section>
139
  <!-- Call to Action -->
 
142
  <h2 class="text-3xl md:text-5xl font-bold mb-6">Serving Central Wisconsin Hunters</h2>
143
  <p class="text-lg text-green-100 mb-8">From Stevens Point to Wausau and throughout Central WI</p>
144
  <div class="flex flex-col sm:flex-row gap-4 justify-center">
145
+ <a href="quote-calculator.html"
146
+ class="bg-white text-green-700 px-8 py-4 rounded-lg font-bold text-lg hover:bg-green-50 transition-colors">
147
+ Get Instant Quote
148
+ </a>
149
+ <a href="tel:5551234567"
150
+ class="border-2 border-white text-white px-8 py-4 rounded-lg font-bold text-lg hover:bg-white hover:text-green-700 transition-colors">
151
+ Call Now: (555) 123-4567
152
+ </a>
153
+ </div>
154
  </section>
155
+ <script>
156
  document.addEventListener('DOMContentLoaded', () => {
157
  feather.replace();
158
  });
159
  </script>
160
  </body>
161
+
162
+ </html>