From 4cbf83a7b7e03f886030a11ad0a9c33bac2696e0 Mon Sep 17 00:00:00 2001
From: Izalia Mae <izalia@barkshark.xyz>
Date: Mon, 4 Mar 2024 02:19:26 -0500
Subject: [PATCH] simplify css

---
 relay/dev.py                                 |  1 -
 relay/frontend/base.haml                     |  4 +-
 relay/frontend/page/admin-config.haml        |  2 +-
 relay/frontend/page/admin-domain_bans.haml   |  6 +-
 relay/frontend/page/admin-instances.haml     |  4 +-
 relay/frontend/page/admin-software_bans.haml |  6 +-
 relay/frontend/page/admin-users.haml         |  4 +-
 relay/frontend/page/admin-whitelist.haml     |  4 +-
 relay/frontend/page/home.haml                |  9 ++-
 relay/frontend/page/login.haml               | 11 ++--
 relay/frontend/style.css                     | 63 ++++++++++++++++----
 relay/frontend/style/config.css              | 20 -------
 relay/frontend/style/domain_bans.css         | 32 ----------
 relay/frontend/style/home.css                | 16 -----
 relay/frontend/style/instances.css           | 25 --------
 relay/frontend/style/login.css               | 18 ------
 relay/frontend/style/software_bans.css       | 32 ----------
 relay/frontend/style/users.css               | 25 --------
 relay/frontend/style/whitelist.css           | 21 -------
 relay/views/frontend.py                      |  2 +-
 20 files changed, 81 insertions(+), 224 deletions(-)
 delete mode 100644 relay/frontend/style/config.css
 delete mode 100644 relay/frontend/style/domain_bans.css
 delete mode 100644 relay/frontend/style/home.css
 delete mode 100644 relay/frontend/style/instances.css
 delete mode 100644 relay/frontend/style/login.css
 delete mode 100644 relay/frontend/style/software_bans.css
 delete mode 100644 relay/frontend/style/users.css
 delete mode 100644 relay/frontend/style/whitelist.css

diff --git a/relay/dev.py b/relay/dev.py
index c37508e..5f06f3c 100644
--- a/relay/dev.py
+++ b/relay/dev.py
@@ -145,7 +145,6 @@ class WatchHandler(PatternMatchingEventHandler):
 		if event.event_type not in ['modified', 'created', 'deleted']:
 			return
 
-		print(event.src_path)
 		self.run_proc(restart = True)
 
 
diff --git a/relay/frontend/base.haml b/relay/frontend/base.haml
index 7de72ce..c74feda 100644
--- a/relay/frontend/base.haml
+++ b/relay/frontend/base.haml
@@ -11,7 +11,7 @@
 		%title << {{config.name}}: {{page}}
 		%meta(charset="UTF-8")
 		%meta(name="viewport" content="width=device-width, initial-scale=1")
-		%link(rel="stylesheet" type="text/css" href="/style.css?page={{page}}")
+		%link(rel="stylesheet" type="text/css" href="/style.css")
 		-block head
 
 	%body
@@ -51,7 +51,7 @@
 			-if message
 				.message.section -> =message
 
-			#content
+			#content(class="page-{{page.lower().replace(' ', '_')}}")
 				-block content
 
 			#footer.section
diff --git a/relay/frontend/page/admin-config.haml b/relay/frontend/page/admin-config.haml
index bf3d8b8..4028eb1 100644
--- a/relay/frontend/page/admin-config.haml
+++ b/relay/frontend/page/admin-config.haml
@@ -2,7 +2,7 @@
 -set page="Config"
 -block content
 	%form.section(action="/admin/config" method="POST")
-		#config-options
+		.grid-2col
 			%label(for="name") << Name
 			%input(id = "name" name="name" placeholder="Relay Name" value="{{config.name or ''}}")
 
diff --git a/relay/frontend/page/admin-domain_bans.haml b/relay/frontend/page/admin-domain_bans.haml
index 982c00d..fbee683 100644
--- a/relay/frontend/page/admin-domain_bans.haml
+++ b/relay/frontend/page/admin-domain_bans.haml
@@ -4,7 +4,7 @@
 	%details.section
 		%summary << Ban Domain
 		%form(action="/admin/domain_bans" method="POST")
-			#add-domain
+			#add-item
 				%label(for="domain") << Domain
 				%input(type="domain" id="domain" name="domain" placeholder="Domain")
 
@@ -16,7 +16,7 @@
 
 			%input(type="submit" value="Ban Domain")
 
-	#domains.section
+	#data-table.section
 		%table
 			%thead
 				%tr
@@ -31,7 +31,7 @@
 							%details
 								%summary -> =ban.domain
 								%form(action="/admin/domain_bans" method="POST")
