2 files changed, 124 insertions, 1 deletions
diff --git a/cgi/templates/clean.html.ep b/cgi/templates/clean.html.ep
new file mode 100644
index 0000000..021b7f1
--- /dev/null
+++ b/cgi/templates/clean.html.ep
@@ -0,0 +1,55 @@
+% if (@{$departures}) {
+
+<div class="displayclean">
+% my $i = 0;
+% for my $departure (@{$departures}) {
+% $i++;
+
+<div class="display <% if (($i % 2) == 0) { %> separator<% } %>">
+
+<div class="train">
+%= $departure->{train}
+</div>
+
+<div class="destination">
+%= $departure->{destination}
+</div>
+
+<div class="platform">
+%= $departure->{platform}
+</div>
+
+<div class="time">
+%= $departure->{time}
+</div>
+
+<div class="via">
+% my $via_max = @{$departure->{via}};
+% my $via_cur = 0;
+% for my $stop (@{$departure->{via}}) {
+% $via_cur++;
+<span><%= $stop %><% if ($via_cur < $via_max) { %> - <% } %></span>
+% }
+</div>
+
+% if ($departure->{info}) {
+<div class="info">
+%= $departure->{info}
+</div>
+% }
+
+</div> <!-- display -->
+
+% }
+
+</div> <!-- outer -->
+
+% }
+% else {
+
+<p>
+DB-Fakedisplay displays the next departures at a DB station, just like the big
+LC display in the station itself.
+</p>
+
+% }
diff --git a/cgi/templates/layouts/default.html.ep b/cgi/templates/layouts/default.html.ep
index 9d00483..a47a2f7 100644
--- a/cgi/templates/layouts/default.html.ep
+++ b/cgi/templates/layouts/default.html.ep
@@ -20,6 +20,74 @@
 	}
 % }
 
+	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 div.display div {
+		overflow: hidden;
+		position: absolute;
+		height: 100%;
+	}
+
+	div.displayclean div.time {
+		left: 0;
+		top: 10%;
+		height: 1em;
+		font-size: 150%;
+	}
+
+	div.displayclean div.train {
+		left: 0;
+		width: 42%;
+		color: #000000;
+		font-size: 200%;
+		font-weight: bold;
+		text-align: right;
+	}
+
+	div.displayclean div.via {
+		top: 57%;
+		left: 44%;
+	}
+
+	div.displayclean div.via span {
+		margin-right: 0.4em;
+		font-size: 95%;
+		color: #333333;
+	}
+
+	div.displayclean div.destination {
+		left: 44%;
+		width: 78%;
+		font-size: 200%;
+	}
+
+	div.displayclean div.platform {
+		right: 0;
+		font-size: 200%;
+	}
+
+	div.displayclean div.info {
+		left: 0;
+		top: 57%;
+		width: 44%;
+		font-size: 80%;
+		line-height: 150%;
+		color: #dd0000;
+	}
+
+	div.displayclean div.separator {
+		border-bottom: 0.1em solid #000066;
+	}
+
 	div.displaymulti {
 		border: 0.2em solid #000066;
 		width: 55em;
@@ -280,7 +348,7 @@
       display type
     </div>
     <div>
-      %= select_field mode => [['combined' => 'multi'], ['platform' => 'single']]
+      %= select_field mode => [['combined' => 'multi'], ['platform' => 'single'], ['non-DB' => 'clean']]
     </div>
   </div>
   <div class="field">