Spaces:
Running
Running
| <html lang="en" class="dark"> | |
| <head> | |
| <meta charset="UTF-8"> | |
| <meta name="viewport" content="width=device-width, initial-scale=1.0"> | |
| <title>15-Day Robotics Bootcamp | RoboRumble</title> | |
| <script src="https://cdn.tailwindcss.com"></script> | |
| <script src="https://unpkg.com/feather-icons"></script> | |
| <script src="https://cdn.jsdelivr.net/npm/feather-icons/dist/feather.min.js"></script> | |
| <link rel="stylesheet" href="style.css"> | |
| <script> | |
| tailwind.config = { | |
| darkMode: 'class', | |
| theme: { | |
| extend: { | |
| colors: { | |
| primary: '#3b82f6', | |
| secondary: '#f59e0b', | |
| } | |
| } | |
| } | |
| } | |
| </script> | |
| </head> | |
| <body class="bg-gray-900 text-gray-100"> | |
| <!-- Navbar Component --> | |
| <script src="components/navbar.js"></script> | |
| <custom-navbar></custom-navbar> | |
| <!-- Hero Section --> | |
| <section class="bg-gradient-to-br from-primary-600 to-primary-800 py-20 px-4 text-center"> | |
| <div class="max-w-4xl mx-auto"> | |
| <h1 class="text-4xl md:text-5xl font-bold mb-4">15-Day Robotics Bootcamp</h1> | |
| <p class="text-xl text-primary-100 max-w-2xl mx-auto mb-8"> | |
| Transform from beginner to robot builder in just 15 days with our intensive hands-on program | |
| </p> | |
| <a href="#enroll" class="inline-block bg-secondary-500 hover:bg-secondary-600 text-gray-900 font-bold py-3 px-8 rounded-full transition duration-300 transform hover:scale-105"> | |
| Enroll Now <i data-feather="arrow-right" class="inline ml-2"></i> | |
| </a> | |
| </div> | |
| </section> | |
| <!-- Info Grid --> | |
| <section class="container mx-auto px-4 py-16"> | |
| <div class="grid grid-cols-1 md:grid-cols-4 gap-6"> | |
| <div class="bg-gray-800 p-6 rounded-xl shadow-lg border-l-4 border-secondary-500"> | |
| <h3 class="text-xl font-bold mb-2">Age Group</h3> | |
| <p class="text-gray-300">Grades 6–12</p> | |
| </div> | |
| <div class="bg-gray-800 p-6 rounded-xl shadow-lg border-l-4 border-primary-500"> | |
| <h3 class="text-xl font-bold mb-2">Duration</h3> | |
| <p class="text-gray-300">15 Days</p> | |
| </div> | |
| <div class="bg-gray-800 p-6 rounded-xl shadow-lg border-l-4 border-secondary-500"> | |
| <h3 class="text-xl font-bold mb-2">Daily Time</h3> | |
| <p class="text-gray-300">1.5–2 Hours</p> | |
| </div> | |
| <div class="bg-gray-800 p-6 rounded-xl shadow-lg border-l-4 border-primary-500"> | |
| <h3 class="text-xl font-bold mb-2">Mode</h3> | |
| <p class="text-gray-300">Online/Offline</p> | |
| </div> | |
| </div> | |
| </section> | |
| <!-- About Section --> | |
| <section class="container mx-auto px-4 py-16"> | |
| <h2 class="text-3xl font-bold mb-8 text-center">About the Bootcamp</h2> | |
| <div class="max-w-3xl mx-auto bg-gray-800 p-8 rounded-xl shadow-lg"> | |
| <p class="mb-6"> | |
| The <span class="text-primary-400 font-semibold">RoboRumble Bootcamp</span> is designed to give students their first real exposure to robotics and electronics. Instead of just watching, students actively build robots, write code, connect sensors, and see real-world results. | |
| </p> | |
| <div class="flex items-center space-x-4"> | |
| <i data-feather="code" class="text-secondary-500"></i> | |
| <p>Hands-on coding with Arduino</p> | |
| </div> | |
| <div class="flex items-center space-x-4 mt-4"> | |
| <i data-feather="cpu" class="text-secondary-500"></i> | |
| <p>Build 3 different functional robots</p> | |
| </div> | |
| <div class="flex items-center space-x-4 mt-4"> | |
| <i data-feather="award" class="text-secondary-500"></i> | |
| <p>Certificate upon completion</p> | |
| </div> | |
| </div> | |
| </section> | |
| <!-- Curriculum Section --> | |
| <section class="container mx-auto px-4 py-16"> | |
| <h2 class="text-3xl font-bold mb-8 text-center">15-Day Curriculum</h2> | |
| <div class="max-w-4xl mx-auto grid grid-cols-1 md:grid-cols-2 gap-4"> | |
| <!-- Days 1-8 --> | |
| <div class="bg-gray-800 p-6 rounded-xl shadow-lg"> | |
| <h3 class="text-xl font-bold mb-4 text-secondary-400">Week 1</h3> | |
| <ul class="space-y-3"> | |
| <li class="flex items-start"> | |
| <span class="text-primary-400 font-bold mr-2">Day 1:</span> | |
| <span>Intro to Robotics & Parts</span> | |
| </li> | |
| <li class="flex items-start"> | |
| <span class="text-primary-400 font-bold mr-2">Day 2:</span> | |
| <span>Electronics Basics</span> | |
| </li> | |
| <li class="flex items-start"> | |
| <span class="text-primary-400 font-bold mr-2">Day 3:</span> | |
| <span>Arduino Board & First Program</span> | |
| </li> | |
| <li class="flex items-start"> | |
| <span class="text-primary-400 font-bold mr-2">Day 4:</span> | |
| <span>Coding Basics & LED Patterns</span> | |
| </li> | |
| <li class="flex items-start"> | |
| <span class="text-primary-400 font-bold mr-2">Day 5:</span> | |
| <span>Buttons & Digital Inputs</span> | |
| </li> | |
| <li class="flex items-start"> | |
| <span class="text-primary-400 font-bold mr-2">Day 6:</span> | |
| <span>Sensors & Light Detection</span> | |
| </li> | |
| <li class="flex items-start"> | |
| <span class="text-primary-400 font-bold mr-2">Day 7:</span> | |
| <span>Ultrasonic Sensor</span> | |
| </li> | |
| <li class="flex items-start"> | |
| <span class="text-primary-400 font-bold mr-2">Day 8:</span> | |
| <span>Motors & Motor Driver</span> | |
| </li> | |
| </ul> | |
| </div> | |
| <!-- Days 9-15 --> | |
| <div class="bg-gray-800 p-6 rounded-xl shadow-lg"> | |
| <h3 class="text-xl font-bold mb-4 text-secondary-400">Week 2</h3> | |
| <ul class="space-y-3"> | |
| <li class="flex items-start"> | |
| <span class="text-primary-400 font-bold mr-2">Day 9:</span> | |
| <span>Robot Chassis Assembly</span> | |
| </li> | |
| <li class="flex items-start"> | |
| <span class="text-primary-400 font-bold mr-2">Day 10:</span> | |
| <span>Line Follower Robot</span> | |
| </li> | |
| <li class="flex items-start"> | |
| <span class="text-primary-400 font-bold mr-2">Day 11:</span> | |
| <span>Obstacle Avoiding Robot</span> | |
| </li> | |
| <li class="flex items-start"> | |
| <span class="text-primary-400 font-bold mr-2">Day 12:</span> | |
| <span>Buzzer & Alerts</span> | |
| </li> | |
| <li class="flex items-start"> | |
| <span class="text-primary-400 font-bold mr-2">Day 13:</span> | |
| <span>Smart Robot Logic</span> | |
| </li> | |
| <li class="flex items-start"> | |
| <span class="text-primary-400 font-bold mr-2">Day 14:</span> | |
| <span>Final Project Build</span> | |
| </li> | |
| <li class="flex items-start"> | |
| <span class="text-primary-400 font-bold mr-2">Day 15:</span> | |
| <span>Project Demo & Certification</span> | |
| </li> | |
| </ul> | |
| </div> | |
| </div> | |
| </section> | |
| <!-- Kit Section --> | |
| <section class="container mx-auto px-4 py-16"> | |
| <h2 class="text-3xl font-bold mb-8 text-center">Robotics Kit Included</h2> | |
| <div class="max-w-4xl mx-auto bg-gray-800 p-8 rounded-xl shadow-lg"> | |
| <div class="grid grid-cols-1 sm:grid-cols-2 md:grid-cols-3 gap-4"> | |
| <div class="flex items-center space-x-3"> | |
| <i data-feather="cpu" class="text-secondary-500"></i> | |
| <span>Arduino Uno Board</span> | |
| </div> | |
| <div class="flex items-center space-x-3"> | |
| <i data-feather="zap" class="text-secondary-500"></i> | |
| <span>USB Cable</span> | |
| </div> | |
| <div class="flex items-center space-x-3"> | |
| <i data-feather="grid" class="text-secondary-500"></i> | |
| <span>Breadboard</span> | |
| </div> | |
| <div class="flex items-center space-x-3"> | |
| <i data-feather="code" class="text-secondary-500"></i> | |
| <span>Jumper Wires</span> | |
| </div> | |
| <div class="flex items-center space-x-3"> | |
| <i data-feather="eye" class="text-secondary-500"></i> | |
| <span>Ultrasonic Sensor</span> | |
| </div> | |
| <div class="flex items-center space-x-3"> | |
| <i data-feather="radio" class="text-secondary-500"></i> | |
| <span>IR Sensors (2 pcs)</span> | |
| </div> | |
| <div class="flex items-center space-x-3"> | |
| <i data-feather="sun" class="text-secondary-500"></i> | |
| <span>LDR (Light Sensor)</span> | |
| </div> | |
| <div class="flex items-center space-x-3"> | |
| <i data-feather="rotate-cw" class="text-secondary-500"></i> | |
| <span>DC Motors</span> | |
| </div> | |
| <div class="flex items-center space-x-3"> | |
| <i data-feather="truck" class="text-secondary-500"></i> | |
| <span>Robot Chassis</span> | |
| </div> | |
| </div> | |
| </div> | |
| </section> | |
| <!-- Outcomes Section --> | |
| <section class="container mx-auto px-4 py-16"> | |
| <h2 class="text-3xl font-bold mb-8 text-center">Learning Outcomes</h2> | |
| <div class="max-w-4xl mx-auto grid grid-cols-1 md:grid-cols-2 gap-8"> | |
| <div class="bg-gray-800 p-6 rounded-xl shadow-lg border-t-4 border-primary-500"> | |
| <h3 class="text-xl font-bold mb-4 text-primary-400">Technical Skills</h3> | |
| <ul class="space-y-3"> | |
| <li class="flex items-start"> | |
| <i data-feather="check-circle" class="text-secondary-500 mr-2"></i> | |
| <span>Arduino programming fundamentals</span> | |
| </li> | |
| <li class="flex items-start"> | |
| <i data-feather="check-circle" class="text-secondary-500 mr-2"></i> | |
| <span>Sensor integration & calibration</span> | |
| </li> | |
| <li class="flex items-start"> | |
| <i data-feather="check-circle" class="text-secondary-500 mr-2"></i> | |
| <span>Motor control & PWM</span> | |
| </li> | |
| <li class="flex items-start"> | |
| <i data-feather="check-circle" class="text-secondary-500 mr-2"></i> | |
| <span>Basic circuit design</span> | |
| </li> | |
| </ul> | |
| </div> | |
| <div class="bg-gray-800 p-6 rounded-xl shadow-lg border-t-4 border-secondary-500"> | |
| <h3 class="text-xl font-bold mb-4 text-secondary-400">Soft Skills</h3> | |
| <ul class="space-y-3"> | |
| <li class="flex items-start"> | |
| <i data-feather="check-circle" class="text-primary-500 mr-2"></i> | |
| <span>Problem-solving techniques</span> | |
| </li> | |
| <li class="flex items-start"> | |
| <i data-feather="check-circle" class="text-primary-500 mr-2"></i> | |
| <span>Logical thinking & debugging</span> | |
| </li> | |
| <li class="flex items-start"> | |
| <i data-feather="check-circle" class="text-primary-500 mr-2"></i> | |
| <span>Project planning & execution</span> | |
| </li> | |
| <li class="flex items-start"> | |
| <i data-feather="check-circle" class="text-primary-500 mr-2"></i> | |
| <span>Presentation & demonstration</span> | |
| </li> | |
| </ul> | |
| </div> | |
| </div> | |
| </section> | |
| <!-- Final CTA --> | |
| <section id="enroll" class="bg-gradient-to-r from-primary-700 to-primary-900 py-20 px-4 text-center"> | |
| <div class="max-w-4xl mx-auto"> | |
| <h2 class="text-3xl md:text-4xl font-bold mb-4">Ready to Build Your First Robot?</h2> | |
| <p class="text-xl text-primary-100 max-w-2xl mx-auto mb-8"> | |
| Limited seats available. Perfect for beginners with no prior experience. | |
| </p> | |
| <a href="#" class="inline-block bg-secondary-500 hover:bg-secondary-600 text-gray-900 font-bold py-3 px-8 rounded-full transition duration-300 transform hover:scale-105 shadow-lg"> | |
| Enroll Now <i data-feather="arrow-right" class="inline ml-2"></i> | |
| </a> | |
| </div> | |
| </section> | |
| <!-- Footer Component --> | |
| <script src="components/footer.js"></script> | |
| <custom-footer></custom-footer> | |
| <script> | |
| feather.replace(); | |
| </script> | |
| <script src="script.js"></script> | |
| <script src="https://huggingface.co/deepsite/deepsite-badge.js"></script> | |
| </body> | |
| </html> |