UNPKG

jqwidgets-framework

Version:

jQWidgets is an advanced Angular, Vue, Blazor, React, Web Components, jquery, ASP .NET MVC, Custom Elements and HTML5 UI framework.

www.jqwidgets.com

jqwidgets/jQWidgets

131 lines (123 loc) • 6.51 kB
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
<!DOCTYPE html> <html lang="en"> <head> <title id='Description'>Fitness Tracker</title> <meta charset="utf-8"> <meta name="viewport" content="width=device-width, initial-scale=1 maximum-scale=1 minimum-scale=1" /> <link rel="stylesheet" href="../../../jqwidgets/styles/jqx.base.css" type="text/css" /> <link rel="stylesheet" href="../../../jqwidgets/styles/jqx.light.css" type="text/css" /> <script type="text/javascript" src="../../../scripts/jquery-1.11.1.min.js"></script> <link href="../../../styles/bootstrap.min.css" rel="stylesheet" /> <link href="../../../styles/bootstrap-theme.min.css" rel="stylesheet" /> <script src="../../../scripts/bootstrap.min.js"></script> <script type="text/javascript" src="../../../jqwidgets/jqxcore.js"></script> <script type="text/javascript" src="../../../jqwidgets/jqxdata.js"></script> <script type="text/javascript" src="../../../jqwidgets/jqxdraw.js"></script> <script type="text/javascript" src="../../../jqwidgets/jqxbargauge.js"></script> <script type="text/javascript" src="../../../jqwidgets/jqxchart.core.js"></script> <script type="text/javascript" src="../../../jqwidgets/jqxbuttons.js"></script> <script type="text/javascript" src="../../../jqwidgets/jqxscrollbar.js"></script> <script type="text/javascript" src="../../../jqwidgets/jqxgrid.js"></script> <script type="text/javascript" src="../../../jqwidgets/jqxgrid.selection.js"></script> <script type="text/javascript" src="../../../jqwidgets/jqxgrid.filter.js"></script> <script type="text/javascript" src="../../../jqwidgets/jqxcheckbox.js"></script> <script type="text/javascript" src="../../../jqwidgets/jqxgrid.edit.js"></script> <script type="text/javascript" src="../../../jqwidgets/jqxlistbox.js"></script> <script type="text/javascript" src="../../../jqwidgets/jqxdropdownlist.js"></script> <script type="text/javascript" src="../../../jqwidgets/jqxgrid.aggregates.js"></script> <script type="text/javascript" src="../../../jqwidgets/jqxtooltip.js"></script> <script type="text/javascript" src="../../../jqwidgets/globalization/globalize.js"></script> <script type="text/javascript" src="../../../scripts/demos.js"></script> <link href="style.css" rel="stylesheet" /> <script src="main.js"></script> </head> <body style="overflow: initial; overflow-x: hidden;"> <!-- HEADER container --> <div id="fitnessTrackerHeader"> <div class="sampleheader container"> <div id="fitnessTracker" class="col-xs-12 col-sm-12 col-md-12 col-lg-12"> <div class="col-xs-12"> <div id="header"> <span class="glyphicon glyphicon-equalizer" aria-hidden="true"></span> <span>Fitness Tracker</span> </div> <div id="person"></div> </div> </div> </div> </div> <!-- CONTENT container --> <div class="samplecontainer container"> <!-- Today --> <div id="todayDetails" class="row bargauge"> <div class="col-xs-12 col-sm-6 col-md-3 col-lg-3"> <div class="description">Today</div> <div id="bargauge1" class="ptiles bargauge"></div> </div> <div class="col-xs-12 col-sm-6 col-md-3 col-lg-3"> <div class="description">&nbsp;</div> <div id="bargauge2" class="ptiles bargauge"></div> </div> <div class="col-xs-12 col-sm-6 col-md-3 col-lg-3"> <div class="description">Workout Progress</div> <div id="bargauge3" class="ptiles bargauge"></div> </div> <div class="col-xs-12 col-sm-6 col-md-3 col-lg-3"> <div class="description">&nbsp;</div> <div id="bargauge4" class="ptiles bargauge"></div> </div> </div> <!-- MEAL --> <div class="row description"> <div class="col-xs-12 col-sm-6 col-md-4 col-lg-4"> <div> Meal Summary </div> </div> </div> <div id="mealSummary" class="row"> <div class="col-xs-12 col-sm-4 col-md-4 col-lg-4"> <div id="chartDonut" style="width: 100%; height: 400px; position: relative; left: 0px; top: 0px;"></div> </div> <div id="addDeleteSet" class="col-xs-12 col-sm-6 col-md-8 col-lg-8"> <div id='newMealDropdown' style="display: inline-block; vertical-align: bottom;"></div> <div style="display: inline-block;"> <button id="addMeal">Add</button> </div> </div> <div class="col-xs-12 col-sm-8 col-md-8 col-lg-8"> <div id="gridContent" class="ptiles"> <div id="foodGridValues"></div> </div> </div> </div> <!-- Daily Calorie Balance --> <div class="row description">Daily Calorie Balance</div> <div id="caloriesBallance" class="row"> <div class="col-xs-12 col-sm-4 col-md-4 col-lg-4"> <div id="piechart" style="width: 100%; height: 450px;" class="ptiles"></div> </div> <div class="col-xs-12 col-sm-8 col-md-8 col-lg-8"> <div id="gridCaloriesContent" class="ptiles"> <div id="dailyCaloriesGrid"></div> <div id="cellbegineditevent"></div> </div> </div> </div> <!-- Daily Calorie Balance Second --> <div class="row description">Daily Calorie Balance - Second</div> <div id="caloriesBalanceSecond" class="row"> <div class="col-xs-12 col-sm-12 col-md-12 col-lg-12"> <div id="chartCalories" style="width: 100%; height: 450px;" class="ptiles"></div> </div> </div> <div class="row description">Macronutrients Balance</div> <div id="macronutrientsBalance" class="row"> <div class="col-xs-12 col-sm-12 col-md-12 col-lg-12"> <div id="nutritionalValues" style="width: 100%; height: 450px;" class="ptiles"></div> </div> </div> <div class="row description"></div> </div> </body> </html>