update styles

This commit is contained in:
matthias@matsewe.de
2024-05-21 14:38:42 +02:00
parent 88a6c4ada9
commit 32d2170a1b
2 changed files with 14 additions and 6 deletions

View File

@@ -23,7 +23,7 @@
.text {
padding: 0.3em;
margin-bottom: 0.5em;
margin-bottom: 0.7em;
display: inline-block;
}
@@ -225,10 +225,18 @@ h1 {
padding-left: 0.2em;
margin-bottom: 1rem;
font-size: 1.5em;
background-color: hsl(calc(var(--hue) * 360), 100%, 70%); /*color-mix(in srgb, var(--main-color) 60%, transparent);*/
}
#songs h1 {
background-color: color-mix(in srgb, hsl(calc(var(--hue) * 360), 100%, 40%) 50%, transparent);
border-bottom: 0.3rem solid hsl(calc(var(--hue) * 360), 100%, 40%);
}
body > h1 {
background-color: color-mix(in srgb, hsl(0, 0%, 40%) 50%, transparent);
border-bottom: 0.3rem solid hsl(0, 0%, 40%);
}
#yt-player,
#spotify-player {
position: fixed;

View File

@@ -79,7 +79,7 @@
}
function vote(song_id, vote) {
var session_id = "{{ session_id }}";
const session_id = "{{ session_id }}";
no_button = $("#song-" + song_id).find(".button-no")
yes_button = $("#song-" + song_id).find(".button-yes")
@@ -111,7 +111,7 @@
</head>
<body>
<h1 style="--main-color: #888888; ">Hallo :)</h1>
<h1>Hallo :)</h1>
<div class="text">Du kannst die Liederwahl jederzeit unterbrechen und zu einem späteren Zeitpunkt weitermachen.
</div>
<div id="songs">
@@ -131,7 +131,8 @@
song.aca_artist != song.og_artist %} / {{ song.aca_artist
}}{% endif %}{% else %}{{ song.aca_artist }}{% endif %}</div>
<div class="categories" id="container">{% for category_name, is_in_category in song.categories.items() %}{%
if is_in_category %}<span style="--hue: {{ all_categories[category_name] / all_categories|length }};">{{ category_name }}</span>{%
if is_in_category %}<span style="--hue: {{ all_categories[category_name] / all_categories|length }};">{{
category_name }}</span>{%
endif %}{% endfor %}<span style="--main-color: transparent;">&nbsp;</span>
</div>
<div class="vote-buttons">
@@ -151,7 +152,6 @@
</div>
{% endfor %}
{% endfor %}
</div>
<div id="spotify-player">
<div id="spotify-embed"></div>