more dashboard css fixes

This commit is contained in:
ari melody 2025-10-21 15:57:12 +01:00
parent f324c249f6
commit 31fd5da44b
Signed by: ari
GPG key ID: CF99829C92678188
6 changed files with 47 additions and 27 deletions

View file

@ -14,6 +14,8 @@ input[type="text"] {
border-radius: 8px;
background: var(--bg-2);
box-shadow: var(--shadow-md);
transition: background .1s ease-out, color .1s ease-out;
}
.release-artwork {
@ -31,6 +33,7 @@ input[type="text"] {
.release-artwork #remove-artwork {
margin-top: .5em;
padding: .3em .6em;
background: var(--bg-3);
}
.release-info {
@ -118,6 +121,7 @@ input[type="text"] {
gap: .5em;
flex-direction: row;
justify-content: right;
color: var(--fg-3);
}
.release-actions button,
@ -163,7 +167,7 @@ dialog div.dialog-actions {
* RELEASE CREDITS
*/
.card#credits .credit {
#credits .credit {
margin-bottom: .5em;
padding: .5em;
display: flex;
@ -178,24 +182,24 @@ dialog div.dialog-actions {
cursor: pointer;
transition: background .1s ease-out;
}
.card#credits .credit:hover {
#credits .credit:hover {
background-color: var(--bg-1);
}
.card#credits .credit p {
#credits .credit p {
margin: 0;
}
.card#credits .credit .artist-avatar {
#credits .credit .artist-avatar {
border-radius: 12px;
}
.card#credits .credit .artist-name {
#credits .credit .artist-name {
color: var(--fg-3);
font-weight: bold;
}
.card#credits .credit .artist-role small {
#credits .credit .artist-role small {
font-size: inherit;
opacity: .66;
}
@ -314,33 +318,38 @@ dialog div.dialog-actions {
* RELEASE LINKS
*/
.card#links ul {
#links ul {
padding: 0;
display: flex;
gap: .2em;
}
.card#links a.button:hover {
#links a img.icon {
-webkit-filter: none;
filter: none;
}
#links a.button:hover {
color: var(--bg-3) !important;
background-color: var(--fg-3) !important;
}
.card#links a.button[data-name="spotify"] {
#links a.button[data-name="spotify"] {
color: #101010;
background-color: #8cff83
}
.card#links a.button[data-name="apple music"] {
#links a.button[data-name="apple music"] {
color: #101010;
background-color: #8cd9ff
}
.card#links a.button[data-name="soundcloud"] {
#links a.button[data-name="soundcloud"] {
color: #101010;
background-color: #fdaa6d
}
.card#links a.button[data-name="youtube"] {
#links a.button[data-name="youtube"] {
color: #101010;
background-color: #ff6e6e
}
@ -428,7 +437,7 @@ dialog div.dialog-actions {
* RELEASE TRACKS
*/
.card#tracks .track {
#tracks .track {
margin-bottom: 1em;
padding: 1em;
display: flex;
@ -438,49 +447,51 @@ dialog div.dialog-actions {
border-radius: 16px;
background: var(--bg-2);
box-shadow: var(--shadow-md);
transition: background .1s ease-out, color .1s ease-out;
}
.card#tracks .track h3,
.card#tracks .track p {
#tracks .track h3,
#tracks .track p {
margin: 0;
}
.card#tracks h2.track-title {
#tracks h2.track-title {
margin: 0;
display: flex;
gap: .5em;
}
.card#tracks h2.track-title .track-number {
#tracks h2.track-title .track-number {
opacity: .5;
}
.card#tracks a:hover {
#tracks a:hover {
text-decoration: underline;
}
.card#tracks .track-album {
#tracks .track-album {
margin-left: auto;
font-style: italic;
font-size: .75em;
opacity: .5;
}
.card#tracks .track-album.empty {
#tracks .track-album.empty {
color: #ff2020;
opacity: 1;
}
.card#tracks .track-description {
#tracks .track-description {
font-style: italic;
}
.card#tracks .track-lyrics {
#tracks .track-lyrics {
max-height: 10em;
overflow-y: scroll;
}
.card#tracks .track .empty {
#tracks .track .empty {
opacity: 0.75;
}