mirror of
https://gitlab.science.ru.nl/technicie/MarietjeDjango.git
synced 2025-12-09 21:02:24 +01:00
Some aesthetic changes to the dark mode colors and the table borders
This commit is contained in:
committed by
Lars van Rhijn
parent
66ac1076d3
commit
98e43aa688
@ -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;
|
||||
}
|
||||
|
||||
@ -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;
|
||||
}
|
||||
}
|
||||
@ -71,7 +71,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>
|
||||
@ -84,7 +84,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">
|
||||
|
||||
Reference in New Issue
Block a user