58 lines
No EOL
1.3 KiB
HTML
58 lines
No EOL
1.3 KiB
HTML
<style>
|
|
#flex-container{
|
|
overflow: auto;
|
|
scroll-snap-type: x mandatory;
|
|
display: flex;
|
|
border: none;
|
|
gap: 5px;
|
|
}
|
|
article{
|
|
flex-wrap: row nowrap;
|
|
border: none;
|
|
flex: 0 0 30rem;
|
|
}
|
|
a,h1,h2{
|
|
display: block;
|
|
text-align: center;
|
|
}
|
|
article{
|
|
border: 2px solid;
|
|
border-radius: 15px;
|
|
border-color: black;
|
|
box-sizing: border-box;
|
|
width: 100%;
|
|
padding: 20px;
|
|
}
|
|
#kursive{
|
|
font-style: italic;
|
|
}
|
|
img{
|
|
border-radius: 2%;
|
|
width: 100%;
|
|
aspect-ratio: 4/3;
|
|
object-fit: contain;
|
|
}
|
|
a{
|
|
color: black;
|
|
}
|
|
h2{
|
|
text-align: center;
|
|
}
|
|
article > a{
|
|
font-size: 0.75rem;
|
|
display: block;
|
|
text-align: center;
|
|
color: rgb(181, 181, 181);
|
|
}
|
|
</style>
|
|
<h1>ESC Playlist</h1>
|
|
<h2>2026</h2>
|
|
<a href="/suche?liste={{liste}}">Du willst ein weiteres Lied in der Playlist?</a>
|
|
<p>Die Playlist {{liste}} ist insgesamt lang {{ gesamtLaenge | zeit }} und enthält {{ karten|length }} Lieder</p>
|
|
<div id = "flex-container">
|
|
{% for karte in karten %}
|
|
{% set karte_loop = loop %}
|
|
{% include "karte.html" %}
|
|
{% endfor %}
|
|
</div>
|
|
<script src="static/script.js"></script> |