Skip to content
This repository was archived by the owner on Nov 14, 2025. It is now read-only.

Commit f22b957

Browse files
AlphaGameDeveloperAlphaGameDeveloper
committed
feat: Add testimonial & open-source
1 parent 99f0d15 commit f22b957

File tree

1 file changed

+187
-2
lines changed

1 file changed

+187
-2
lines changed

‎www/index.html‎

Lines changed: 187 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -151,7 +151,162 @@ <h2 class="text-3xl md:text-4xl font-bold mb-16 text-center">Popular Commands</h
151151
</div>
152152
</section>
153153

154-
<!-- FAQ Section - Will be revealed on scroll -->
154+
<!-- Open Source Section - Redesigned -->
155+
<section id="open-source" class="relative py-24 overflow-hidden reveal-on-scroll">
156+
<!-- Background design elements -->
157+
<div class="absolute inset-0 bg-gradient-to-br from-gray-900 to-gray-800 z-0"></div>
158+
<div class="absolute top-0 left-0 w-full h-full overflow-hidden z-0">
159+
<div class="absolute -top-10 -left-10 w-64 h-64 bg-blue-500 rounded-full opacity-10 blur-3xl"></div>
160+
<div class="absolute top-1/3 -right-20 w-80 h-80 bg-purple-500 rounded-full opacity-10 blur-3xl"></div>
161+
</div>
162+
163+
<!-- Grid pattern overlay -->
164+
<div class="absolute inset-0 bg-[url('data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iNjAiIGhlaWdodD0iNjAiIHZpZXdCb3g9IjAgMCA2MCA2MCIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj48ZyBmaWxsPSJub25lIiBmaWxsLXJ1bGU9ImV2ZW5vZGQiPjxwYXRoIGQ9Ik0wIDBoNjB2NjBIMHoiLz48cGF0aCBkPSJNMzAgMzBoMzB2MzBIMzB6TTAgMzBoMzB2MzBIMHoiIGZpbGw9IiMyMDIwMjAiIGZpbGwtb3BhY2l0eT0iLjA1Ii8+PC9nPjwvc3ZnPg==')]"></div>
165+
166+
<!-- Content container -->
167+
<div class="container mx-auto px-6 relative z-10">
168+
<!-- Section header with decorative elements -->
169+
<div class="relative mb-16 flex flex-col items-center">
170+
<!-- GitHub-style graph decoration behind title -->
171+
<div class="absolute -top-6 opacity-20">
172+
<svg width="260" height="30" viewBox="0 0 260 30" class="text-green-400">
173+
<!-- Contribution graph simulation -->
174+
<g transform="translate(0, 0)">
175+
<rect width="8" height="8" x="0" y="0" fill="currentColor" opacity="0.2" />
176+
<rect width="8" height="8" x="10" y="0" fill="currentColor" opacity="0.3" />
177+
<rect width="8" height="8" x="20" y="0" fill="currentColor" opacity="0.1" />
178+
<rect width="8" height="8" x="30" y="0" fill="currentColor" opacity="0.7" />
179+
<rect width="8" height="8" x="40" y="0" fill="currentColor" opacity="0.4" />
180+
<!-- More rectangles for contribution graph -->
181+
<rect width="8" height="8" x="0" y="10" fill="currentColor" opacity="0.5" />
182+
<rect width="8" height="8" x="10" y="10" fill="currentColor" opacity="0.8" />
183+
<rect width="8" height="8" x="20" y="10" fill="currentColor" opacity="0.2" />
184+
<rect width="8" height="8" x="30" y="10" fill="currentColor" opacity="0.5" />
185+
<rect width="8" height="8" x="40" y="10" fill="currentColor" opacity="0.9" />
186+
<!-- More rectangles until 260 width -->
187+
<rect width="8" height="8" x="50" y="0" fill="currentColor" opacity="0.6" />
188+
<rect width="8" height="8" x="60" y="0" fill="currentColor" opacity="0.3" />
189+
<!-- ...and so on -->
190+
</g>
191+
</svg>
192+
</div>
193+
194+
<h2 class="text-4xl md:text-5xl font-bold text-center relative z-10">
195+
<span class="bg-clip-text text-transparent bg-gradient-to-r from-blue-400 to-purple-500">Open Source Magic</span>
196+
</h2>
197+
<div class="mt-4 flex items-center space-x-2">
198+
<span class="h-px w-12 bg-gray-700"></span>
199+
<span class="text-lg text-gray-400 font-mono">By the community, for the community</span>
200+
<span class="h-px w-12 bg-gray-700"></span>
201+
</div>
202+
</div>
203+
204+
<!-- Terminal-style interactive display -->
205+
<div class="mb-20">
206+
<div class="relative mx-auto max-w-4xl bg-gray-950 rounded-lg shadow-2xl overflow-hidden border border-gray-800">
207+
<!-- Terminal header -->
208+
<div class="bg-gray-800 px-4 py-2 flex items-center">
209+
<div class="flex space-x-2">
210+
<div class="w-3 h-3 rounded-full bg-red-500"></div>
211+
<div class="w-3 h-3 rounded-full bg-yellow-500"></div>
212+
<div class="w-3 h-3 rounded-full bg-green-500"></div>
213+
</div>
214+
<div class="ml-4 text-gray-400 text-sm font-mono flex-1 text-center">~/alphagamebot</div>
215+
</div>
216+
217+
<!-- Terminal content updated for Python -->
218+
<div class="p-6 font-mono text-sm terminal-text">
219+
<div class="terminal-line">
220+
<span class="text-green-500">user@alphagamebot</span><span class="text-gray-500">:</span><span class="text-blue-400">~/code</span><span class="text-gray-500">$</span> <span class="text-white">git clone https://github.com/AlphaGameBot/AlphaGameBot.git</span>
221+
</div>
222+
<div class="terminal-line text-gray-400">Cloning into 'AlphaGameBot'...</div>
223+
<div class="terminal-line text-gray-400">remote: Enumerating objects: 924, done.</div>
224+
<div class="terminal-line text-gray-400">remote: Counting objects: 100% (924/924), done.</div>
225+
<div class="terminal-line text-gray-400">Receiving objects: 100% (924/924), 2.5 MiB | 8.42 MiB/s, done.</div>
226+
<div class="terminal-line text-gray-400">Resolving deltas: 100% (542/542), done.</div>
227+
<div class="terminal-line">
228+
<span class="text-green-500">user@alphagamebot</span><span class="text-gray-500">:</span><span class="text-blue-400">~/code</span><span class="text-gray-500">$</span> <span class="text-white">cd AlphaGameBot</span>
229+
</div>
230+
231+
<div class="terminal-line">
232+
<span class="text-green-500">user@alphagamebot</span><span class="text-gray-500">:</span><span class="text-blue-400">~/code/AlphaGameBot</span><span class="text-gray-500">$</span> <span class="text-white">python -m venv venv</span>
233+
</div>
234+
<div class="terminal-line">
235+
<span class="text-green-500">user@alphagamebot</span><span class="text-gray-500">:</span><span class="text-blue-400">~/code/AlphaGameBot</span><span class="text-gray-500">$</span> <span class="text-white">source venv/bin/activate</span>
236+
</div>
237+
<div class="terminal-line">
238+
<span class="text-green-500">(venv) user@alphagamebot</span><span class="text-gray-500">:</span><span class="text-blue-400">~/code/AlphaGameBot</span><span class="text-gray-500">$</span> <span class="text-white">pip install -r requirements.txt</span>
239+
</div>
240+
<div class="terminal-line text-gray-400">Collecting pycord...</div>
241+
<div class="terminal-line">
242+
<span class="text-green-500">(venv) user@alphagamebot</span><span class="text-gray-500">:</span><span class="text-blue-400">~/code/AlphaGameBot</span><span class="text-gray-500">$</span> <span class="text-white typing-animation">python main.py</span>
243+
</div>
244+
</div>
245+
</div>
246+
</div>
247+
248+
<!-- GitHub call to action -->
249+
<div class="mt-8 text-center relative">
250+
<!-- Decorative elements -->
251+
<div class="absolute -top-8 -left-8 w-16 h-16 border-t-2 border-l-2 border-blue-500 opacity-30"></div>
252+
<div class="absolute -bottom-8 -right-8 w-16 h-16 border-b-2 border-r-2 border-blue-500 opacity-30"></div>
253+
254+
<h3 class="text-2xl font-bold mb-6">Join The Community</h3>
255+
<div class="flex flex-wrap justify-center gap-4">
256+
<a href="https://github.com/AlphaGameBot" class="group relative bg-gray-800 hover:bg-gray-700 px-6 py-3 rounded-lg transition overflow-hidden">
257+
<!-- Shimmer effect on hover -->
258+
<span class="absolute inset-0 w-full h-full bg-gradient-to-r from-transparent via-white to-transparent opacity-0 group-hover:opacity-10 transform group-hover:-translate-x-full transition-all duration-1000"></span>
259+
<span class="flex items-center">
260+
<svg class="w-5 h-5 mr-3" fill="currentColor" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg">
261+
<path d="M12 .297c-6.63 0-12 5.373-12 12 0 5.303 3.438 9.8 8.205 11.385.6.113.82-.258.82-.577 0-.285-.01-1.04-.015-2.04-3.338.724-4.042-1.61-4.042-1.61C4.422 18.07 3.633 17.7 3.633 17.7c-1.087-.744.084-.729.084-.729 1.205.084 1.838 1.236 1.838 1.236 1.07 1.835 2.809 1.305 3.495.998.108-.776.417-1.305.76-1.605-2.665-.3-5.466-1.332-5.466-5.93 0-1.31.465-2.38 1.235-3.22-.135-.303-.54-1.523.105-3.176 0 0 1.005-.322 3.3 1.23.96-.267 1.98-.399 3-.405 1.02.006 2.04.138 3 .405 2.28-1.552 3.285-1.23 3.285-1.23.645 1.653.24 2.873.12 3.176.765.84 1.23 1.91 1.23 3.22 0 4.61-2.805 5.625-5.475 5.92.42.36.81 1.096.81 2.22 0 1.606-.015 2.896-.015 3.286 0 .315.21.69.825.57C20.565 22.092 24 17.592 24 12.297c0-6.627-5.373-12-12-12"></path>
262+
</svg>
263+
Star on GitHub
264+
</span>
265+
</a>
266+
<a href="https://github.com/AlphaGameBot/AlphaGameBot/fork" class="group relative bg-blue-600 hover:bg-blue-700 px-6 py-3 rounded-lg transition overflow-hidden">
267+
<!-- Shimmer effect on hover -->
268+
<span class="absolute inset-0 w-full h-full bg-gradient-to-r from-transparent via-white to-transparent opacity-0 group-hover:opacity-10 transform group-hover:-translate-x-full transition-all duration-1000"></span>
269+
<span class="flex items-center">
270+
<svg xmlns="http://www.w3.org/2000/svg" class="h-5 w-5 mr-3" fill="none" viewBox="0 0 24 24" stroke="currentColor">
271+
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M8.684 13.342C8.886 12.938 9 12.482 9 12c0-.482-.114-.938-.316-1.342m0 2.684a3 3 0 110-2.684m0 2.684l6.632 3.316m-6.632-6l6.632-3.316m0 0a3 3 0 105.367-2.684 3 3 0 00-5.367 2.684zm0 9.316a3 3 0 105.368 2.684 3 3 0 00-5.368-2.684z" />
272+
</svg>
273+
Fork & Contribute
274+
</span>
275+
</a>
276+
</div>
277+
</div>
278+
</div>
279+
</section>
280+
281+
<!-- Add the CSS needed for the open-source section -->
282+
<style>
283+
/* Removing card-related styles since we've removed the cards */
284+
.cursor-blink {
285+
animation: blink 1s step-start infinite;
286+
}
287+
288+
@keyframes blink {
289+
50% { opacity: 0; }
290+
}
291+
292+
.terminal-text .terminal-line {
293+
margin-bottom: 0.5rem;
294+
}
295+
296+
.typing-animation {
297+
overflow: hidden;
298+
white-space: nowrap;
299+
animation: typing 2s steps(10, end);
300+
width: fit-content;
301+
}
302+
303+
@keyframes typing {
304+
from { width: 0 }
305+
to { width: 100% }
306+
}
307+
</style>
308+
309+
` <!-- FAQ Section - Will be revealed on scroll -->
155310
<section id="faq" class="py-20 px-6 bg-gray-800 reveal-on-scroll">
156311
<div class="container mx-auto max-w-4xl">
157312
<h2 class="text-3xl md:text-4xl font-bold mb-16 text-center">Frequently Asked Questions</h2>
@@ -185,12 +340,42 @@ <h3 class="text-xl font-bold mb-2">How do I get help with the bot?</h3>
185340
</div>
186341
</section>
187342

343+
<!-- Testimonials Section - With improved SVG quote mark -->
344+
<section id="testimonials" class="py-20 px-6 bg-gray-800 reveal-on-scroll">
345+
<div class="container mx-auto text-center">
346+
<h2 class="text-3xl md:text-4xl font-bold mb-16">What Our Users Say</h2>
347+
348+
<!-- Single testimonial with centered layout -->
349+
<div class="max-w-3xl mx-auto">
350+
<div class="bg-gray-700 p-8 rounded-xl shadow-lg border border-gray-600 relative">
351+
<!-- SVG quote mark -->
352+
<svg class="absolute top-4 left-6 w-12 h-12 text-blue-400 opacity-20" viewBox="0 0 40 40" fill="none" xmlns="http://www.w3.org/2000/svg">
353+
<path d="M9.37 22.34C11.15 22.34 12.53 22.98 13.51 24.26C14.49 25.52 14.98 27.02 14.98 28.78C14.98 30.66 14.37 32.28 13.13 33.66C11.91 35.04 10.33 35.72 8.39 35.72C6.07 35.72 4.21 34.86 2.81 33.12C1.41 31.38 0.71 29.22 0.71 26.62C0.71 24.22 1.29 21.94 2.45 19.78C3.61 17.6 5.27 15.74 7.43 14.2C8.15 17.14 8.83 19.6 9.37 21.58V22.34Z" fill="currentColor"/>
354+
<path d="M27.05 22.34C28.83 22.34 30.21 22.98 31.19 24.26C32.17 25.52 32.66 27.02 32.66 28.78C32.66 30.66 32.05 32.28 30.81 33.66C29.59 35.04 28.01 35.72 26.07 35.72C23.75 35.72 21.89 34.86 20.49 33.12C19.09 31.38 18.39 29.22 18.39 26.62C18.39 24.22 18.97 21.94 20.13 19.78C21.29 17.6 22.95 15.74 25.11 14.2C25.83 17.14 26.51 19.6 27.05 21.58V22.34Z" fill="currentColor"/>
355+
</svg>
356+
357+
<!-- Testimonial content -->
358+
<p class="text-gray-200 text-lg mb-6 leading-relaxed pl-4">
359+
AlphaGameBot is an amazing and easy-to-use bot that has helped me and countless others while representing the ever too relevant Free Software Movement
360+
</p>
361+
362+
<!-- Author with divider -->
363+
<div class="flex items-center justify-center">
364+
<div class="h-px w-12 bg-blue-600 opacity-30"></div>
365+
<h3 class="text-xl font-bold mx-4 text-blue-300">CombineSoldier14</h3>
366+
<div class="h-px w-12 bg-blue-600 opacity-30"></div>
367+
</div>
368+
</div>
369+
</div>
370+
</div>
371+
</section>
372+
188373
<!-- CTA Section - Will be revealed on scroll -->
189374
<section id="cta" class="py-20 px-6 reveal-on-scroll">
190375
<div class="container mx-auto text-center">
191376
<h2 class="text-3xl md:text-4xl font-bold mb-6">Well, what are you waiting for?</h2>
192377
<p class="text-xl text-gray-300 mb-10 max-w-2xl mx-auto">Join many other Discord servers already using AlphaGameBot to level up their gaming communities.</p>
193-
<a href="#" class="bg-blue-600 hover:bg-blue-700 px-8 py-4 rounded-lg text-lg font-semibold transition inline-block">Add to Discord</a>
378+
<a href="https://discord.com/api/oauth2/authorize?client_id=946533554953809930&permissions=39859552415312&scope=bot" class="bg-blue-600 hover:bg-blue-700 px-8 py-4 rounded-lg text-lg font-semibold transition inline-block">Add to Discord</a>
194379
</div>
195380
</section>
196381

0 commit comments

Comments
 (0)