<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Axio Mart</title> <!-- Link Css --> <link rel="stylesheet" href="style/market.css"> <!-- Link Icon --> <script type="module" src="https://unpkg.com/ionicons@5.5.2/dist/ionicons/ionicons.esm.js"></script> <script nomodule src="https://unpkg.com/ionicons@5.5.2/dist/ionicons/ionicons.js"></script> <link rel="stylesheet" href="https://unpkg.com/boxicons@latest/css/boxicons.min.css"> <!-- link swiper js --> <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/swiper/swiper-bundle.min.css" /> <!-- Favico --> <link rel="apple-touch-icon" sizes="180x180" href="favico/favicon_io/apple-touch-icon.png"> <link rel="icon" type="image/png" sizes="512x512" href="favico/favicon_io/favicon-512x512.png"> <link rel="icon" type="image/png" sizes="192x192" href="favico/favicon_io/favicon-192x192.png"> <link rel="icon" type="image/png" sizes="32x32" href="favico/favicon_io/favicon-32x32.png"> <link rel="icon" type="image/png" sizes="16x16" href="favico/favicon_io/favicon-16x16.png"> <link rel="icon" href="favico/favicon_io/favicon.ico"> <link rel="manifest" href="favico/favicon_io/site.webmanifest"> </head> <body> <!-- Navbar --> <nav> <div><a href="#" class="logo">Axio Mart</a></div> <div class="box-menu" id="menu-icon"> <ul class="navbar"> <li><a href="#">Home</a></li> <li><a href="#">Popular</a></li> <li><a href="#">Promo</a></li> <li><a href="#">Menu</a></li> <li><a href="#">Pesan</a></li> </ul> </div> </nav> <section class="home" id="home"> <div class="hero"> <div class="home-text"> <h2>Axio Mart</h2> <h3>Get the best variety of snack here</h3> <p>the tasty snack of your choice</p> <a href="" class="btn">View Menu</a> </div> <div class="hero-img"> <img src="images/jajan-paralax.png" class="parallax" data-speed="2" alt=""> </div> </div> </section> <section class="menu" id="menu"> <div class="heading-menu"> <h2>Best <span>Menu</span> Of The Week !</h2> </div> <div class="container"> <div class="products-container"> <div class="product" data-name="p-1"> <img src="images/chitato.png" alt=""> <h3>Chitato</h3> </div> <div class="product" data-name="p-2"> <img src="images/pop-mie.png" alt="" height="50"> <h3>Pop Mie Gledek</h3> </div> <div class="product" data-name="p-3"> <img src="images/nextar.png" alt=""> <h3>Nextar Nanas</h3> </div> </div> </div> </section> <div class="products-preview"> <div class="preview" data-target="p-1"> <i class='bx bx-x'></i> <img src="images/chitato.png" alt=""> <h3>Chitato</h3> <p>Rp.5000,00-</p> </div> <div class="preview" data-target="p-2"> <i class='bx bx-x'></i> <img src="images/pop-mie.png" alt=""> <h3>Pop Mie Gledek</h3> <p>Rp.6000,00-</p> </div> <div class="preview" data-target="p-3"> <i class='bx bx-x'></i> <img src="images/nextar.png" alt=""> <h3>Nextar Nanas</h3> <p>Rp.2000,00-</p> </div> </div> <!-- Footer --> <section class="footer" id="footer"> <div class="contact-box"> <h3><span>Food Test</span></h3> <span>Connect With Us</span> <div class="social"> <a href="#"><i class='bx bxl-facebook' ></i></a> <a href="#"><i class='bx bxl-twitter' ></i></a> <a href="#"><i class='bx bxl-instagram' ></i></a> </div> </div> <div class="contact-box menu"> <h3>Menu Links</h3> <li><a href="#">Home</a></li> <li><a href="#">Popular</a></li> <li><a href="#">Promo</a></li> <li><a href="#">Menu</a></li> <li><a href="#">Pesan</a></li> </div> <div class="contact-box address"> <h3>Contact</h3> <i class='bx bxs-phone' ><span>+62 888 999 888 </span></i> <i class='bx bxs-map'><span>SMK Taruna Bhakti</span></i> <i class='bx bx-envelope' ><span>adoramart@gmail.com</span></i> </div> </section> <!-- Link Javascript --> <script src="script/app.js" defer></script> <script src="script/slider.js"></script> </body> </html>