mini-player, global: wip style and change title temporarily

This commit is contained in:
Agahnim 2026-03-20 11:45:58 +01:00
parent 36208255b2
commit e60477813c
3 changed files with 21 additions and 11 deletions

View file

@ -6,6 +6,7 @@
--blue: #a2d2ff;
--darker-pink: #ff75a7;
--darkerer-pink: #ff4287;
--win-bg-grey: #c0c0c0;
}
body {
@ -30,7 +31,7 @@ navbar {
left: 0;
width: 100svw;
height: 3.5rem;
background-color: #c0c0c0;
background-color: var(--win-bg-grey);
border-bottom: 2px solid #000;
navbar-content {
@ -42,7 +43,7 @@ navbar {
padding: 4px 8px;
border: 2px solid;
border-color: #ffffff #808080 #808080 #ffffff;
background: #c0c0c0;
background: var(--win-bg-grey);
&:has(input:checked) {
background: #ff75a7;
@ -105,9 +106,18 @@ katcenkat {
/* Mini player */
miniplayer {
position: fixed;
top: 4rem;
left: 1rem;
top: 3.5rem;
left: 0;
z-index: 100;
background-color: var(--win-bg-grey);
border: 2px solid oklch(55.1% 0.027 264.364);
ominous-message {
font-style: italic;
}
}

View file

@ -4,20 +4,21 @@
<head>
<meta charset="UTF-8" />
<link rel="icon" type="image/gif" href="/static/assets/gifs/pcgif.gif">
<title></title>
<!-- <title></title> -->
<title>Agahnim proto</title>
<link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=DotGothic16&family=VT323&display=swap">
<link rel="stylesheet" href="/static/style.css" />
<script src="/static/vendor/htmx.min.js"></script>
</head>
<body hx-boost="true" hx-target="#content">
<body hx-boost="true" hx-target="#content" {% block bodyattrs %}{% endblock %}>
{% include "partials/header.html" %}
<div id="miniplayer-container" hx-get="/miniplayer" hx-trigger="load" hx-swap="innerHTML"
<miniplayer-container id="miniplayer-container" hx-get="/miniplayer" hx-trigger="load" hx-swap="innerHTML"
hx-target="#miniplayer-container">
<miniplayer>
<h1>Chargement...</h1>
</miniplayer>
</div>
</miniplayer-container>
<main id="content">
{% block content %}{% endblock %}

View file

@ -1,7 +1,6 @@
<miniplayer>
<h1>Miniplayer</h1>
{% if tracks.is_empty() %}
<p>Aucune track</p>
<ominous-message>You won't hear anything from me</ominous-message>
{% else %}
{% for track in tracks %}
<div class="track">
@ -10,4 +9,4 @@
</div>
{% endfor %}
{% endif %}
</miniplayer>
</miniplayer>