summaryrefslogtreecommitdiff
path: root/cgi/templates/layouts
diff options
context:
space:
mode:
authorDaniel Friesel <derf@finalrewind.org>2013-12-12 15:01:52 +0100
committerDaniel Friesel <derf@finalrewind.org>2013-12-12 15:01:52 +0100
commit4affeeffb8f9b84f905475982ab93ba785ee7016 (patch)
tree6c0097444fd2f0bf7831478b14b10a1df0b206c9 /cgi/templates/layouts
parent07a5d91dc3ba22b80ebb583cb690b54dc6505f8b (diff)
add oeffi-like "clean" display. Still quite experimental
(copied from https://wiki.die-foobar.de/wiki/Infoscreen sources)
Diffstat (limited to 'cgi/templates/layouts')
-rw-r--r--cgi/templates/layouts/default.html.ep151
1 files changed, 103 insertions, 48 deletions
diff --git a/cgi/templates/layouts/default.html.ep b/cgi/templates/layouts/default.html.ep
index a47a2f7..1f1c952 100644
--- a/cgi/templates/layouts/default.html.ep
+++ b/cgi/templates/layouts/default.html.ep
@@ -20,72 +20,127 @@
}
% }
- div.displayclean div.display {
- font-family: Sans-Serif;
- position: relative;
- margin-bottom: 0;
- margin-top: 0;
- padding-top: 0;
- padding-bottom: 0;
- width: 100%;
- height: 4.4em;
+ div.displayclean {
+ background-color:#F8F8F8;
+ position:absolute;
+ top:5px;
+ left:5px;
+ border-width:1px 2px;
+ width:100%;
+ height:499px;
+ }
+
+ div.displayclean ul {
+ position:absolute;
+ width:100%;
+ background-color:#F8F8F8;
+ top: -3px;
+ left: 0;
+
+ list-style-type:none;
+ margin:0;
+ padding:0;
+ border-width:1px 0 25px;
+ border-style:solid;
+ border-color:#CCCCCC;
}
- div.displayclean div.display div {
- overflow: hidden;
- position: absolute;
- height: 100%;
+ div.displayclean li {
+ height:70px;
+ background-color:#F8F8F8;
+ padding:5px;
+ display:block;
+ border-width:1px 0;
+ border-style:solid;
+ border-color:#CCCCCC;
+ width:95%;
+ position:relative;
}
- div.displayclean div.time {
- left: 0;
- top: 10%;
- height: 1em;
- font-size: 150%;
+ div.displayclean li .line {
+ color:#FFFFFF;
+ background-color:#666666;
+ font-weight:bold;
+ font-size:28px;
+ padding:3px 8px 2px 5px;
+ position:absolute;
+ top:7px;
+ left:1%;
}
- div.displayclean div.train {
- left: 0;
- width: 42%;
- color: #000000;
- font-size: 200%;
- font-weight: bold;
- text-align: right;
+ div.displayclean li .tram {
+ background-color:#CC0000;
}
- div.displayclean div.via {
- top: 57%;
- left: 44%;
+ div.displayclean li .sbahn {
+ background-color:#006E10;
+ -webkit-border-radius: 30px;
+ -moz-border-radius: 30px;
+ border-radius: 30px;
}
- div.displayclean div.via span {
- margin-right: 0.4em;
- font-size: 95%;
- color: #333333;
+ div.displayclean li .ubahn {
+ background-color:#001090;
}
- div.displayclean div.destination {
- left: 44%;
- width: 78%;
- font-size: 200%;
+ div.displayclean li .bus {
+ background-color:#991199;
+ -webkit-border-radius: 10px;
+ -moz-border-radius: 10px;
+ border-radius: 10px;
}
- div.displayclean div.platform {
- right: 0;
- font-size: 200%;
+ div.displayclean li .route {
+ color:#444444;
+ font-size:21px;
+ position:absolute;
+ top:5px;
+ left:10em;
}
- div.displayclean div.info {
- left: 0;
- top: 57%;
- width: 44%;
- font-size: 80%;
- line-height: 150%;
- color: #dd0000;
+ div.displayclean li .dest {
+ color:#000000;
+ font-weight:bold;
+ font-size:46px;
+ position:absolute;
+ top:23px;
+ left:4.5em;
}
- div.displayclean div.separator {
- border-bottom: 0.1em solid #000066;
+ div.displayclean li .countdown {
+ color:#000000;
+ font-size:48px;
+ position:absolute;
+ right:5px;
+ bottom:2px;
+ }
+
+ div.displayclean li .header {
+ color:#000000;
+ font-size:55px;
+ font-weight:bold;
+ padding-top:8px;
+ border-width-top:0;
+ display:block;
+ text-align:center;
+ }
+
+ div.displayclean li .head {
+ border-bottom-width:0;
+ }
+
+ div.displayclean li .countdown .delay {
+ font-size:38px;
+ color:#FF0000;
+ padding-right:7px;
+ }
+
+ div.displayclean li .time {
+ color:#000000;
+ font-size:24px;
+ position:absolute;
+ right:5px;
+ top:5px;
}
div.displaymulti {