-
Notifications
You must be signed in to change notification settings - Fork 0
/
allRecipes.html
158 lines (148 loc) · 5.09 KB
/
allRecipes.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
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
<!DOCTYPE html>
<!--
Phantom by HTML5 UP
html5up.net | @ajlkn
Free for personal and commercial use under the CCA 3.0 license (html5up.net/license)
-->
<html>
<head>
<title>Recipes</title>
<meta charset="utf-8" />
<meta
name="viewport"
content="width=device-width, initial-scale=1, user-scalable=no"
/>
<link rel="icon" type="image/x-icon" href="src/images/logo.svg" />
<link rel="stylesheet" href="src/css/main.css" />
<noscript><link rel="stylesheet" href="src/css/noscript.css" /></noscript>
<script type="module" src="src/js/controller/controllerAll.js"></script>
</head>
<body class="is-preload">
<!-- Wrapper -->
<div id="wrapper">
<!-- Header -->
<header id="header">
<div class="inner">
<!-- Logo -->
<a href="index.html" class="logo">
<span class="symbol"><img src="src/images/logo.svg" alt="" /></span
><span class="title">All recipes</span>
</a>
<!-- Nav -->
<nav>
<ul>
<li><a href="#menu">Menu</a></li>
</ul>
</nav>
</div>
</header>
<!-- Menu -->
<nav id="menu">
<h2>Menu</h2>
<ul>
<li><a href="index.html">Home</a></li>
<li><a href="allRecipes.html">All recipes</a></li>
<li><a href="newRecipe.html">Create New Recipe</a></li>
<li><a href="#footer">Contact</a></li>
<li>
<a href="https://www.borisblagojevic.me" target="_blank"
>About me</a
>
</li>
</ul>
</nav>
<!-- Main -->
<div id="main">
<div class="inner">
<header>
<h1>All available recipes</h1>
<p>
List of all available recipes that are grouped by a name or an ingredient they use.
</p>
</header>
<section class="search-box">
<form action="#" class="recipe-form">
<input type="text" name="recipe-input" class="recipe-form__input" value="" placeholder="Recipe roup">
<input type="submit" value="Search" class="recipe-form__search" class="primary">
</form>
</section>
<section class="tiles tiles-all" id="tiles">
<!-- so parcel can load img -->
<img src="src/images/pic01.jpg" alt="" class="recipe-group__img hidden"/>
</section>
<div class="all-recipe-box" id="recipe-list-end">
<a href="#" class="button fit small btn--load-more">Load more recipes</a>
<a href="#tiles" class="button primary fit btn--group">Group recipes</a>
</div>
</div>
</div>
<!-- Footer -->
<footer id="footer">
<div class="inner">
<section>
<h2>Contact me</h2>
<form method="post" action="https://formspree.io/f/xnqwbven">
<div class="fields">
<div class="field half">
<input type="text" name="name" id="name" placeholder="Name" />
</div>
<div class="field half">
<input
type="email"
name="email"
id="email"
placeholder="Email"
/>
</div>
<div class="field">
<textarea
name="message"
id="message"
placeholder="Message"
></textarea>
</div>
</div>
<ul class="actions">
<li><input type="submit" value="Send" class="primary" /></li>
</ul>
</form>
</section>
<section>
<h2>Info</h2>
<ul class="icons">
<li></li>
<a
href="https://github.com/Blagoja95"
class="icon brands style2 fa-github"
><span class="label">GitHub</span></a
>
</li>
<li>
<a href="tel:+387644151370" class="icon solid style2 fa-phone"
><span class="label">Phone</span></a
>
</li>
<li>
<a
href="mailto:[email protected]"
class="icon solid style2 fa-envelope"
><span class="label">Email</span></a
>
</li>
</ul>
</section>
<ul class="copyright">
<li>© Functionality of this app made by <a href="https://www.borisblagojevic.me">Boris Blagojevic</a>. All rights reserved</li>
<li>Design: <a href="http://html5up.net">HTML5 UP</a></li>
</ul>
</div>
</footer>
</div>
<!-- Scripts -->
<script src="src/js/jquery.min.js"></script>
<script src="src/js/browser.min.js"></script>
<script src="src/js/breakpoints.min.js"></script>
<script src="src/js/util.js"></script>
<script src="src/js/main.js"></script>
</body>
</html>