From dd77d6bb276f6a70b36f69d11cde7f5c8995f5e1 Mon Sep 17 00:00:00 2001
From: lonkaars <l.leblansch@gmail.com>
Date: Sat, 17 Apr 2021 17:24:59 +0200
Subject: home page without inline react styles :tada:

---
 styles/index.css | 72 ++++++++++++++++++++++++++++++++++++++++++++++++++++++++
 1 file changed, 72 insertions(+)
 create mode 100644 styles/index.css

(limited to 'styles/index.css')

diff --git a/styles/index.css b/styles/index.css
new file mode 100644
index 0000000..8ba12a6
--- /dev/null
+++ b/styles/index.css
@@ -0,0 +1,72 @@
+.topbar * {
+	--squareSize: 90px;
+}
+
+.loginOrRegisterBox {
+	vertical-align: top;
+	height: calc(var(--squareSize) + 2 * var(--spacing-large));
+	width: 100%;
+	max-width: calc(100% - var(--squareSize) - var(--spacing-medium) * 2 - var(--spacing-large) * 2);
+}
+
+.loginOrRegisterBox .inner {
+	position: relative;
+	width: 100%;
+	height: 100%;
+}
+
+.loginOrRegisterBox .inner .registerMessage {
+	user-select: none;
+	display: inline-block;
+	margin: 0 auto;
+	min-width: 240px;
+	max-width: 350px;
+	text-align: center;
+}
+
+.loginOrRegisterBox .inner .button.register {
+	background-color: var(--gray-700);
+	color: var(--foreground);
+}
+
+.gamemode .icon {
+	font-size: 64px;
+	font-size: 64px;
+	height: 64px;
+	display: inline-block;
+	position: absolute;
+	top: var(--spacing-large);
+	left: 50%;
+	transform: translateX(-50%);
+}
+
+.gamemode .text {
+	white-space: nowrap;
+	display: inline-block;
+	position: absolute;
+	bottom: var(--spacing-large);
+	left: 50%;
+	transform: translateX(-50%);
+	user-select: none;
+	font-weight: 500;
+}
+
+.topbar .gamemode {
+	--size: calc(var(--squareSize) + 2 * var(--spacing-large));
+	width: var(--size);
+	height: var(--size);
+}
+
+.topbar .profile .info {
+	left: calc(90px + 12px);
+	width: calc(100% - 90px - 12px);
+	height: 100%;
+}
+
+.topbar .profile .info .username { max-width: 178px; }
+.topbar .profile .info .score { margin-top: var(--spacing-small); }
+
+.topbar .profile .info .games .divider {
+	margin: 0 3px;
+}
+
-- 
cgit v1.2.3