_
/
empede
1
0
Fork 0
Code Issues Releases 18 Activity

Make settings buttons slightly smaller

This commit is contained in:
Sijmen 2023-12-23 09:58:28 +01:00
parent 9c7871ed87
commit 31549b5b49
Signed by: vijfhoek
GPG Key ID: DAF7821E067D9C48
2 changed files with 21 additions and 7 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

8
static/style.css
View File

@ -265,15 +265,19 @@ ul.dir li .material-symbols-outlined {
bottom: 0; bottom: 0;
} }
.player .controls { .player .controls,
.player .settings {
display: flex; display: flex;
justify-content: space-around; justify-content: space-around;
padding: 0 0.5rem 1.0rem; padding: 0 0.5rem 1.0rem;
} }
.player .control { .player .controls button {
font-size: 40px; font-size: 40px;
} }
.player .settings button {
font-size: 25px;
}
.player .current { .player .current {
display: flex; display: flex;

20
templates/player.html
View File

@ -52,21 +52,31 @@
>skip_next</button> >skip_next</button>
</div> </div>
<div class="controls" hx-swap="none" hx-trigger="click,keyUp[key=='Enter']"> <div class="settings" hx-swap="none" hx-trigger="click,keyUp[key=='Enter']">
<button <button
hx-post="/consume" hx-post="/consume"
class="control material-symbols-outlined {% if consume %}active{% endif %}" role="button" title="Consume" class="control material-symbols-outlined {% if consume %}active{% endif %}"
role="button" title="Consume"
style="font-size: 32px"
>delete_sweep</button> >delete_sweep</button>
<button <button
hx-post="/shuffle" hx-post="/random"
class="control material-symbols-outlined {% if shuffle %}active{% endif %}" role="button" title="Shuffle" class="control material-symbols-outlined {% if random %}active{% endif %}"
role="button" title="Shuffle"
>shuffle</button> >shuffle</button>
<button <button
hx-post="/repeat" hx-post="/repeat"
class="control material-symbols-outlined {% if repeat %}active{% endif %}" role="button" title="Repeat" class="control material-symbols-outlined {% if repeat %}active{% endif %}"
role="button" title="Repeat"
>repeat</button> >repeat</button>
<button
hx-post="/single"
class="control material-symbols-outlined {% if single %}active{% endif %}"
role="button" title="Single"
>filter_1</button>
</div> </div>
<div class="progress" style="width: {{ elapsed / duration * 100.0 }}%"></div> <div class="progress" style="width: {{ elapsed / duration * 100.0 }}%"></div>