Add some basic styling

main
Jasper Bok 2023-08-13 18:27:30 +02:00
parent de70977890
commit 98445c9b10
2 changed files with 59 additions and 12 deletions

View File

@ -12,20 +12,26 @@
<title>Busvertrektijden</title>
</head>
<body>
{{ range .Quays }}
<article>
<h2>{{ .Name }}</h2>
<p>{{ .Town }}</p>
<header>
<h1>Busvertrektijden</h1>
</header>
<dl>
{{ range $i, $val := .Departures }}
{{ if lt $i 3 }}
<dt>{{ $val.RouteShortName }} | {{ $val.StopHeadsign }}</dt>
<dd><time>{{ formatTime $val.DepartureTime }}</time></dd>
<main>
{{ range .Quays }}
<article>
<h2>{{ .Name }}</h2>
<p>{{ .Town }}</p>
<dl>
{{ range $i, $val := .Departures }}
{{ if lt $i 3 }}
<dt>{{ $val.RouteShortName }} | {{ $val.StopHeadsign }}</dt>
<dd><time>{{ formatTime $val.DepartureTime }}</time></dd>
{{ end }}
{{ end }}
</dl>
</article>
{{ end }}
</dl>
</article>
{{ end }}
</main>
</body>
</html>

View File

@ -1,7 +1,48 @@
html {
font-family: sans-serif;
font-size: 16px;
}
body {
margin: 0;
padding: 0;
}
h1 {
margin: 0;
}
h2 {
font-size: 1.4rem;
margin-bottom: 2px;
}
p {
font-style: italic;
margin-top: 0;
}
dt {
display: inline-block;
font-weight: bold;
}
dd {
display: inline;
}
dd::after {
content: "\A";
white-space: pre;
}
header {
background: #000;
color: #fff;
padding: 1rem 2rem;
text-align: center;
}
main {
padding: 1rem 2rem;
}