ari/arimelody.me
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity

major database optimisations

Browse source 
Signed-off-by: ari melody <ari@arimelody.me>
This commit is contained in:
ari melody 2024-03-20 03:17:34 +00:00
parent 4f488d7bd8
commit 9f1a64b59b
10 changed files with 248 additions and 188 deletions
Download patch file Download diff file Expand all files Collapse all files

56
public/style/music-gateway.css
View file

@ -332,28 +332,43 @@ div#info {
font-size: 1.2em;
}
ul#extras {
list-style: none;
div#extras ul {
height: 100%;
margin: 0;
display: flex;
padding: 0;
gap: .6em;
list-style: none;
flex-direction: column;
justify-content: space-evenly;
}
ul#extras li a {
div#extras ul li a {
color: #888;
text-decoration: none;
font-style: italic;
writing-mode: vertical-rl;
transition: color .1s linear;
}
div#extras ul li a:hover {
color: #eee;
}
div#info > div {
max-height: 360px;
min-height: 360px;
overflow-y: scroll;
padding: 2rem 4rem;
margin: -2rem -4rem;
padding: 2rem 1rem 2rem 4rem;
margin: -2rem -3.5rem -2rem -4rem;
mask-image: linear-gradient(to bottom, transparent 0%, black 10%, black 90%, transparent 100%);
}
div#info p {
max-width: 500px;
white-space: pre-line;
}
a.scrollback {
color: #888;
font-style: italic;
@ -367,11 +382,6 @@ a.scrollback {
margin-bottom: 1rem;
}
#lyrics p {
max-width: 500px;
white-space: pre-line;
}
#share {
margin: 0;
display: inline-block;
@ -481,12 +491,28 @@ footer a:hover {
}
@media only screen and (min-width: 800px) {
div#info:has(> #credits:target) {
transform: translateY(calc(-360px + -6rem));
div#music-container:has(:not(> div#info #credits:target):not(> div#info #credits:target)) {
div#extras ul li:first-of-type a {
color: #eee;
}
}
div#info:has(> #lyrics:target) {
transform: translateY(calc((-360px + -6rem) * 2));
div#music-container:has(> div#info #credits:target) {
div#info {
transform: translateY(calc(-360px + -6rem));
}
div#extras ul li a[href="#credits"] {
color: #eee;
}
}
div#music-container:has(> div#info #lyrics:target) {
div#info {
transform: translateY(calc((-360px + -6rem) * 2));
}
div#extras ul li a[href="#lyrics"] {
color: #eee;
}
}
}
@ -532,7 +558,7 @@ footer a:hover {
mask-image: none;
}
a.scrollback {
div#extras {
display: none;
}