departure board: now-jump button and styled hafas/iris switch button

public/static/js/travelynx-actions.js

@@ -298,6 +298,10 @@ $(document).ready(function() {
 	$('a[href]').click(function() {
 		$('nav .preloader-wrapper').addClass('active');
 	});
+	$('a[href="#now"]').click(function(event) {
+	    event.preventDefault();
+	    $('#now')[0].scrollIntoView({behavior: "smooth", block: "center"});
+	});
 	const elems = document.querySelectorAll('.carousel');
 	const instances = M.Carousel.init(elems, {
 		fullWidth: true,

templates/departures.html.ep

@@ -7,18 +7,20 @@
 		% }
 	</div>
 </div>
-% if ($api_link) {
-	<div class="row">
-		<div class="col s12 center-align">
-			% if (param('hafas')) {
-				<a href="<%= $api_link %>">zum Schienenverkehr</a>
-			% }
-			% else {
-				<a href="<%= $api_link %>">zum Nahverkehr</a>
-			% }
-		</div>
+<div class="row">
+	<div class="col s12">
+	% if ($api_link) {
+	% if (param('hafas')) {
+		<a href="<%= $api_link %>" class="btn-small"><i class="material-icons left">train</i>zum Schienenverkehr</a>
+	% }
+	% else {
+		<a href="<%= $api_link %>" class="btn-small"><i class="material-icons left">directions</i>zum Nahverkehr</a>
+	% }
+	% }
+	<a class="btn-small" href="#now"><i class="material-icons left">vertical_align_center</i>Jetzt</a>
 	</div>
-% }
+</div>
+
 % my $have_connections = 0;
 % if ($user_status->{checked_in}) {
 	<div class="row">