tweaking theme

This commit is contained in:
evilchili 2022-12-31 13:26:48 -08:00
parent 5985aef79d
commit ecd514005a
2 changed files with 18 additions and 9 deletions

View File

@ -6,16 +6,21 @@ html {
margin: 0; margin: 0;
outline: 0; outline: 0;
font-family: 'Clarendon MT Std', sans-serif; font-family: 'Clarendon MT Std', sans-serif;
font-size: 18px;
}
@media only screen
and (min-device-width: 320px)
and (max-device-width: 480px)
and (-webkit-min-device-pixel-ratio: 2) {
html { font-size: 24px; }
} }
body { body {
width: 100%; width: 100%;
height: 100%; height: 100%;
padding: 0;
margin: 0; margin: 0;
overflow: hidden; overflow: hidden;
background: rgb(0,4,16); background: rgb(0, 4, 16);
background: linear-gradient(0deg, rgba(0,4,16,1) 31%, rgba(1,125,147,1) 97%);
} }
a, a:visited { a, a:visited {
@ -27,11 +32,13 @@ a:active, a:hover {
} }
#container { #container {
position: relative;
background: linear-gradient(0deg, rgba(0,4,16,1) 1%, rgba(1,125,147,1) 97%);
overflow-x: wrap; overflow-x: wrap;
width: 96%; overflow-y: auto;
height: 96%; width: calc(100% - 4em);
margin: auto; height: calc(100% - 4em);
margin-top: 1em; padding: 2em;
} }
#details { #details {
@ -181,10 +188,12 @@ a:active, a:hover {
} }
.list-song { .list-song {
padding: 0.25em; padding: 0.25em;
color: #70bc45;
} }
.list-song:hover { .list-song:hover {
cursor: pointer; cursor: pointer;
background: #f1f2f6; background: #f1f2f6;
color: #000;
} }
#footer { #footer {
@ -194,7 +203,6 @@ a:active, a:hover {
color: #888; color: #888;
font-size: 0.9em; font-size: 0.9em;
letter-spacing: 0.1em; letter-spacing: 0.1em;
margin: 0;
margin-top: 1em; margin-top: 1em;
padding-top: 1em; padding-top: 1em;
} }
@ -257,3 +265,4 @@ a:active, a:hover {
from { opacity: 1; } from { opacity: 1; }
to { opacity: 0; } to { opacity: 0; }
} }

View File

@ -59,7 +59,7 @@
<div id="playlist"> <div id="playlist">
<div id="list"></div> <div id="list"></div>
</div> </div>
<div id='footer'>groove on demand : an <a alt="evilchili at liner notes dot club" href="https://linernotes.club/@evilchili">@evilchili</a> jam</div> <div id='footer'>groove on demand : an <a alt="evilchili at liner notes dot club" href="https://linernotes.club/@evilchili">@evilchili</a> jam</div>
</div> </div>
</div> </div>
</body> </body>