From 538047c5ac88fc457b8e1658416184f411cadbf1 Mon Sep 17 00:00:00 2001 From: kaotisk Date: Sat, 9 Nov 2024 10:00:11 +0200 Subject: Visual rework --- client/css/styles.css | 53 ++++++++++++++++++++++++++++++++++++++++++++++++++- 1 file changed, 52 insertions(+), 1 deletion(-) (limited to 'client/css/styles.css') diff --git a/client/css/styles.css b/client/css/styles.css index 2d05d0e..5dce3f4 100644 --- a/client/css/styles.css +++ b/client/css/styles.css @@ -1,3 +1,8 @@ +* { + padding: 0px; + margin: 0; +} + body { background: black; color: lightgreen; @@ -28,6 +33,7 @@ div { .div-groups-row { display: flex; flex-direction: row; + align-items: center; } progress { @@ -46,8 +52,15 @@ button { background:black; color:red; border: solid 2px; + width: 100%; } +.no-break { + display: flex; + flex-direction: row; + flex-wrap: nowrap; + word-break: none; +} button { background:black; @@ -83,11 +96,49 @@ summary:hover { color: black; } +.start-top { + display: flex; + flex-direction: row; + flex-wrap: wrap; + justify-content: space-evenly; + align-items: flex-start; +} + +.previously-played { + flex-direction: column-reverse; + overflow-y: auto; + height: 40vh; + gap: 5px; +} + +.div-row { + flex-direction: row; + align-items: center; + justify-content: center; + flex-wrap: wrap; +} + +.previously-played img { + width: 48px; +} +.previously-played div { + border-color: purple; + border-style: solid; + border-width: 1px; +} + +.div-inline-reverse { + display: flex; + flex-direction: row-reverse; + flex-wrap: wrap; + align-items: center; + justify-content: space-evenly; +} .div-inline { display: flex; flex-direction: row; flex-wrap: wrap; - align-items: baseline; + align-items: center; justify-content: space-evenly; } -- cgit v1.2.3