-									.items
+									.grid-2col
 										.reason << Reason
 										%textarea.reason(id="reason" name="reason") << {{ban.reason or ""}}
 
diff --git a/relay/frontend/page/admin-instances.haml b/relay/frontend/page/admin-instances.haml
index 3cadc93..70aa523 100644
--- a/relay/frontend/page/admin-instances.haml
+++ b/relay/frontend/page/admin-instances.haml
@@ -4,7 +4,7 @@
 	%details.section
 		%summary << Add Instance
 		%form(target="/admin/instances" method="POST")
-			#add-instance
+			#add-item
 				%label(for="domain") << Domain
 				%input(type="domain" id="domain" name="domain" placeholder="Domain")
 
@@ -19,7 +19,7 @@
 
 			%input(type="submit" value="Add Instance")
 
-	#instances.section
+	#data-table.section
 		%table
 			%thead
 				%tr
diff --git a/relay/frontend/page/admin-software_bans.haml b/relay/frontend/page/admin-software_bans.haml
index b03e1a7..9490405 100644
--- a/relay/frontend/page/admin-software_bans.haml
+++ b/relay/frontend/page/admin-software_bans.haml
@@ -4,7 +4,7 @@
 	%details.section
 		%summary << Ban Software
 		%form(action="/admin/software_bans" method="POST")
-			#add-software
+			#add-item
 				%label(for="name") << Name
 				%input(id="name" name="name" placeholder="Name")
 
@@ -16,7 +16,7 @@
 
 			%input(type="submit" value="Ban Software")
 
-	#software.section
+	#data-table.section
 		%table
 			%thead
 				%tr
@@ -31,7 +31,7 @@
 							%details
 								%summary -> =ban.name
 								%form(action="/admin/software_bans" method="POST")
-									.items
+									.grid-2col
 										.reason << Reason
 										%textarea.reason(id="reason" name="reason") << {{ban.reason or ""}}
 
diff --git a/relay/frontend/page/admin-users.haml b/relay/frontend/page/admin-users.haml
index aff5ee7..ccc445c 100644
--- a/relay/frontend/page/admin-users.haml
+++ b/relay/frontend/page/admin-users.haml
@@ -4,7 +4,7 @@
 	%details.section
 		%summary << Add User
 		%form(target="/admin/users", method="POST")
-			#add-user
+			#add-item
 				%label(for="username") << Username
 				%input(id="username" name="username" placeholder="Username")
 
@@ -19,7 +19,7 @@
 
 			%input(type="submit" value="Add User")
 
-	#users.section
+	#data-table.section
 		%table
 			%thead
 				%tr
diff --git a/relay/frontend/page/admin-whitelist.haml b/relay/frontend/page/admin-whitelist.haml
index 2fba308..b902cd3 100644
--- a/relay/frontend/page/admin-whitelist.haml
+++ b/relay/frontend/page/admin-whitelist.haml
@@ -4,13 +4,13 @@
 	%details.section
 		%summary << Add Domain
 		%form(target="/admin/whitelist" method="POST")
-			#add-domain
+			#add-item
 				%label(for="domain") << Domain
 				%input(type="domain" id="domain" name="domain" placeholder="Domain")
 
 			%input(type="submit" value="Add Domain")
 
-	#whitelist.section
+	#data-table.section
 		%table
 			%thead
 				%tr
diff --git a/relay/frontend/page/home.haml b/relay/frontend/page/home.haml
index f64b489..7f09644 100644
--- a/relay/frontend/page/home.haml
+++ b/relay/frontend/page/home.haml
@@ -19,7 +19,7 @@
 			Note: The whitelist is enabled on this instance. Ask the admin to add your instance
 			before joining.
 
-	#instances.section
+	#data-table.section
 		%table
 			%thead
 				%tr
@@ -29,5 +29,8 @@
 			%tbody
 				-for instance in instances
 					%tr
-						%td.instance -> %a(href="https://{{instance.domain}}/" target="_new") -> =instance.domain
-						%td.date -> =instance.created.strftime("%Y-%m-%d")
+						%td.instance -> %a(href="https://{{instance.domain}}/" target="_new")
+							=instance.domain
+
+						%td.date
+							=instance.created.strftime("%Y-%m-%d")
diff --git a/relay/frontend/page/login.haml b/relay/frontend/page/login.haml
index ee7d1dc..5f2fed4 100644
--- a/relay/frontend/page/login.haml
+++ b/relay/frontend/page/login.haml
@@ -2,8 +2,11 @@
 -set page="Login"
 -block content
 	%form.section(action="/login" method="post")
