add preliminary support for a dark layout (5109d2a4) · Commits · derf / db-infoscreen

public/static/default.css

+68 −7

Original line number	Diff line number	Diff line
		@@ -25,9 +25,17 @@ div.displayclean > ul {
		div.displayclean > ul > li {
		min-height:7em;
		display:block;
		border-bottom: 1px solid #999999;
		width:100%;
		position:relative;
		}

		div.displaycleandark > ul > li {
		border-bottom: 1px solid #999999;
		background-color: #000000;
		}

		div.displaycleanlight > ul > li {
		border-bottom: 1px solid #999999;
		background-color: #ffffff;
		}

		@@ -63,27 +71,47 @@ div.displayclean .replaced {

		div.displayclean li .sbahn {
		font-weight:bold;
		background-color:#95d79f;
		border-radius: 30px;
		padding:3px 6px 2px 6px;
		}

		div.displaycleanlight li .sbahn {
		background-color:#95d79f;
		}

		div.displaycleandark li .sbahn {
		background-color:#115511;
		}

		div.displayclean li .bahn {
		font-weight:bold;
		border-radius: 5px;
		padding:3px 5px 2px 5px;
		}

		div.displaycleanlight li .bahn {
		background-color: #eeeeee;
		}

		div.displaycleandark li .bahn {
		background-color: #333333;
		}

		div.displayclean li .fern {
		font-weight:bold;
		border-radius: 5px;
		padding:3px 5px 2px 5px;
		}

		div.displaycleanlight li .fern {
		background-color: #ffdddd;
		}

		div.displaycleandark li .fern {
		background-color: #551111;
		}

		div.displayclean li .route {
		color:#444444;
		font-size:2.1em;
		position:absolute;
		top:5px;
		@@ -93,6 +121,14 @@ div.displayclean li .route {
		overflow: hidden;
		}

		div.displaycleanlight li .route {
		color:#444444;
		}

		div.displaycleandark li .route {
		color:#bbbbbb;
		}

		div.displayclean li .info {
		color:#ff0000;
		font-size:2.1em;
		@@ -175,7 +211,6 @@ div.displayclean li .moreinfo .mroute .cancelled-stop {
		}

		div.displayclean li .dest {
		color:#000000;
		/font-weight:bold;/
		font-size:4em;
		position:absolute;
		@@ -186,12 +221,23 @@ div.displayclean li .dest {
		overflow: hidden;
		}

		div.displayclean li.cancelled {
		div.displaycleanlight li .dest {
		color:#000000;
		}

		div.displaycleandark li .dest {
		color:#ffffff;
		}

		div.displaycleanlight li.cancelled {
		background-color: #ffe7d0;
		}

		div.displaycleandark li.cancelled {
		background-color: #512f00;
		}

		div.displayclean li .countdown {
		color: #000000;
		background-color: inherit;
		font-size: 3em;
		position: absolute;
		@@ -200,6 +246,14 @@ div.displayclean li .countdown {
		padding-left: 0.2em;
		}

		div.displaycleanlight li .countdown {
		color: #000000;
		}

		div.displaycleandark li .countdown {
		color: #ffffff;
		}

		div.displayclean li .header {
		color:#000000;
		font-size:2em;
		@@ -248,7 +302,6 @@ div.displayclean li .countdown .changed-platform {
		}

		div.displayclean li .time {
		color:#000000;
		background-color: inherit;
		font-size:2.4em;
		position:absolute;
		@@ -257,6 +310,14 @@ div.displayclean li .time {
		padding-left: 0.2em;
		}

		div.displaycleanlight li .time {
		color:#000000;
		}

		div.displaycleandark li .time {
		color:#ffffff;
		}

		div.displayclean span.delayed {
		color: #ff0000;
		background-color: inherit;

templates/clean.html.ep

+6 −1

Original line number	Diff line number	Diff line
		% if (@{$departures}) {

		<div class="displayclean">
		% if (param('dark')) {
		<div class="displayclean displaycleandark">
		% }
		% else {
		<div class="displayclean displaycleanlight">
		% }
		<ul>
		% my $i = 0;
		% my $dt_now = DateTime->now;

templates/layouts/default.html.ep

+10 −1

Original line number	Diff line number	Diff line
		@@ -27,7 +27,8 @@
		%= javascript '/static/geolocation.js'
		% }
		</head>
		<body style="<%= (stash('hide_opts') ? 'margin: 0; padding: 0;' : q{}) %>">
		<body style="<%= (stash('hide_opts') ? 'margin: 0; padding: 0;' : q{}) %>
		<%= (param('dark') ? 'background-color: #000000; color: #ffffff;' : q{}) %>">

		<div class="container">
		% if (my $error = stash 'error') {
		@@ -112,6 +113,14 @@ Bitte eine Station aus der Liste auswählen</div>
		</label>
		</div>
		</div>
		<div class="field">
		<div class="desc">
		%= check_box 'dark' => 1, id => 'id_dark'
		<label for="id_dark">
		Dunkles Layout (experimentell)
		</label>
		</div>
		</div>
		<div class="field">
		<div class="desc">
		%= check_box 'hide_opts' => 1, id => 'id_hide_opts'

Admin message