summaryrefslogtreecommitdiffstats
path: root/templates/weather.tmpl
blob: 904e45b574178ba89317ee9c9f26daabdfb61af6 (plain) (blame)
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
<!DOCTYPE html>
<html lang="en">
	<head>
		<meta charset="UTF-8">
		<title>peach - {{.Location}}</title>
		<meta name="viewport" content="width=device-width, initial-scale=1.0" />
		<meta name="author" content="siddharth">
		<link rel="preload" href="/static/peach.css" as="style" />
		<style>@import url("/static/peach.css");</style>
	</head>
	<body>
		<div class="root-container">
			<div class="header-container">
				<header class="header">
					<hgroup>
						<h1>{{.Location}}</h1>
					</hgroup>
				</header>
			</div>

			<div class="main-container">
				<div class="period-container">

					<div class="now-container">
						<div class="temperature-forecast-container">
							<div class="temperature">
								{{.Now.Temperature}}{{.Now.TemperatureUnit}}
							</div>
							<div class="forecast">
								{{.Now.Forecast}}
							</div>
						</div> <!-- temperature-forecast-container -->

						<div class="wind">
							{{.Now.WindSpeed}} {{.Now.WindDirection}}
						</div>
					</div> <!-- now-container end -->

					<div class="current-period">
						<p class="forecast">{{.Period.Forecast}}</p>
					</div>
				</div> <!-- period-container end -->
			</div>  <!-- main-container end -->

			{{ if .Timeline }}
			<div class="timeline">
				<div class="container">
					{{ range .Timeline.Periods }}
					<div class="period">
						<p class="temperature">{{.Temperature}}{{.TemperatureUnit}}</p>
						<p class="hour">{{printf "%d" .Hour}}hrs</p>
					</div>
					{{ end }}
				</div>
			</div>
			{{ end }}

		</div> <!-- root-container end -->
	</body>
</html>