diff options
Diffstat (limited to 'index.html')
| -rw-r--r-- | index.html | 94 |
1 files changed, 94 insertions, 0 deletions
diff --git a/index.html b/index.html new file mode 100644 index 0000000..12a7c31 --- /dev/null +++ b/index.html @@ -0,0 +1,94 @@ +<!DOCTYPE html> +<html lang="en"> +<head> + <meta charset="utf-8"> + <meta name="viewport" content="width=device-width"> + <title>Coffee Masters</title> + + <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=Open+Sans:wght@300;400;700&display=swap" rel="stylesheet"> + <link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Material+Symbols+Outlined:opsz,wght,FILL,GRAD@48,400,0,0" /> + + <link rel="stylesheet" href="styles.css"> + <link rel="manifest" href="app.webmanifest"> + <link rel="apple-touch-icon" href="images/icons/icon.png"> + <link rel="icon" href="images/icons/icon.png"> +</head> + +<body> + <header> + <h1><img src="images/logo.svg" width="140" alt="Coffee Masters"></h1> + <nav> + <a class="navlink material-symbols-outlined" id="linkHome" href="/"> + local_cafe + </a> + <a class="navlink material-symbols-outlined" id="linkOrder" href="/order"> + shopping_cart + </a> + <span id="badge" hidden></span> + </nav> + </header> + + <main> + </main> + + <template id="menu-page-template"> + <section> + <ul id="menu"></ul> + </section> + </template> + + <template id="product-item-template"> + <article> + <a href="#"> + <img> + <section> + <div> + <h4></h4> + <p class="price"><p> + </div> + <button>Add</button> + </section> + </a> + </article> + </template> + + <template id="order-form-template"> + <form> + <label for="name">Your Name</label> + <input name="name" required> + <label for="phone">Your Phone Number</label> + <input name="phone" type="tel"> + <label for="email">Your Email</label> + <input name="email" type="email"> + <button type="submit">Place Order</button> + </form> + </template> + + <template id="details-page-template"> + <header> + <a href="#" onclick="app.router.go('/'); event.preventDefault()">< Back</a> + <h2></h2> + <a></a> + </header> + <img src=""> + <p class="description"></p> + <p class="price"></p> + <button>Add to cart</button> + </template> + + <template id="cart-item-template"> + <li> + <p class='qty'></p> + <p class='name'></p> + <p class='price'></p> + <p class='toolbar'> + <a href="#" class="delete-button"> + 🗑️ + </a> + </p> + </li> + </template> +</body> +</html>
\ No newline at end of file |