present screen working

3 files changed, 80 insertions, 5 deletions

diff --git a/styles/globals.css b/styles/globals.css
index 028d585..d8bb181 100644
--- a/styles/globals.css
+++ b/styles/globals.css
@@ -14,3 +14,7 @@ h1 { font-size: 1.25rem; }
 h2 { font-size: 1.125rem; }
 h3 { font-size: 1rem; }
 
+.MuiSvgIcon-root {
+	font-size: 24px !important;
+}
+
diff --git a/styles/presentation.css b/styles/presentation.css
index 309b616..0a95b97 100644
--- a/styles/presentation.css
+++ b/styles/presentation.css
@@ -1,13 +1,73 @@
-.presentation {
-	background-color: #000;
-}
-
 .slideWrapper {
 	margin: 0 auto;
 	max-width: calc(16 / 9 * 100vh);
 }
 
-.slide {
+.slideWrapper .slide {
 	padding-top: calc(9 / 16 * 100%);
 	background-color: #ff00ff;
 }
+
+.fullscreenControls {
+	--menu-size: 25;
+	display: grid;
+	grid-template-columns: 1fr calc(var(--menu-size) * 1vw) 1fr;
+}
+
+#menu {
+	pointer-events: none;
+	transition: opacity .3s;
+	opacity: 0;
+}
+
+#menu.active {
+	pointer-events: unset;
+	opacity: 1;
+}
+
+#menu .background {
+	background: linear-gradient(180deg,
+								rgba(1, 1, 13, 0.46) 50%,
+								rgba(1, 1, 13, 1.00) 100%);
+}
+
+#menu .info {
+	margin: 32px;
+	grid-template-columns: auto 1fr auto;
+}
+
+#menu .info .timetitle,
+#menu .info .slide {
+	line-height: 1;
+}
+
+#menu .info .timetitle *,
+#menu .info .slide * {
+	margin: 0;
+}
+
+#menu .info h3 {
+	color: var(--c700);
+	font-weight: 400;
+	font-size: 50px;
+}
+
+#menu .info h1 {
+	font-weight: 600;
+	font-size: 70px;
+}
+
+#menu .MuiButton-root {
+	background-color: var(--piss);
+}
+
+#menu .MuiButton-root.bg-err {
+	background-color: var(--error);
+}
+
+#menu .info .buttons .inner .MuiButton-root {
+	margin: 0;
+	margin-right: 16px;
+	margin-top: 16px;
+}
+
diff --git a/styles/util.css b/styles/util.css
index 3589267..a2381ae 100644
--- a/styles/util.css
+++ b/styles/util.css
@@ -51,6 +51,11 @@
 .floatr { float: right; }
 .floatl { float: left; }
 .floatn { float: none; }
+.floatb {
+	display: flex;
+	justify-content: flex-end;
+	flex-direction: column;
+}
 
 .w1fr { width: 1fr; }
 
@@ -59,6 +64,8 @@
 .w100vw { width: 100vw; }
 .h100vh { height: 100vh; }
 
+.nobr { white-space: nowrap; }
+
 .fullwidth {
 	width: 100%;
 	box-sizing: border-box;
@@ -103,3 +110,7 @@
 	transform: translate(-50%, -50%);
 }
 
+.numbers {
+	font-feature-settings: 'tnum' on, 'lnum' on, 'ss01' on, 'cv01' on;
+}
+