changeset 5270:7acf73d2ebb5

mod_http_oauth2: Use <fieldset> in templates because it looks nice Removes some CSS as well
author Kim Alvefur <zash@zash.se>
date Thu, 23 Mar 2023 16:19:09 +0100
parents 0e5a37f55440
children 3a1df3adad0c
files mod_http_oauth2/html/consent.html mod_http_oauth2/html/login.html mod_http_oauth2/html/style.css
diffstat 3 files changed, 10 insertions(+), 22 deletions(-) [+]
line wrap: on
line diff
--- a/mod_http_oauth2/html/consent.html	Thu Mar 23 12:47:51 2023 +0100
+++ b/mod_http_oauth2/html/consent.html	Thu Mar 23 16:19:09 2023 +0100
@@ -13,7 +13,8 @@
 	</div>}
 
 	<h1>{site_name}</h1>
-	<h2>Authorize new application</h2>
+	<fieldset>
+	<legend>Authorize new application</legend>
 	<p>A new application wants to connect to your account.</p>
 	<dl>
 		<dt>Name</dt>
@@ -40,6 +41,7 @@
 		<button type="submit" name="consent" value="denied">Deny</button>
 		<button type="submit" name="consent" value="granted">Allow</button>
 	</form>
+	</fieldset>
 	</main>
 </body>
 </html>
--- a/mod_http_oauth2/html/login.html	Thu Mar 23 12:47:51 2023 +0100
+++ b/mod_http_oauth2/html/login.html	Thu Mar 23 16:19:09 2023 +0100
@@ -9,7 +9,8 @@
 <body>
 	<main>
 	<h1>{site_name}</h1>
-	<h2>Sign in</h2>
+	<fieldset>
+	<legend>Sign in</legend>
 	<p>Sign in to your account to continue.</p>
 	{state.error&<div class="error">
 		<p>{state.error}</p>
@@ -19,6 +20,7 @@
 		<input type="password" name="password" placeholder="Password" aria-label="Password" autocomplete="current-password" required><br/>
 		<input type="submit" value="Sign in">
 	</form>
+	</fieldset>
 	</main>
 </body>
 </html>
--- a/mod_http_oauth2/html/style.css	Thu Mar 23 12:47:51 2023 +0100
+++ b/mod_http_oauth2/html/style.css	Thu Mar 23 16:19:09 2023 +0100
@@ -1,5 +1,6 @@
 body
 {
+	margin-top:14%;
 	text-align:center;
 	background-color:#f8f8f8;
 	font-family:sans-serif
@@ -10,6 +11,9 @@
 	font-size:xx-large;
 }
 
+legend {
+	font-size:x-large;
+}
 p
 {
 	font-size:large;
@@ -82,30 +86,10 @@
 
 @media(min-width: 768px)
 {
-	body
-	{
-		margin-top: 3em;
-	}
-
 	main
 	{
 		margin-left: auto;
 		margin-right: auto;
-		border: solid 1px #1e1e1e;
-		background-color: #efefef;
 	}
 
-	@media(prefers-color-scheme:dark)
-	{
-		body
-		{
-			background-color: #4e4e4e;
-		}
-
-		main
-		{
-			color: #fff;
-			background-color: #1f1f1f;
-		}
-	}
 }