forked from sharmaanj200/Lean-In-Hacks
-
Notifications
You must be signed in to change notification settings - Fork 0
/
dietTracker.html
130 lines (119 loc) · 3.43 KB
/
dietTracker.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
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Calorie/Diet tracker</title>
<link rel="stylesheet" href="assets\css\materialize.css" />
<link
href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome-d.css"
rel="stylesheet"
integrity="sha384-wvfXpqpZZVQGK6TAh5PVlGOfQNHSoD2xbE+QkPxCAFlNEevoEH3Sl0sibVcOQVnN"
crossorigin="anonymous"
/>
</head>
<body>
<!-- Nav bar -->
<nav>
<div class="nav-wrapper blue">
<div class="container">
<a href="#" class="brand-logo center">Track Your Calories with Healthify Moms</a>
<ul class="right">
<li>
<a href="" class="clear-btn btn red lighten-3"
>Clear all</a
>
</li>
</ul>
</div>
</div>
</nav>
<br />
<!-- Container -->
<!-- Calories Count -->
<h3 class="center-align">
Total Calories <span class="total-calories">0</span>
</h3>
<div class="container">
<!-- Card -->
<div class="card">
<div class="card-content">
<span class="card-title">Add Meal/ Food Item</span>
<form action="" class="col">
<div class="row">
<div class="input-field col s6">
<input
type="text"
placeholder="Add Item"
id="item-name"
/>
<label for="item-name">Meal</label>
</div>
<div class="input-field col s6">
<input
type="number"
placeholder="Add Calories"
id="item-calorie"
/>
<label for="item-name">Calorie</label>
</div>
<!-- Buttons -->
<button class="add-btn btn blue darken-3">
<i class="fa fa-plus"></i>
Add Meal
</button>
<button class="update-btn btn orange">
<i class="fa fa-pencil-square-o"></i>
Update Meal
</button>
<button class="delete-btn btn red">
<i class="fa fa-remove"></i>
Delete Meal
</button>
<button class="back-btn btn grey pull-right">
<i class="fa fa-chevron-circle-left"></i>
Back
</button>
</div>
</form>
</div>
</div>
<!-- Food items list -->
<ul id="item-list" class="collection">
<!-- <li class="collection-item" id="item-0">
<strong>Steak Dinner</strong> <em>1200 Calorie</em>
<a href="" class="secondary-content">
<i class="fa fa-pencil"></i>
</a>
</li>
<li class="collection-item" id="item-0">
<strong>Cookies</strong> <em>300 Calorie</em>
<a href="" class="secondary-content">
<i class="fa fa-pencil"></i>
</a>
</li>
<li class="collection-item" id="item-0">
<strong>Eggs</strong> <em>200 Calorie</em>
<a href="" class="secondary-content">
<i class="fa fa-pencil"></i>
</a>
</li> -->
</ul>
<!-- <table id="table1" style="font-size: 18px;">
<tr>
<th>ID</th>
<th>Item</th>
<th>Calories</th>
<th class="pull-right">Edit</th>
</tr>
</table> -->
</div>
<script
src="https://code.jquery.com/jquery-3.5.1.js"
integrity="sha256-QWo7LDvxbWT2tbbQ97B53yJnYU3WhH/C8ycbRAkjPDc="
crossorigin="anonymous"
></script>
<script src="assets/js/materialize.js"></script>
<script src="assets/js/app.js"></script>
</body>
</html>