diff options
| author | siddharth <s@ricketyspace.net> | 2022-05-23 00:00:13 -0400 |
|---|---|---|
| committer | siddharth <s@ricketyspace.net> | 2022-05-23 00:00:13 -0400 |
| commit | 6ac218b060b376d9c6174737cc881f8bd0d968c9 (patch) | |
| tree | 7f83e6711c09e155252f4ec9ec630b4b694233e0 /templates | |
| parent | f94d80072507f2aaf99f872c348e34918d96ca87 (diff) | |
template: update weather template
update structure and styling.
Diffstat (limited to 'templates')
| -rw-r--r-- | templates/weather.tmpl | 86 |
1 files changed, 48 insertions, 38 deletions
diff --git a/templates/weather.tmpl b/templates/weather.tmpl index 904e45b..9db2689 100644 --- a/templates/weather.tmpl +++ b/templates/weather.tmpl @@ -9,52 +9,62 @@ <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="peach"> + <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="main-container"> - <div class="period-container"> + <div class="wind-container"> + <div class="prop"> + Wind + </div> + <div class="value"> + {{.Now.WindSpeed}} {{.Now.WindDirection}} + </div> + </div> <!-- wind-container end --> + </div> <!-- now-container end --> + + <div class="current-period-container"> + <div class="forecast">{{.Period.Forecast}}</div> + </div> + </div> <!-- period-container end --> + </div> <!-- main-container end --> - <div class="now-container"> - <div class="temperature-forecast-container"> + {{ if .Timeline }} + <div class="timeline-container"> + <div class="periods-container"> + {{ range .Timeline.Periods }} + <div class="period"> <div class="temperature"> - {{.Now.Temperature}}{{.Now.TemperatureUnit}} + {{.Temperature}}{{.TemperatureUnit}} </div> - <div class="forecast"> - {{.Now.Forecast}} + <div class="hour"> + {{printf "%d" .Hour}}hrs </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> + {{ end }} </div> - {{ end }} </div> - </div> - {{ end }} + {{ end }} - </div> <!-- root-container end --> + </div> <!-- root-container end --> + </div> <!-- peach end --> </body> </html> |