-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
75 lines (70 loc) · 3.59 KB
/
index.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
<!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>Project Coffee | Home</title>
<link rel="stylesheet" href="src/styles/home-page.css">
<link rel="stylesheet" href="src/styles/nav.css">
<link rel="stylesheet" href="src/styles/all.css">
</head>
<body>
<header>
<section class="nav-logo">
<i class="fa-solid fa-bars" id="main-menu-icon"></i>
<div class="logo">
<h1>Project Coffee</h1>
<img src="src/images/coffee-cup-logo.png" alt="coffee-cup-draw">
</div>
</section>
<nav><!--Navigation bar used in this project-->
<ul class="nav-links">
<li><a href="#">Home</a></li>
<li><a href="src/pages/account.html">Account</a></li>
<li><a href="src/pages/make-coffee.html">Make Coffee</a></li>
<li><a href="src/pages/coffee-types.html">Coffee Types</a></li>
</ul>
</nav>
</header>
<main>
<aside>
<section class="menu-aside">
<ul class="menu-aside-nav">
<li><a href="#">Home</a></li>
<li><a href="src/pages/account.html">Account</a></li>
<li><a href="src/pages/make-coffee.html">Coffee Machine</a></li>
<li><a href="src/pages/coffee-types.html">Coffee Types</a></li>
</ul>
</section>
</aside>
<section class="top">
<article class="top-text">
<h2>Make your favorite</h2>
<h2>COFFEE</h2>
<p>With an coffee machine you will do it with relative easy!</p>
</article>
</section>
<section class="bottom">
<div class="bottom-col">
<article class="col">
<h2 class="col-h">Coffee Machine</h2>
<img class="coffee-machine-img" src="src/images/coffee-machine.png">
<p>The coffee machine has made brewing coffee simple. The interface is designed in such a way that anyone can use it without any problems. There are four types of coffee to choose from. The tanks, which contain the products needed to make coffee, allow you to brew at least several cups of coffee, depending on the type.</p>
</article>
<article class="col">
<h2 class="col-h">Custom Coffee</h2>
<img class="cup-img" src="src/images/coffee-cup.png">
<p>Every coffee lover, will choose the right type of coffee for himself. Currently, you can choose from espresso (pure coffee), latte (coffee with lots of milk), americano (coffee with lots of hot water) and cappuccino (coffee with milk and lots of milk foam). You can also create your own type of coffee, in the creator adapted for this purpose.</p>
</article>
<article class="col">
<h2 class="col-h">Ingredients</h2>
<img class="coffee-beans-bag-img" src="src/images/coffee-beans-bag.png">
<p>The most essential ingredient for brewing coffee, are the coffee beans. However, without the other products like water or milk, it would not be possible to create a proper drink. If any of the products is missing, you have the option of refilling it.</p>
</article>
</div>
</section>
</main>
<script src="src/scripts/nav.js"></script>
</body>
</html>