Spaces:
Running
Running
| <html lang="en"> | |
| <head> | |
| <meta charset="UTF-8"> | |
| <meta name="viewport" content="width=device-width, initial-scale=1.0"> | |
| <title>Anycoder Coffee Shop | Premium Coffee & Code</title> | |
| <meta name="description" content="Anycoder Coffee Shop - Where premium coffee meets code. Fuel your creativity with our specialty blends."> | |
| <link rel="stylesheet" href="assets/css/styles.css"> | |
| <link rel="preconnect" href="https://fonts.googleapis.com"> | |
| <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin> | |
| <link href="https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;600;700&display=swap" rel="stylesheet"> | |
| </head> | |
| <body> | |
| <header class="header"> | |
| <div class="container"> | |
| <div class="header-content"> | |
| <a href="#" class="logo">Anycoder <span>Coffee</span></a> | |
| <button class="mobile-menu-btn" id="mobile-menu-btn" aria-label="Open menu"> | |
| <span></span> | |
| <span></span> | |
| <span></span> | |
| </button> | |
| <nav class="nav" id="nav"> | |
| <ul class="nav-list"> | |
| <li class="nav-item"><a href="#home" class="nav-link">Home</a></li> | |
| <li class="nav-item"><a href="#menu" class="nav-link">Menu</a></li> | |
| <li class="nav-item"><a href="#about" class="nav-link">About</a></li> | |
| <li class="nav-item"><a href="#contact" class="nav-link">Contact</a></li> | |
| </ul> | |
| </nav> | |
| </div> | |
| </div> | |
| </header> | |
| <main> | |
| <section id="home" class="hero"> | |
| <div class="container"> | |
| <div class="hero-content"> | |
| <h1 class="hero-title">Coffee to Fuel Your Code</h1> | |
| <p class="hero-text">Premium blends for developers who need that perfect caffeine kick to create amazing things.</p> | |
| <video controls autoplay muted loop playsinline style="max-width: 100%; height: auto; border-radius: 8px; margin: 10px 0; display: block;" onloadstart="this.style.backgroundColor='#f0f0f0'" onerror="this.style.display='none'; console.error('Video failed to load')"><source src="https://huggingface.co/datasets/akhaliq/anycoder-media/resolve/main/video/20250824_213923_db35a187_image_to_video_result.mp4" type="video/mp4" /><p style="text-align: center; color: #666;">Your browser does not support the video tag.</p></video> | |
| <a href="#menu" class="btn btn-primary">Explore Our Menu</a> | |
| </div> | |
| </div> | |
| </section> | |
| <section id="menu" class="menu"> | |
| <div class="container"> | |
| <h2 class="section-title">Our Menu</h2> | |
| <div class="menu-grid"> | |
| <div class="menu-item"> | |
| <div class="menu-item-icon">β</div> | |
| <h3 class="menu-item-title">Espresso</h3> | |
| <p class="menu-item-price">$3.50</p> | |
| <p class="menu-item-description">Rich and bold shot to kickstart your coding session.</p> | |
| </div> | |
| <div class="menu-item"> | |
| <div class="menu-item-icon">π₯</div> | |
| <h3 class="menu-item-title">Latte</h3> | |
| <p class="menu-item-price">$4.75</p> | |
| <p class="menu-item-description">Smooth blend of espresso and steamed milk.</p> | |
| </div> | |
| <div class="menu-item"> | |
| <div class="menu-item-icon">βοΈ</div> | |
| <h3 class="menu-item-title">Cold Brew</h3> | |
| <p class="menu-item-price">$4.25</p> | |
| <p class="menu-item-description">Slow-steeped for 24 hours for maximum smoothness.</p> | |
| </div> | |
| <div class="menu-item"> | |
| <div class="menu-item-icon">π«</div> | |
| <h3 class="menu-item-title">Mocha</h3> | |
| <p class="menu-item-price">$5.00</p> | |
| <p class="menu-item-description">Espresso with chocolate and steamed milk.</p> | |
| </div> | |
| </div> | |
| </div> | |
| </section> | |
| <section id="about" class="about"> | |
| <div class="container"> | |
| <div class="about-content"> | |
| <h2 class="section-title">About Anycoder Coffee</h2> | |
| <p class="about-text">Born from the late-night coding sessions of a team of developers, Anycoder Coffee was created to fuel creativity and innovation. We source the finest beans from around the world and roast them to perfection, giving you the perfect cup to power through your toughest coding challenges.</p> | |
| <p class="about-text">With locations near tech hubs and creative spaces, we've become the go-to spot for developers, designers, and digital innovators. Join our community and experience coffee that understands the coder's lifestyle.</p> | |
| </div> | |
| </div> | |
| </section> | |
| <section id="contact" class="contact"> | |
| <div class="container"> | |
| <div class="contact-content"> | |
| <h2 class="section-title">Find Us</h2> | |
| <div class="contact-info"> | |
| <div class="contact-item"> | |
| <h3 class="contact-item-title">Location</h3> | |
| <p class="contact-item-text">123 Tech Avenue, Code City, CC 10001</p> | |
| </div> | |
| <div class="contact-item"> | |
| <h3 class="contact-item-title">Hours</h3> | |
| <p class="contact-item-text">Mon-Fri: 6:00am - 9:00pm<br>Sat-Sun: 7:00am - 8:00pm</p> | |
| </div> | |
| <div class="contact-item"> | |
| <h3 class="contact-item-title">Contact</h3> | |
| <p class="contact-item-text">hello@anycodercoffee.com<br>(555) 123-4567</p> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| </section> | |
| </main> | |
| <footer class="footer"> | |
| <div class="container"> | |
| <div class="footer-content"> | |
| <p class="copyright">© 2023 Anycoder Coffee Shop. All rights reserved.</p> | |
| <div class="social-links"> | |
| <a href="#" class="social-link" aria-label="Twitter">π</a> | |
| <a href="#" class="social-link" aria-label="Instagram">IG</a> | |
| <a href="#" class="social-link" aria-label="GitHub">GH</a> | |
| </div> | |
| </div> | |
| </div> | |
| </footer> | |
| <script src="assets/js/script.js"></script> | |
| </body> | |
| </html> |