Logo und andere kleinen Dinge

This commit is contained in:
mikka 2026-05-14 23:29:06 +02:00
parent 587f2546f9
commit 2623dfdf1a
9 changed files with 422 additions and 255 deletions

View file

@ -1,21 +1,23 @@
<style>
#flex-container{
#flex-container {
overflow: auto;
scroll-snap-type: x mandatory;
display: flex;
border: none;
gap: 5px;
}
article{
article {
flex-wrap: row nowrap;
border: none;
flex: 0 0 30rem;
}
a,h1,h2{
a,
h1,
h2 {
display: block;
text-align: center;
}
article{
article {
border: 2px solid;
border-radius: 15px;
border-color: black;
@ -23,43 +25,65 @@
width: 100%;
padding: 20px;
}
#kursive{
font-style: italic;
#kursive {
font-style: italic;
}
img{
img {
border-radius: 2%;
width: 100%;
aspect-ratio: 4/3;
object-fit: contain;
}
a{
a {
color: black;
}
h2{
h2 {
text-align: center;
}
article > a{
#gray {
font-size: 0.75rem;
display: block;
text-align: center;
color: rgb(181, 181, 181);
}
button{
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: 105%;
scale: 150%;
}
#logocontaner{
margin: 0 auto;
}
</style>
<a href="/" id="logocontaner"><img id="logo" src="/static/Eurovision_Song_Contest_heart_Wikidata_(20142025).svg"></img></a>
<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 {{ 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 %}
<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>
<script src="static/script.js"></script>