From 3a30045c509a9627e15abc9916549df8f3c7b268 Mon Sep 17 00:00:00 2001 From: Grant Shoshin Shangreaux Date: Sun, 4 Dec 2022 21:21:42 -0600 Subject: Add: minor improvement of mobile [style] Add: code review feedback Fix: unbalanced paren Fix: all the other stuff --- static/css/main.css | 40 ++++++++++++++++++++++++++++++++++------ 1 file changed, 34 insertions(+), 6 deletions(-) (limited to 'static') diff --git a/static/css/main.css b/static/css/main.css index 1303fca..665eb76 100644 --- a/static/css/main.css +++ b/static/css/main.css @@ -32,12 +32,16 @@ button:hover { display: flex; flex-direction: row; flex-wrap: wrap; - justify-content: center; + justify-content: space-evenly; align-content: baseline; } -.row>div { - margin: 30px; +.column { + display: flex; + flex-direction: column; + flex-wrap: wrap; + justify-content: center; + align-content: baseline; } .centered-column { @@ -57,17 +61,41 @@ button:hover { background-color: #454545; } +.player { + display: flex; + justify-content: space-evenly; + width: 100%; + flex-wrap: wrap; +} + .now-playing { - position: sticky; - top: 2em; + display: flex; width: 300px; + flex-direction: column; +} + +.controls { + display: flex; + flex-direction: row; + justify-content: space-between; } -.now-playing button { +.controls button { font-size: 2em; + width: -moz-available; + width: -webkit-fill-available; + width: stretch; } .now-playing-track { background-color: #454545; } +.playlist-display { + margin-top: 2em; + width: auto; + display: flex; + flex-direction: column; + height: 600px; + overflow-y: auto; +} -- cgit v1.2.3