This repository has been archived by the owner on Aug 8, 2024. It is now read-only.
-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
104 lines (92 loc) · 5.06 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
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
<!doctype html>
<html>
<head>
<title>Run Challenge</title>
<!-- Custom manifest.json to add the web app to the homescreen-->
<link rel="manifest" href="manifest.json">
<meta name="mobile-web-app-capable" content="yes">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" href="https://fonts.googleapis.com/icon?family=Material+Icons">
<link rel="stylesheet" href="https://code.getmdl.io/1.2.1/material.indigo-pink.min.css">
<link rel="stylesheet" href="css/runChallenge.css" />
<meta name="apple-mobile-web-app-capable" content="yes" />
<link rel="shortcut icon" sizes="196x196" href="images/runChallenge.png" />
<link rel="apple-touch-icon-precomposed" href="images/runChallenge.png" />
<link rel="stylesheet" href="http://fonts.googleapis.com/css?family=Roboto:300,400,500,700" type="text/css">
<!-- changing browser tab colour-->
<meta name="theme-color" content="#00215b">
</head>
<body>
<!--Ϟ RUN</b>| ϾHΛLLΞNGΞ©-->
<!-- Always shows a header, even in smaller screens. -->
<div class="mdl-layout mdl-js-layout mdl-layout--fixed-header mdl-layout__header--seamed">
<header class="mdl-layout__header" style="background-color:#00215b">
<div class="mdl-layout__header-row" style="background-color:#00215b">
<!-- Title -->
<span class="mdl-layout-title"><b>Ϟ RUN</b> CHΛLLΞNGΞ™</span>
<div class="mdl-layout-spacer"></div>
<!-- FAB button with ripple -->
<button id='tt2' onclick="loadNewRunPage();" class="mdl-button mdl-js-button mdl-button--fab mdl-button--mini-fab mdl-button--colored" style="background-color:red" align="right">
<i class="material-icons">directions_run</i>
<div class="mdl-tooltip mdl-tooltip--large" for="tt2">
Start a Run
</div>
</button>
</div>
</header>
<div class="mdl-layout__drawer">
<span class="mdl-layout-title"> NAVIGATION <i class="material-icons">arrow_drop_down</i></span>
<nav class="mdl-navigation">
<div class="mdl-navigation__link" onclick='alert("HOW TO INSTALL THIS APP TO YOUR HOMESCREEN:\n\nFor optimum viewing experience, add this web app to your homescreen!\n\n1. Click the menu button in Chrome (top right).\n\n2. Scroll and find ADD TO HOMESCREEN option and click it.\n\n3. Confirm the promt and check your homescreen!\n\n");'>How to add this web app to your homescreen</div>
<a class="mdl-navigation__link" href="../docs/UserGuide_Team2.pdf">View User Guide</a>
<div class="mdl-navigation__link" onclick='alert("ABOUT | DEVELOPERS\n\nDeveloped By:\nBinura Gunasekara\nDevni Kamburadeniya\nUditha Udaraka\nAzad Luqman\n\n(For the second Assignment of MCD4290 Engineering Mobile Apps.)");'>About | Dev Info</div>
</nav>
</div>
<main class="mdl-layout__content">
<div class="page-content">
<!-- Wide card with share menu button -->
<div class="demo-card-wide mdl-card mdl-shadow--2dp">
<div class="mdl-card__title">
<h6 class="mdl-card__title-text text-shadow" style="font-size:15px">
<i class="material-icons" style="font-size:17px">phone_android</i> FITNESS.
<B>SIMPLIFIED</B>
</h6>
</div>
<div class="mdl-card__actions mdl-card--border" style='background-color=ghostwhite'>
<div class="mdl-button mdl-button--colored mdl-js-button mdl-js-ripple-effect" onclick="loadNewRunPage();">
<i class="material-icons">directions_run</i>Start Running!
</div>
</div>
<div class="mdl-card__menu">
<button class="mdl-button mdl-button--icon mdl-js-button mdl-js-ripple-effect">
<i class="material-icons">share</i>
</button>
</div>
</div>
<!-- Contact Chip -->
<span id='chip' class="mdl-chip mdl-chip--contact" style="width:92vw">
<span class="mdl-chip__contact mdl-color--green mdl-color-text--white">
<i class="material-icons md-36">check</i>
</span>
<span class="mdl-chip__text">
<b>PREVIOUS RUNS </b> Click to view Details or to Re-Run
</span>
</span>
<!-- Previous runs will be generated by JavaScript inside this div element-->
<div id="prevRunDiv"></div>
</div>
</main>
</div>
</main>
<div id="toast" class="mdl-js-snackbar mdl-snackbar">
<div class="mdl-snackbar__text"></div>
<button class="mdl-snackbar__action" type="button"></button>
</div>
</div>
<!-- JavaScript files: -->
<script defer src="https://code.getmdl.io/1.2.1/material.min.js"></script>
<script src="js/shared.js"></script>
<script src="js/mainPage.js">
</script>
</body>
</html>