Merge branch 'marietje-zuid' into 'feature/marietje-4.1-in-header'

# Conflicts:
#   marietje/queues/templates/queues/queue.html
This commit is contained in:
2024-02-21 15:19:07 +01:00
6 changed files with 88 additions and 63 deletions

View File

@ -31,19 +31,6 @@ a {
color: var(--text-color);
}
.table {
color: var(--text-color);
}
.table-striped tbody tr:nth-of-type(odd) {
background-color: var(--background-shade);
color: var(--text-color);
}
.table-striped > tbody > tr:nth-of-type(odd) > * {
color: var(--text-color);
}
input[type="text"], input[type="password"] {
background-color: var(--background-shade-light);
border: 1px solid var(--background-shade);
@ -82,6 +69,19 @@ footer {
text-align: center;
}
.table {
color: var(--text-color);
}
.table-striped tbody tr:nth-of-type(odd) {
background-color: var(--background-shade);
color: var(--text-color);
}
.table-striped > tbody > tr:nth-of-type(odd) > * {
color: var(--text-color);
}
.marietjequeue {
color: #777777;
}
@ -91,7 +91,24 @@ footer {
}
.marietjequeue-pre-start td {
border-bottom: 3px double #777777;
border-bottom: 3px double var(--text-color);
}
.marietjequeue-post-start td {
border-top: 3px double var(--text-color);
}
tr.requested_song{
border-left: 1px solid var(--text-color);
}
.currentsong {
border-bottom: 1px solid var(--text-color);
font-weight: bold;
}
.underline_cell {
border-bottom: 1px solid var(--text-color);
}
.block-button {
@ -100,13 +117,10 @@ footer {
transition: 1s transform ease-in-out;
}
.currentsong {
border-bottom: 1px solid #DDDDDD;
}
.navbar-text {
color: var(--text-color);
}
.danger {
color: red !important;
}

View File

@ -20,17 +20,19 @@
@media (prefers-color-scheme: dark) {
:root {
--background-color: #202020;
--background-shade: #404040;
--background-shade-light: #696969;
--background-color: #181818;
--background-shade: #282828;
--background-shade-light: #404040;
--card-background: #696969;
--card-background-shade: #404040;
--card-background-contrast: #ffffff;
--card-background: #404040;
--card-background-shade: #282828;
--card-background-contrast: #dddddd;
--title-color: #000000;
--sub-title-color: #dddddd;
--link-color: #007bff;
--text-color: #ffffff;
--text-color: #dddddd;
--bs-border-color: #282828;
}
}

View File

@ -5,7 +5,7 @@
{% block content %}
<nav class="navbar navbar-expand navbar-default navbar-light border-bottom">
<div class="container">
<div class="container-lg">
<ul class="nav nav-pills" role="tablist">
<li class="nav-item" role="presentation">
<button class="nav-link active" id="queue-tab" data-bs-toggle="tab" data-bs-target="#queue"
@ -64,7 +64,7 @@
</ul>
</div>
</nav>
<div class="container">
<div class="container-lg">
<br><br>
<div class="alert-location">
</div>
@ -73,7 +73,7 @@
<div id="queue-container">
<table class="table table-striped">
<thead>
<tr class="table-header-style">
<tr class="table-header-style underline_cell">
<td class="col-md-4">Artist</td>
<td class="col-md-4">Title</td>
<td class="col-md-2 d-sm-table-cell d-none">Requested By</td>
@ -86,7 +86,9 @@
</thead>
<tbody class="queuebody">
<template v-for="(song, index) in queue">
<tr :class="{ marietjequeue: (song.user === null), currentsong: (index === 0), 'fw-bold': (index === 0) }">
<tr :class="{ marietjequeue: (song.user === null),
underline_cell: (index === queue[-1]),
currentsong: (index === 0),}">
<td class="artist">${ song.song.artist }$</td>
<td class="title">${ song.song.title }$</td>
<td class="d-sm-table-cell d-none requested-by">
@ -108,18 +110,17 @@
<td>
<div class="d-flex flex-column">
<div class="d-flex flex-row">
<button v-if="song.can_move_up" v-on:click="move_down(queue[index-1].id)" class="btn btn-link"><i
class="fa-solid fa-arrow-up"></i></button>
<button v-else class="btn btn-link invisible"><i class="fa-solid fa-arrow-up"></i></button>
<button v-if="song.can_move_up" v-on:click="move_down(queue[index-1].id)"
class="btn btn-link p-1 p-md-2"><i class="fa-solid fa-arrow-up"></i></button>
<button v-else class="btn btn-link invisible p-1 p-md-2"><i class="fa-solid fa-arrow-up"></i></button>
<button v-if="song.can_move_down" v-on:click="move_down(song.id)" class="btn btn-link"><i
class="fa-solid fa-arrow-down"></i></button>
<button v-else class="btn btn-link invisible"><i class="fa-solid fa-arrow-down"></i></button>
</div>
<div class="d-flex flex-row">
<button v-if="song.can_delete" v-on:click="cancel_song(song.id)" class="btn btn-link"><i
class="fa-solid fa-trash-can"></i></button>
<button v-else class="btn btn-link invisible"><i class="fa-solid fa-trash-can"></i></button>
<button v-if="song.can_move_down" v-on:click="move_down(song.id)"
class="btn btn-link p-1 p-md-2"><i class="fa-solid fa-arrow-down"></i></button>
<button v-else class="btn btn-link invisible p-1 p-md-2"><i class="fa-solid fa-arrow-down"></i></button>
<button v-if="song.can_delete" v-on:click="cancel_song(song.id)"
class="btn btn-link p-1 p-md-2"><i class="fa-solid fa-trash-can"></i></button>
<button v-else class="btn btn-link invisible p-1 p-md-2"><i class="fa-solid fa-trash-can"></i></button>
</div>
</div>
</td>
@ -130,7 +131,7 @@
</div>
</div>
<div class="tab-pane fade" id="request" role="tabpanel" aria-labelledby="request-tab">
<div id="request-container">
<div id="request-container" class="table-responsive">
<table id="request-table" class="table table-striped">
<thead>
<tr>

View File

@ -4,7 +4,7 @@
{% block title %}Manage{% endblock %}
{% block content %}
<div class="container">
<div class="container-lg">
<div class="table-responsive mt-5">
<table id="request-table" class="table table-striped">
<thead>

View File

@ -28,6 +28,7 @@
<th>#</th>
<th>User</th>
<th style="text-align: right;"># Songs</th>
<th></th>
</tr>
</thead>
<tbody>
@ -54,6 +55,7 @@
<th>#</th>
<th>User</th>
<th style="text-align: right;"># Requests</th>
<th></th>
</tr>
</thead>
<tbody>
@ -109,6 +111,7 @@
<th>#</th>
<th>User</th>
<th style="text-align: right;"># Unique</th>
<th></th>
</tr>
</thead>
<tbody>
@ -176,7 +179,9 @@
</div>
<div class="col-md-6">
<h2>Most played uploaders</h2>
<p>These are the {{ stats.stats_top_count }} people whose songs are requested most often by other people, as shown in the left column. The right column shows how many times that person has queued his own songs.</p>
<p>These are the {{ stats.stats_top_count }} people whose songs are requested most often by other
people, as shown in the left column. The right column shows how many times that person has queued
their own songs.</p>
<div class="table-responsive">
<table class="table table-striped">
<thead>
@ -202,7 +207,7 @@
</div>
<div class="col-md-6">
<h2>Most played songs last 14 days</h2>
<p>These songs are played the {{ stats.stats_top_count }} most in the last two weeks.</p>
<p>These {{ stats.stats_top_count }} songs have been requested the most in the last two weeks.</p>
<div class="table-responsive">
<table class="table table-striped">
<thead>

View File

@ -21,9 +21,10 @@
{% endif %}
<div class="col-md-6">
<h2>Most played songs</h2>
<p>You have requested <strong> {{ stats.unique_requests }} </strong> different
songs a total of <strong> {{ stats.total_requests }} </strong> times. This
means <strong> {% widthratio stats.unique_requests stats.total_requests 100 %}% </strong> of your requests have been unique. </p>
<p>You have requested <strong> {{ stats.unique_requests }} </strong> different songs a total of
<strong> {{ stats.total_requests }} </strong> times. This means
<strong> {% widthratio stats.unique_requests stats.total_requests 100 %}% </strong> of your requests
have been unique. These are the song you have requested the most.</p>
<h4>Top {{ stats.stats_top_count }}:</h4>
<div class="table-responsive">
<table class="table table-striped">
@ -50,6 +51,7 @@
</div>
<div class="col-md-6">
<h2>Most played artists</h2>
<p>These are the artists you have requested the most.</p>
<h4>Top {{ stats.stats_top_count }}:</h4>
<div class="table-responsive">
<table class="table table-striped">
@ -57,7 +59,7 @@
<tr>
<th>#</th>
<th>Artist</th>
<th style="text-align: right;"># Requests</th>
<th style="white-space:nowrap; text-align: right;"># Requests</th>
</tr>
</thead>
<tbody>
@ -74,11 +76,11 @@
</div>
<div class="col-md-6">
<h2>Uploads requested</h2>
<p> You have uploaded a total of <strong> {{stats.total_uploads }} </strong> songs. The left column
shows how many times these have been requested by other people. The right column shows
how many times you requested your own songs. In total your songs
have been queued <strong> {{stats.total_played_uploads }} </strong> times by others and
<strong> {{stats.total_played_user_uploads }} </strong> by yourself.
<p>You have uploaded a total of <strong> {{stats.total_uploads }} </strong> songs. The left column
shows how many times these have been requested by other people. The right column shows how many times
you requested your own songs. In total your songs have been queued
<strong> {{stats.total_played_uploads }} </strong> times by others and
<strong> {{stats.total_played_user_uploads }} </strong> times by yourself.</p>
<h4>Top {{ stats.stats_top_count }}:</h4>
<div class="table-responsive">
<table class="table table-striped">
@ -87,8 +89,8 @@
<th>#</th>
<th>Artist</th>
<th>Title</th>
<th style="text-align: right;">Others</th>
<th>You</th>
<th style="white-space:nowrap; text-align: right;"># Others</th>
<th style="white-space:nowrap;"># You</th>
</tr>
</thead>
<tbody>
@ -107,8 +109,8 @@
</div>
<div class="col-md-6">
<h2>Upload artists requested</h2>
<p> The left column shows how many times songs from artists uploaded by you have been requested by
other people. The right column shows how many times you requested those songs.
<p>The left column shows how many times songs from artists uploaded by you have been requested by
other people. The right column shows how many times you requested those songs.</p>
<h4>Top {{ stats.stats_top_count }}:</h4>
<div class="table-responsive">
<table class="table table-striped">
@ -116,8 +118,8 @@
<tr>
<th>#</th>
<th>Artist</th>
<th style="text-align: right;">Others</th>
<th>You</th>
<th style="white-space:nowrap; text-align: right;"># Others</th>
<th style="white-space:nowrap;"># You</th>
</tr>
</thead>
<tbody>
@ -135,14 +137,15 @@
</div>
<div class="col-md-6">
<h2>Most played uploaders</h2>
<p> The people whose songs you have queued the most are:</p>
<p>These are the people whose songs you have requested the most.</p>
<div class="table-responsive">
<table class="table table-striped">
<thead>
<tr>
<th>#</th>
<th>Uploader</th>
<th style="text-align: right;"># Requests</th>
<th style="white-space:nowrap; text-align: right;"># Requests</th>
<th></th>
</tr>
</thead>
<tbody>
@ -160,14 +163,14 @@
</div>
<div class="col-md-6">
<h2>Biggest fans</h2>
<p> The people that queued your songs the most are:</p>
<p>These are the people that have requested your songs the most.</p>
<div class="table-responsive">
<table class="table table-striped">
<thead>
<tr>
<th>#</th>
<th>User</th>
<th style="text-align: right;"># Requests</th>
<th style="white-space:nowrap; text-align: right;"># Requests</th>
</tr>
</thead>
<tbody>