88 lines
2 KiB
HTML
88 lines
2 KiB
HTML
<style>
|
|
#flex-container {
|
|
border: 1px solid black;
|
|
border-radius: 0.25rem;
|
|
overflow: auto;
|
|
scroll-snap-type: x mandatory;
|
|
display: flex;
|
|
}
|
|
article {
|
|
flex-wrap: row nowrap;
|
|
border: none;
|
|
flex: 0 0 30rem;
|
|
}
|
|
a,
|
|
h1,
|
|
h2 {
|
|
display: block;
|
|
text-align: center;
|
|
}
|
|
article {
|
|
background-size: contain;
|
|
box-sizing: border-box;
|
|
filter: drop-shadow(6px 6px -10px white);
|
|
width: 100%;
|
|
padding: 20px;
|
|
}
|
|
#kursive {
|
|
font-style: italic;
|
|
}
|
|
img {
|
|
border-radius: 1rem;
|
|
width: 100%;
|
|
aspect-ratio: 4/3;
|
|
object-fit: contain;
|
|
}
|
|
a {
|
|
color: black;
|
|
}
|
|
h2 {
|
|
text-align: center;
|
|
}
|
|
#gray {
|
|
font-size: 0.75rem;
|
|
display: block;
|
|
text-align: center;
|
|
color: rgb(181, 181, 181);
|
|
}
|
|
button {
|
|
padding: 10px;
|
|
margin: 5px;
|
|
border: black;
|
|
border-radius: 20px;
|
|
}
|
|
#logo{
|
|
object-fit: scale-down;
|
|
}
|
|
#logocontaner{
|
|
margin: 0 auto;
|
|
height: 25%;
|
|
width: 25%;
|
|
}
|
|
#logo{
|
|
height: 260px;
|
|
scale: 105%;
|
|
|
|
}
|
|
#logocontaner{
|
|
margin: 0 auto;
|
|
}
|
|
</style>
|
|
<a href="/" id="logocontaner"><img id="logo" src="https://commons.wikimedia.org/w/index.php?title=Special:Redirect/file/Eurovision_Song_Contest_Heart_Wikidata.svg&width=300"></img></a>
|
|
<h1>ESC Playlist</h1>
|
|
<a href="/suche?liste={{liste}}"
|
|
>Du willst ein weiteres Lied in der Playlist?</a
|
|
>
|
|
<p>
|
|
Die Playlist {{liste}} ist insgesamt {{ gesamtLaenge | zeit }} lang und
|
|
enthält {{ karten|length }} Lieder
|
|
</p>
|
|
<p>
|
|
<button id="play" onclick="abspielen()">Abspielen</button
|
|
><button id="loop" onclick="looptrue()">Loop</button>
|
|
</p>
|
|
<div id="flex-container">
|
|
{% for karte in karten %} {% set karte_loop = loop %} {% include
|
|
"karte.html" %} {% endfor %}
|
|
</div>
|
|
<script src="static/script.js"></script>
|