From 52e37fcacb33a28353d76361440aeb5c464bdb40 Mon Sep 17 00:00:00 2001 From: coon Date: Mon, 27 Nov 2023 01:55:09 +0100 Subject: [PATCH] static: start of flexbox implementation --- static/flexbox/index.html | 43 +++++++++++++++++++++++++++++++++++++++ static/flexbox/sanic.css | 33 ++++++++++++++++++++++++++++++ static/flexbox/sanic.js | 0 3 files changed, 76 insertions(+) create mode 100644 static/flexbox/index.html create mode 100644 static/flexbox/sanic.css create mode 100644 static/flexbox/sanic.js diff --git a/static/flexbox/index.html b/static/flexbox/index.html new file mode 100644 index 0000000..583eb6a --- /dev/null +++ b/static/flexbox/index.html @@ -0,0 +1,43 @@ + + + + + Sanic - Flexbox layout + + + + +
+
+
+ + +
+
+
+ + + + +
+
+ + +
+
+
+ +
+
+
+ queue +
+
+ controls bottom +
+ +
+ + diff --git a/static/flexbox/sanic.css b/static/flexbox/sanic.css new file mode 100644 index 0000000..8b8a136 --- /dev/null +++ b/static/flexbox/sanic.css @@ -0,0 +1,33 @@ +body { + background-color: #09101d; + color: #bbb; +} + +div { + border: 1px dashed white; +} + +button { + background-color: #28374a; + color: #bbb; +} + +#flexbox-container { + display: flex; + flex-direction: column; +} + +#controls-top { + display: flex; + flex-direction: row; +} + +#top-left-controls { + display: flex; + flex-direction: column; +} + +#playback-controls { + display: flex; + flex-direction: column; +} diff --git a/static/flexbox/sanic.js b/static/flexbox/sanic.js new file mode 100644 index 0000000..e69de29