Agahnim/agahnim.dev
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

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

Browse source
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
Download patch file Download diff file Expand all files Collapse all files

18
static/style.css
View file

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

9
templates/base.html
View file

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

3
templates/partials/miniplayer.html
View file

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