diff options
Diffstat (limited to 'cgi')
| -rw-r--r-- | cgi/public/default.css | 335 | ||||
| -rw-r--r-- | cgi/templates/layouts/default.html.ep | 348 | 
2 files changed, 337 insertions, 346 deletions
| diff --git a/cgi/public/default.css b/cgi/public/default.css new file mode 100644 index 0000000..3d19c50 --- /dev/null +++ b/cgi/public/default.css @@ -0,0 +1,335 @@ +html { +	font-family: Sans-Serif; +} + +div.displayclean { +	background-color:#F8F8F8; +	border-width:1px 2px; +	width:100%; +	margin-bottom: 5em; +} + +div.displayclean > ul { +	position:relative; +	width:100%; +	background-color:#F8F8F8; + +	list-style-type:none; +	margin:0; +	padding:0; +	border-bottom: 1px solid #cccccc; +} + +div.displayclean > ul > li { +	min-height:7em; +	background-color:#F8F8F8; +	display:block; +	border-width:1px 0; +	border-style:solid; +	border-color:#CCCCCC; +	width:100%; +	position:relative; +} + +div.displayclean li .line { +	color:#FFFFFF; +	background-color:#666666; +	font-weight:bold; +	font-size: 3em; +	padding:3px 8px 2px 5px; +	position:absolute; +	top:7px; +	left:2px; +} + +div.displayclean li .route { +	color:#444444; +	font-size:2.1em; +	position:absolute; +	top:5px; +	left:8em; +	height: 1em; +	width: 70%; +	overflow: hidden; +} + +div.displayclean li .info { +	color:#ff0000; +	font-size:2.1em; +	position:absolute; +	top:5px; +	left:8em; +	height: 1em; +	width: 70%; +	overflow: hidden; +} + +div.displayclean li .moreinfo { +	color:#000000; +	font-size:2.1em; +	position:absolute; +	top:5px; +	left:8em; +	min-height: 1em; +	width: 70%; +	background-color: white; +	border: 1px solid black; +	z-index: 5; +	visibility: hidden; +} + +div.displayclean li:hover .moreinfo, +div.displayclean li .moreinfo:hover { +	visibility: visible; +} + +div.displayclean li .moreinfo .reason { +	color: #ff0000; +} + +div.displayclean li .dest { +	color:#000000; +	font-weight:bold; +	font-size:4em; +	position:absolute; +	top:0.8em; +	left:4.2em; +	width: 70%; +	overflow: hidden; +} + +div.displayclean li .countdown { +	color:#000000; +	font-size:3em; +	position:absolute; +	right:5px; +	bottom:2px; +} + +div.displayclean li .header { +	color:#000000; +	font-size:2em; +	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:1em; +	color:#FF0000; +	padding-right:7px; +} + +div.displayclean li .countdown .platform { +	font-weight: bold; +} + +div.displayclean li .time { +	color:#000000; +	font-size:2.4em; +	position:absolute; +	right:5px; +	top:5px; +} + +div.displaymulti { +	border: 0.2em solid #000066; +	width: 55em; +} + +div.displaymulti div.display { +	background-color: #0000ff; +	color: white; +	font-family: Sans-Serif; +	font-weight: bold; +	position: relative; +	margin-bottom: 0; +	margin-top: 0; +	padding-top: 0; +	padding-bottom: 0; +	width: 55em; +	height: 1.4em; +} + +div.displaymulti div.display div { +	overflow: hidden; +	position: absolute; +	height: 100%; +} + +div.displaymulti div.time { +	left: 0; +	width: 6%; +	font-size: 95%; +} + +div.displaymulti div.train { +	left: 5%; +	width: 9%; +	background-color: white; +	color: #0000ff; +	font-size: 95%; +} + +div.displaymulti div.via { +	left: 15%; +	width: 35%; +} + +div.displaymulti div.via span { +	margin-right: 0.4em; +	font-size: 80%; +} + +div.displaymulti div.destination { +	left: 50%; +	width: 25%; +	font-size: 120%; +} + +div.displaymulti div.platform { +	left: 75%; +	width: 5%; +} + +div.displaymulti div.info { +	left: 80%; +	width: 20%; +	background-color: white; +	color: #0000ff; +	font-size: 80%; +	line-height: 150%; +} + +div.displaymulti div.separator { +	border-bottom: 0.1em solid #000066; +} + +div.displaysingle div.display { +	background-color: #0000ff; +	color: white; +	font-family: Sans-Serif; +	font-weight: bold; +	position: relative; +	margin-left: 1em; +	margin-top: 1em; +	float: left; +	width: 28em; +	height: 4.5em; +	border: 0.7em solid #000066; +} + +div.displaysingle div.display div { +	overflow: hidden; +	position: absolute; +} + +div.displaysingle div.no_data { +	top: 0.5em; +	left: 1em; +	font-size: 1.7em; +} + +div.displaysingle div.time { +	top: 0em; +	left: 0em; +	font-size: 1.7em; +} + +div.displaysingle div.train { +	left: 0em; +	top: 1.8em; +} + +div.displaysingle div.via { +	top: 1.5em; +	left: 5.8em; +	width: 17em; +	height: 1em; +} + +div.displaysingle div.via span { +	margin-right: 0.4em; +} + +div.displaysingle div.destination { +	top: 1.6em; +	left: 3.6em; +	width: 12em; +	font-size: 1.6em; +	height: 1.2em; +} + +div.displaysingle div.platform { +	top: 0em; +	right: 0em; +	font-size: 3em; +} + +div.displaysingle div.info { +	top: 0em; +	left: 5.8em; +	width: 16.5em; +	height: 1em; +	background-color: white; +	color: #0000ff; +} + +div.about { +	font-family: Sans-Serif; +	color: #666666; +} + +div.about a { +	color: #000066; +	text-decoration: none; +} + +div.error { +	font-size: 150%; +	font-weight: bold; +	color: #ee0000; +} + +pre { +	margin-bottom: 2em; +} + +span.optional, +span.notes { +	color: #666666; +} + +div.break { +	heighT: 1em; +} + +div.field { +	width: 100%; +	clear: both; +} + +div.field div.desc { +	float: left; +	width: 14em; +	text-align: right; +	padding-right: 0.5em; +} + +input, select { +	border: 1px solid black; +} + +div.notes { +	margin-top: 4em; +} + +div.notes ul { +	margin-top: 1em; +} diff --git a/cgi/templates/layouts/default.html.ep b/cgi/templates/layouts/default.html.ep index 88ae09b..8600b8f 100644 --- a/cgi/templates/layouts/default.html.ep +++ b/cgi/templates/layouts/default.html.ep @@ -7,359 +7,15 @@  	<meta http-equiv="refresh" content="<%= $self->stash('refresh_interval') %>"/>  % } -	<style type="text/css"> -	html { -		font-family: Sans-Serif; -	} - -% if ($hide_opts) { -	body { -		margin: 0; -		padding: 0; -	} -% } - -	div.displayclean { -		background-color:#F8F8F8; -		border-width:1px 2px; -		width:100%; -		margin-bottom: 5em; -	} - -	div.displayclean > ul { -		position:relative; -		width:100%; -		background-color:#F8F8F8; - -		list-style-type:none; -		margin:0; -		padding:0; -		border-bottom: 1px solid #cccccc; -	} - -	div.displayclean > ul > li { -		min-height:7em; -		background-color:#F8F8F8; -		display:block; -		border-width:1px 0; -		border-style:solid; -		border-color:#CCCCCC; -		width:100%; -		position:relative; -	} - -	div.displayclean li .line { -		color:#FFFFFF; -		background-color:#666666; -		font-weight:bold; -		font-size: 3em; -		padding:3px 8px 2px 5px; -		position:absolute; -		top:7px; -		left:2px; -	} - -	div.displayclean li .route { -		color:#444444; -		font-size:2.1em; -		position:absolute; -		top:5px; -		left:8em; -		height: 1em; -		width: 70%; -		overflow: hidden; -	} - -	div.displayclean li .info { -		color:#ff0000; -		font-size:2.1em; -		position:absolute; -		top:5px; -		left:8em; -		height: 1em; -		width: 70%; -		overflow: hidden; -	} - -	div.displayclean li .moreinfo { -		color:#000000; -		font-size:2.1em; -		position:absolute; -		top:5px; -		left:8em; -		min-height: 1em; -		width: 70%; -		background-color: white; -		border: 1px solid black; -		z-index: 5; -		visibility: hidden; -	} - -	div.displayclean li:hover .moreinfo, -	div.displayclean li .moreinfo:hover { -		visibility: visible; -	} - -	div.displayclean li .moreinfo .reason { -		color: #ff0000; -	} - -	div.displayclean li .dest { -		color:#000000; -		font-weight:bold; -		font-size:4em; -		position:absolute; -		top:0.8em; -		left:4.2em; -		width: 70%; -		overflow: hidden; -	} - -	div.displayclean li .countdown { -		color:#000000; -		font-size:3em; -		position:absolute; -		right:5px; -		bottom:2px; -	} - -	div.displayclean li .header { -		color:#000000; -		font-size:2em; -		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:1em; -		color:#FF0000; -		padding-right:7px; -	} - -	div.displayclean li .countdown .platform { -		font-weight: bold; -	} - -	div.displayclean li .time { -		color:#000000; -		font-size:2.4em; -		position:absolute; -		right:5px; -		top:5px; -	} - -	div.displaymulti { -		border: 0.2em solid #000066; -		width: 55em; -	} - -	div.displaymulti div.display { -		background-color: #0000ff; -		color: white; -		font-family: Sans-Serif; -		font-weight: bold; -		position: relative; -		margin-bottom: 0; -		margin-top: 0; -		padding-top: 0; -		padding-bottom: 0; -		width: 55em; -		height: 1.4em; -	} - -	div.displaymulti div.display div { -		overflow: hidden; -		position: absolute; -		height: 100%; -	} - -	div.displaymulti div.time { -		left: 0; -		width: 6%; -		font-size: 95%; -	} - -	div.displaymulti div.train { -		left: 5%; -		width: 9%; -		background-color: white; -		color: #0000ff; -		font-size: 95%; -	} - -	div.displaymulti div.via { -		left: 15%; -		width: 35%; -	} - -	div.displaymulti div.via span { -		margin-right: 0.4em; -		font-size: 80%; -	} - -	div.displaymulti div.destination { -		left: 50%; -		width: 25%; -		font-size: 120%; -	} - -	div.displaymulti div.platform { -		left: 75%; -		width: 5%; -	} - -	div.displaymulti div.info { -		left: 80%; -		width: 20%; -		background-color: white; -		color: #0000ff; -		font-size: 80%; -		line-height: 150%; -	} - -	div.displaymulti div.separator { -		border-bottom: 0.1em solid #000066; -	} - -	div.displaysingle div.display { -		background-color: #0000ff; -		color: white; -		font-family: Sans-Serif; -		font-weight: bold; -		position: relative; -		margin-left: 1em; -		margin-top: 1em; -		float: left; -		width: 28em; -		height: 4.5em; -		border: 0.7em solid #000066; -	} - -	div.displaysingle div.display div { -		overflow: hidden; -		position: absolute; -	} - -	div.displaysingle div.no_data { -		top: 0.5em; -		left: 1em; -		font-size: 1.7em; -	} - -	div.displaysingle div.time { -		top: 0em; -		left: 0em; -		font-size: 1.7em; -	} - -	div.displaysingle div.train { -		left: 0em; -		top: 1.8em; -	} - -	div.displaysingle div.via { -		top: 1.5em; -		left: 5.8em; -		width: 17em; -		height: 1em; -	} - -	div.displaysingle div.via span { -		margin-right: 0.4em; -	} - -	div.displaysingle div.destination { -		top: 1.6em; -		left: 3.6em; -		width: 12em; -		font-size: 1.6em; -		height: 1.2em; -	} - -	div.displaysingle div.platform { -		top: 0em; -		right: 0em; -		font-size: 3em; -	} - -	div.displaysingle div.info { -		top: 0em; -		left: 5.8em; -		width: 16.5em; -		height: 1em; -		background-color: white; -		color: #0000ff; -	} - -	div.about { -		font-family: Sans-Serif; -		color: #666666; -	} - -	div.about a { -		color: #000066; -		text-decoration: none; -	} - -	div.error { -		font-size: 150%; -		font-weight: bold; -		color: #ee0000; -	} - -	pre { -		margin-bottom: 2em; -	} - -	span.optional, -	span.notes { -		color: #666666; -	} - -	div.break { -		heighT: 1em; -	} - -	div.field { -		width: 100%; -		clear: both; -	} - -	div.field div.desc { -		float: left; -		width: 14em; -		text-align: right; -		padding-right: 0.5em; -	} - -	input, select { -		border: 1px solid black; -	} - -	div.notes { -		margin-top: 4em; -	} - -	div.notes ul { -		margin-top: 1em; -	} - -	</style> +	%= stylesheet '/default.css'  	%= javascript '/jquery-1.10.2.min.js'  	%= javascript '/marquee.js'  	%= javascript begin  	$(function () {  $('marquee').marquee() });  	% end  </head> -<body> +<body style="<%= ($hide_opts ? 'margin: 0; padding: 0;' : q{}) %>">  % if (my $error = stash 'error') {  <div class="error">Received an error from the backend service:</div> | 