-		%label(for="username") << Username
-		%input(id="username" name="username" placeholder="Username" value="{{username or ''}}")
-		%label(for="password") << Password
-		%input(id="password" name="password" placeholder="Password" type="password")
+		.grid-2col
+			%label(for="username") << Username
+			%input(id="username" name="username" placeholder="Username" value="{{username or ''}}")
+
+			%label(for="password") << Password
+			%input(id="password" name="password" placeholder="Password" type="password")
+
 		%input(type="submit" value="Login")
diff --git a/relay/frontend/style.css b/relay/frontend/style.css
index b489fb1..16fc5b4 100644
--- a/relay/frontend/style.css
+++ b/relay/frontend/style.css
@@ -15,13 +15,6 @@
 	--spacing: 10px;
 }
 
-body {
-	color: var(--text);
-	background-color: #222;
-	margin: var(--spacing);
-	font-family: sans serif;
-}
-
 a {
 	color: var(--primary);
 	text-decoration: none;
@@ -32,10 +25,26 @@ a:hover {
 	text-decoration: underline;
 }
 
+body {
+	color: var(--text);
+	background-color: #222;
+	margin: var(--spacing);
+	font-family: sans serif;
+}
+
+details *:nth-child(2) {
+	margin-top: 5px;
+}
+
 details summary {
 	cursor: pointer;
 }
 
+form input[type="submit"] {
+	display: block;
+	margin: 0 auto;
+}
+
 p {
 	line-height: 1em;
 	margin: 0px;
@@ -90,6 +99,10 @@ table tbody td {
 	background-color: var(--table-background);
 }
 
+textarea {
+	height: calc(5em);
+}
+
 #container {
 	width: 1024px;
 	margin: 0px auto;
@@ -190,6 +203,23 @@ table tbody td {
 	text-align: right
 }
 
+#add-item {
+	display: grid;
+	grid-template-columns: max-content auto;
+	grid-gap: var(--spacing);
+	margin-top: var(--spacing);
+	margin-bottom: var(--spacing);
+	align-items: center;
+}
+
+#data-table td:first-child {
+	width: 100%;
+}
+
+#data-table .date {
+	width: max-content;
+	text-align: right;
+}
 
 .button {
 	background-color: var(--primary);
@@ -219,6 +249,15 @@ table tbody td {
 	border: 1px solid var(--error-border) !important;
 }
 
+.grid-2col {
+	display: grid;
+	grid-template-columns: max-content auto;
+	grid-gap: var(--spacing);
+	margin-bottom: var(--spacing);
+	align-items: center;
+	
+}
+
 .message {
 	color: var(--message-text) !important;
 	background-color: var(--message-background) !important;
@@ -241,9 +280,10 @@ table tbody td {
 }
 
 
-{% if page %}
-	{% include "style/" + page.lower().replace(" ", "_") + ".css" %}
-{% endif %}
+/* config */
+#content.page-config input[type="checkbox"] {
+	justify-self: left;
+}
 
 
 @media (max-width: 1026px) {
@@ -273,7 +313,8 @@ table tbody td {
 	}
 
 	.section {
-		border-width: 0px;
+		border-left-width: 0px;
+		border-right-width: 0px;
 		border-radius: 0px;
 	}
 }
diff --git a/relay/frontend/style/config.css b/relay/frontend/style/config.css
deleted file mode 100644
index 0dff253..0000000
--- a/relay/frontend/style/config.css
+++ /dev/null
@@ -1,20 +0,0 @@
-#config-options {
-	display: grid;
-	grid-template-columns: max-content auto;
-	grid-gap: var(--spacing);
-	margin-bottom: var(--spacing);
-	align-items: center;
-}
-
-form input[type="submit"] {
-	display: block;
-	margin: 0 auto;
-}
-
-form input[type="checkbox"] {
-	justify-self: left;
-}
-
-textarea {
-	height: 4em;
-}
diff --git a/relay/frontend/style/domain_bans.css b/relay/frontend/style/domain_bans.css
deleted file mode 100644
index af4705a..0000000
--- a/relay/frontend/style/domain_bans.css
+++ /dev/null
@@ -1,32 +0,0 @@
-form input[type="submit"] {
-	display: block;
-	margin: 0 auto;
-}
-
-textarea {
-	height: calc(5em);
-}
-
-table .items {
-	display: grid;
-	grid-template-columns: max-content auto;
-	grid-gap: var(--spacing);
-	margin-top: var(--spacing);
-}
-
-#domains .domain {
-	width: 100%;
-}
-
-#domains .date {
-	width: max-content;
-	text-align: right;
-}
-
-#add-domain {
-	display: grid;
-	grid-template-columns: max-content auto;
-	grid-gap: var(--spacing);
-	margin-top: var(--spacing);
-	margin-bottom: var(--spacing);
-}
diff --git a/relay/frontend/style/home.css b/relay/frontend/style/home.css
deleted file mode 100644
index 4cdfaa9..0000000
--- a/relay/frontend/style/home.css
+++ /dev/null
@@ -1,16 +0,0 @@
-#instances table {
-	width: 100%;
-}
-
-#instances .instance {
-	width: 100%;
-}
-
-#instances .date {
-	width: max-content;
-	text-align: right;
-}
-
-#instances thead td {
-	text-align: center !important;
-}
diff --git a/relay/frontend/style/instances.css b/relay/frontend/style/instances.css
deleted file mode 100644
index 256ca12..0000000
--- a/relay/frontend/style/instances.css
+++ /dev/null
@@ -1,25 +0,0 @@
-form input[type="submit"] {
-	display: block;
-	margin: 0 auto;
-}
-
-#instances .instance {
-	width: 100%;
-}
-
-#instances .software {
-	text-align: center;
-}
-
-#instances .date {
-	width: max-content;
-	text-align: right;
-}
-
-#add-instance {
-	display: grid;
-	grid-template-columns: max-content auto;
-	grid-gap: var(--spacing);
-	margin-top: var(--spacing);
-	margin-bottom: var(--spacing);
-}
diff --git a/relay/frontend/style/login.css b/relay/frontend/style/login.css
deleted file mode 100644
index 48f623b..0000000
--- a/relay/frontend/style/login.css
+++ /dev/null
@@ -1,18 +0,0 @@
-label, input {
-	margin: 0 auto;
-	display: block;
-}
-
-label, input:not([type="submit"]) {
-	width: 50%;
-}
-
-input:not([type="submit"]) {
-	margin-bottom: var(--spacing);
-}
-
-@media (max-width: 1026px) {
-	label, input:not([type="submit"]) {
-		width: 75%;
-	}
-}
diff --git a/relay/frontend/style/software_bans.css b/relay/frontend/style/software_bans.css
deleted file mode 100644
index c3109b1..0000000
--- a/relay/frontend/style/software_bans.css
+++ /dev/null
@@ -1,32 +0,0 @@
-form input[type="submit"] {
-	display: block;
-	margin: 0 auto;
-}
-
-textarea {
-	height: calc(5em);
-}
-
-table .items {
-	display: grid;
-	grid-template-columns: max-content auto;
-	grid-gap: var(--spacing);
-	margin-top: var(--spacing);
-}
-
-#software .name{
-	width: 100%;
-}
-
-#software .date {
-	width: max-content;
-	text-align: right;
-}
-
-#add-software {
-	display: grid;
-	grid-template-columns: max-content auto;
-	grid-gap: var(--spacing);
-	margin-top: var(--spacing);
-	margin-bottom: var(--spacing);
-}
diff --git a/relay/frontend/style/users.css b/relay/frontend/style/users.css
deleted file mode 100644
index c7fe20a..0000000
--- a/relay/frontend/style/users.css
+++ /dev/null
@@ -1,25 +0,0 @@
-form input[type="submit"] {
-	display: block;
-	margin: 0 auto;
-}
-
-#users .username {
-	width: 100%;
-}
-
-#users .handle {
-	text-align: center;
-}
-
-#users .date {
-	width: max-content;
-	text-align: right;
-}
-
-#add-user {
-	display: grid;
-	grid-template-columns: max-content auto;
-	grid-gap: var(--spacing);
-	margin-top: var(--spacing);
-	margin-bottom: var(--spacing);
-}
diff --git a/relay/frontend/style/whitelist.css b/relay/frontend/style/whitelist.css
deleted file mode 100644
index 6d3566a..0000000
--- a/relay/frontend/style/whitelist.css
+++ /dev/null
@@ -1,21 +0,0 @@
-form input[type="submit"] {
-	display: block;
-	margin: 0 auto;
-}
-
-#whitelist .domain{
-	width: 100%;
-}
-
-#whitelist .date {
-	width: max-content;
-	text-align: right;
-}
-
-#add-domain {
-	display: grid;
-	grid-template-columns: max-content auto;
-	grid-gap: var(--spacing);
-	margin-top: var(--spacing);
-	margin-bottom: var(--spacing);
-}
diff --git a/relay/views/frontend.py b/relay/views/frontend.py
index 20c3ddb..8710413 100644
--- a/relay/views/frontend.py
+++ b/relay/views/frontend.py
@@ -440,5 +440,5 @@ class AdminConfig(View):
 @register_route('/style.css')
 class StyleCss(View):
 	async def get(self, request: Request) -> Response:
-		data = self.template.render('style.css', self, page = request.query.getone('page', ""))
+		data = self.template.render('style.css', self)
 		return Response.new(data, ctype = 'css')