Skip to content
This repository was archived by the owner on Oct 1, 2025. It is now read-only.

Commit 9408dcb

Browse files
committed
feat: Completed Work in Mapty App Section
1 parent caddaa8 commit 9408dcb

File tree

8 files changed

+638
-0
lines changed

8 files changed

+638
-0
lines changed
907 KB
Loading
714 KB
Loading

07-mapty/Mapty-flowchart.png

526 KB
Loading

07-mapty/icon.png

6.24 KB
Loading

07-mapty/index.html

Lines changed: 115 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,115 @@
1+
<!DOCTYPE html>
2+
<html lang="en">
3+
4+
<head>
5+
<meta charset="UTF-8" />
6+
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
7+
<meta http-equiv="X-UA-Compatible" content="ie=edge" />
8+
<link rel="shortcut icon" type="image/png" href="./icon.png" />
9+
10+
<link href="https://fonts.googleapis.com/css2?family=Manrope:wght@400;600;700;800&display=swap" rel="stylesheet" />
11+
12+
<link rel="stylesheet" href="https://unpkg.com/[email protected]/dist/leaflet.css"
13+
integrity="sha256-p4NxAoJBhIIN+hmNHrzRCf9tD/miZyoHS5obTRR9BMY=" crossorigin="" />
14+
<script defer src="https://unpkg.com/[email protected]/dist/leaflet.js"
15+
integrity="sha256-20nQCchB9co0qIjJZRGuk2/Z9VM+kNiyxNV1lvTlZBo=" crossorigin=""></script>
16+
17+
<link rel="stylesheet" href="style.css" />
18+
19+
<script defer src="script.js"></script>
20+
<title>mapty // Map your workouts</title>
21+
</head>
22+
23+
<body>
24+
<div class="sidebar">
25+
<img src="./logo.png" alt="Logo" class="logo" />
26+
27+
<ul class="workouts">
28+
<form class="form hidden">
29+
<div class="form__row">
30+
<label class="form__label">Type</label>
31+
<select class="form__input form__input--type">
32+
<option value="running">Running</option>
33+
<option value="cycling">Cycling</option>
34+
</select>
35+
</div>
36+
<div class="form__row">
37+
<label class="form__label">Distance</label>
38+
<input class="form__input form__input--distance" placeholder="km" />
39+
</div>
40+
<div class="form__row">
41+
<label class="form__label">Duration</label>
42+
<input class="form__input form__input--duration" placeholder="min" />
43+
</div>
44+
<div class="form__row">
45+
<label class="form__label">Cadence</label>
46+
<input class="form__input form__input--cadence" placeholder="step/min" />
47+
</div>
48+
<div class="form__row form__row--hidden">
49+
<label class="form__label">Elev Gain</label>
50+
<input class="form__input form__input--elevation" placeholder="meters" />
51+
</div>
52+
<button class="form__btn">OK</button>
53+
</form>
54+
55+
<!-- <li class="workout workout--running" data-id="1234567890">
56+
<h2 class="workout__title">Running on April 14</h2>
57+
<div class="workout__details">
58+
<span class="workout__icon">🏃‍♂️</span>
59+
<span class="workout__value">5.2</span>
60+
<span class="workout__unit">km</span>
61+
</div>
62+
<div class="workout__details">
63+
<span class="workout__icon">⏱</span>
64+
<span class="workout__value">24</span>
65+
<span class="workout__unit">min</span>
66+
</div>
67+
<div class="workout__details">
68+
<span class="workout__icon">⚡️</span>
69+
<span class="workout__value">4.6</span>
70+
<span class="workout__unit">min/km</span>
71+
</div>
72+
<div class="workout__details">
73+
<span class="workout__icon">🦶🏼</span>
74+
<span class="workout__value">178</span>
75+
<span class="workout__unit">spm</span>
76+
</div>
77+
</li>
78+
79+
<li class="workout workout--cycling" data-id="1234567891">
80+
<h2 class="workout__title">Cycling on April 5</h2>
81+
<div class="workout__details">
82+
<span class="workout__icon">🚴‍♀️</span>
83+
<span class="workout__value">27</span>
84+
<span class="workout__unit">km</span>
85+
</div>
86+
<div class="workout__details">
87+
<span class="workout__icon">⏱</span>
88+
<span class="workout__value">95</span>
89+
<span class="workout__unit">min</span>
90+
</div>
91+
<div class="workout__details">
92+
<span class="workout__icon">⚡️</span>
93+
<span class="workout__value">16</span>
94+
<span class="workout__unit">km/h</span>
95+
</div>
96+
<div class="workout__details">
97+
<span class="workout__icon">⛰</span>
98+
<span class="workout__value">223</span>
99+
<span class="workout__unit">m</span>
100+
</div>
101+
</li> -->
102+
</ul>
103+
104+
<p class="copyright">
105+
&copy; Copyright by
106+
<a class="twitter-link" target="_blank" href="https://twitter.com/jonasschmedtman">Jonas Schmedtmann</a>. Use for
107+
learning or your portfolio. Don't use to teach. Don't claim
108+
as your own.
109+
</p>
110+
</div>
111+
112+
<div id="map"></div>
113+
</body>
114+
115+
</html>

07-mapty/logo.png

18.5 KB
Loading

0 commit comments

Comments
 (0)