diff options
| author | dakkar <dakkar@thenautilus.net> | 2013-07-07 12:55:12 +0100 |
|---|---|---|
| committer | dakkar <dakkar@thenautilus.net> | 2013-07-07 12:55:12 +0100 |
| commit | be17bfb8cd76af2d4f42bb81db8b959bc9620a48 (patch) | |
| tree | 8fc2c6626d520f6d47009b23bed03dba00f5ae9a /forecast.html.tt | |
| parent | gitignore (diff) | |
| download | HomePanel-be17bfb8cd76af2d4f42bb81db8b959bc9620a48.tar.gz HomePanel-be17bfb8cd76af2d4f42bb81db8b959bc9620a48.tar.bz2 HomePanel-be17bfb8cd76af2d4f42bb81db8b959bc9620a48.zip | |
png icons, and table for timeline
Diffstat (limited to 'forecast.html.tt')
| -rw-r--r-- | forecast.html.tt | 60 |
1 files changed, 29 insertions, 31 deletions
diff --git a/forecast.html.tt b/forecast.html.tt index eedc078..1a91bdd 100644 --- a/forecast.html.tt +++ b/forecast.html.tt @@ -26,33 +26,28 @@ <title>Forecast</title> <meta http-equiv="Content-type" content="text/html; charset=utf-8" /> <style type="text/css"> + body, table { font-size: 10px } + div.currently, div.next-hour, div.next-day { float: left; clear: none } + div.days { clear: both } + div.days dl { float: left; width: 30% } + + div.bus, div.tube { float: left } + + table { border-collapse: collapse; empty-cells: show } + table td { border: dotted thin black } + .icon img { width: 2em; height: 2em; float: left; } - .timeline { - position: relative; - height: 6em; - } .stripes { - position: absolute; text-align: center; border: solid thin black; - height: 2em; line-height: 2em; } .stripes span { font-size: 30%; vertical-align: middle; } - .timeline .summary > span { - top: 0; - } - .timeline .hours > span { - top: 2em; - } - .timeline .temperature > span { - top: 4em; - } </style> </head> <body> @@ -93,6 +88,7 @@ </div> <div class="days"> <div class="day today"> + <h2>Today</h2> <span class="icon"><img src="[% icon_for(today.icon) %]" alt="[% today.icon %]" /></span> <dl class="today"> <dt class="summary">Summary:</dt> @@ -107,22 +103,24 @@ <dd class="sunset"><span class="time">[% time(today.sunsetTime) %]</span></dd> </dl> <div class="timeline"> - <div class="summary"> - [% left=0 ;FOR span IN hourly.spans_by_string('summary'); - width=3*hours_length(span) %] - <span class="stripes" style="width: [% width %]em; left: [% left %]em"><span>[% span.value %]</span></span> - [% left=left+width; END %] - </div> - <div class="hours"> - [% left=0; FOR h IN hourly.data; BREAK IF loop.last %] - <span class="stripes" style="width: 3em; left: [% left %]em"><span>[% time(h.time) %]</span></span> - [% left=left+3; END %] - </div> - <div class="temperature"> - [% left=0; FOR h IN hourly.data; BREAK IF loop.last %] - <span class="stripes" style="width: 3em; left: [% left %]em"><span>[% h.temperature %]°</span></span> - [% left=left+3; END %] - </div> + <table class="timeline"> + <tr class="summary"> + [% FOR span IN hourly.spans_by_string('summary'); + width=hours_length(span) %] + <td class="stripes" colspan="[% width %]"><span>[% span.value %]</span></td> + [% END %] + </tr> + <tr class="hours"> + [% FOR h IN hourly.data; BREAK IF loop.last %] + <td class="stripes"><span>[% time(h.time) %]</span></td> + [% END %] + </tr> + <tr class="temperature"> + [% FOR h IN hourly.data; BREAK IF loop.last %] + <td class="stripes"><span>[% h.temperature %]°</span></td> + [% END %] + </tr> + </table> </div> </div> </div> |