From b552026d81428ca7b1f45311d0aa6a9550929554 Mon Sep 17 00:00:00 2001
From: Arthur Lu <root@tronnet.net>
Date: Wed, 5 Apr 2023 23:35:11 +0000
Subject: [PATCH] fix stlye sheet scoping, imrpove some styling

Signed-off-by: Arthur Lu <learthurgo@gmail.com>
---
 account.html   |  2 ++
 config.html    |  3 +++
 css/button.css |  2 +-
 css/form.css   | 22 +++++++++++-----------
 css/style.css  | 24 ++++++++++++++----------
 css/table.css  | 10 +++++-----
 index.html     |  2 ++
 login.html     |  2 ++
 8 files changed, 40 insertions(+), 27 deletions(-)
diff --git a/account.html b/account.html
index ebace09..427e805 100644
--- a/account.html
+++ b/account.html
@@ -11,6 +11,8 @@
 	</head>
 	<body>
 		<header>
+			<h1>tronnet</h1>
+			<hr>
 			<nav>
 				<a href="index.html">INSTANCES</a>
 				<a href="account.html" aria-current="true">ACCOUNT</a>
diff --git a/config.html b/config.html
index 8d7118f..e4b4b7c 100644
--- a/config.html
+++ b/config.html
@@ -12,8 +12,11 @@
 	</head>
 	<body>
 		<header>
+			<h1>tronnet</h1>
+			<hr>
 			<nav>
 				<a href="index.html" aria-current="true">INSTANCES</a>
+				<a href="account.html">ACCOUNT</a>
 				<a href="login.html">LOGOUT</a>
 			</nav>
 		</header>
diff --git a/css/button.css b/css/button.css
index 82c28d0..5b69d91 100644
--- a/css/button.css
+++ b/css/button.css
@@ -2,7 +2,7 @@
 	display: flex;
 	justify-content: center;
 	flex-direction: row;
-	flex-wrap: wrap;
+	flex-wrap: nowrap;
 	gap: 10px;
 }
 
diff --git a/css/form.css b/css/form.css
index 5579743..cb91981 100644
--- a/css/form.css
+++ b/css/form.css
@@ -2,47 +2,47 @@ form {
 	width: fit-content;
 }
 
-p {
+form p {
 	text-align: left;
 	margin: 0px;
 }
 
-fieldset {
+form fieldset {
 	border: solid var(--content-txt-color) 1px;
 	padding: 10px;
 	margin: 10px;
 }
 
-input, label, legend {
+form input, form label, form legend {
 	font-family: monospace;
 	font-size: 14px;
 }
 
-input, select {
+form input, form select {
 	border: solid var(--content-txt-color) 1px;
 	min-width: fit-content;
 }
 
-input:focus, select:focus {
+form input:focus, form select:focus {
 	outline: none;
 }
 
-input:disabled, select:disabled {
+form input:disabled, form select:disabled {
 	background-color: var(--form-disabled-color);
 }
 
-button {
+form button {
 	margin-top: 0px;
 }
 
-.input-grid {
+form .input-grid {
 	display: grid;
 	column-gap: 10px;
 	row-gap: 5px;
 	align-items: center;
 }
 
-legend {
+form legend {
 	top: -0.6em;
 	position: relative;
 	height: 0;
@@ -52,13 +52,13 @@ form img {
 	width: 16px;
 }
 
-hr {
+form hr {
 	width: 100%;
 	border: none;
 	border-top: solid var(--content-txt-color) 1px;
 }
 
-.last-item {
+form .last-item {
 	width: 100%; 
 	display: flex; 
 	justify-content: flex-end; 
diff --git a/css/style.css b/css/style.css
index 085fb27..7cfca08 100644
--- a/css/style.css
+++ b/css/style.css
@@ -31,15 +31,17 @@ header, footer {
 	background-color: var(--accent-bkg-color);
 	color: var(--accent-txt-color);
 	padding: 20px;
-	width: 15vw;
-	min-width: max-content;
-	max-width: 25ch;
 }
 
 header {
 	grid-area: header;
 }
 
+header hr {
+	margin-top: 20px;
+	margin-bottom: 20px;
+}
+
 main {
 	grid-area: main;
 	background-color: var(--content-bkg-color);
@@ -62,7 +64,7 @@ nav {
 
 nav a {
 	color: var(--accent-txt-color);
-	font-size: xx-large;
+	font-size: x-large;
 	text-decoration: none;
 	position: relative;
 	padding: 10px;
@@ -94,21 +96,23 @@ h1, h2, h3, p {
 }
 
 h1 {
+	font-size: xxx-large; 
+	text-align: center;
+	margin: 0px;
+}
+
+h2 {
 	font-size: xx-large; 
 	text-align: center;
 }
 
-h2 {
+h3 {
 	font-size: x-large; 
 	text-align: center;
 }
 
-h3 {
-	font-size: larger; 
-	text-align: center;
-}
-
 p {
+	font-size: large;
 	text-align: left;
 }
 
diff --git a/css/table.css b/css/table.css
index 0c15eb1..98c8c91 100644
--- a/css/table.css
+++ b/css/table.css
@@ -5,24 +5,24 @@ table {
 	text-align: left;
 }
 
-thead {
+table thead {
 	background-color: var(--accent-bkg-color);
 	color: var(--accent-txt-color);
 }
 
-tbody {
+table tbody {
 	background-color: var(--content-bkg-color);
 	color: var(--content-txt-color);
 }
 
-tbody tr:nth-child(even) {
+table tbody tr:nth-child(even) {
 	background-color: #ddd;
 }
 
-tbody tr:hover {
+table tbody tr:hover {
 	background-color: #aaa;
 }
 
-th, td {
+table th, table td {
 	padding: 5px;
 }
\ No newline at end of file
diff --git a/index.html b/index.html
index e298610..20edfea 100644
--- a/index.html
+++ b/index.html
@@ -26,6 +26,8 @@
 	</head>
 	<body>
 		<header>
+			<h1>tronnet</h1>
+			<hr>
 			<nav>
 				<a href="index.html" aria-current="true">INSTANCES</a>
 				<a href="account.html">ACCOUNT</a>
diff --git a/login.html b/login.html
index 8fea64a..a96597e 100644
--- a/login.html
+++ b/login.html
@@ -12,6 +12,8 @@
 	</head>
 	<body>
 		<header>
+			<h1>tronnet</h1>
+			<hr>
 			<nav>
 				<a href="login.html" aria-current="true">LOGIN</a>
 			</nav>
