static: work on basic layout + top controls

This commit is contained in:
coon 2023-11-27 20:51:38 +01:00
parent 9a4aadaf75
commit cc0ba05b49
2 changed files with 107 additions and 3 deletions

View file

@ -1,6 +1,7 @@
body {
html, body {
background-color: #09101d;
color: #bbb;
height: 99%;
}
div {
@ -12,9 +13,15 @@ button {
color: #bbb;
}
input {
background-color: #28374a;
color: white;
}
#flexbox-container {
display: flex;
flex-direction: column;
height: 100%;
}
#controls-top {
@ -25,9 +32,69 @@ button {
#top-left-controls {
display: flex;
flex-direction: column;
width: 100px;
}
#top-left-controls button {
text-align: left;
}
#playback-controls {
display: flex;
flex-direction: column;
width: 160px;
}
#queue-volume-controls {
width: 150px;
}
#queue-controls {
display: flex;
flex-direction: row;
}
#queue-xfade-control {
display: flex;
flex-direction: column;
text-align: center;
}
#queue-xfade-buttons {
display: flex;
flex-direction: row;
}
#top-logo {
display: flex;
flex-direction: column;
text-align: center;
color: white;
width: 50px;
}
#top-logo-container {
display: flex;
flex-grow: 1;
justify-content: flex-end;
}
#sanic-logo {
width: 50px;
}
#xfade {
width: 20px;
}
#queue {
flex-grow: 1;
}
#controls_bottom {
flex-grow: 2;
}
#footer {
text-align: right;
}