Authorization dialog redesign

2018-01-28 21:45:30 +02:00 · 2018-01-28 21:45:30 +02:00 · 23bfd503c3
commit 23bfd503c3
parent caf6ab8915
1 changed files with 58 additions and 56 deletions
--- a/views/authorization.pug
+++ b/views/authorization.pug
@ -1,61 +1,63 @@
 extends layout
 block title
-	|Icy Network - Authorize Client
+	|Icy Network - Authorize Application

 block body
-	.wrapper
-		.boxcont
-			.box#login
-				h1 Authorize OAuth2 Application
-				.left
-					.application
-						.picture
-							if client.icon
-								img(src=client.icon)
-							else
-								.noicon
-									i.fa.fa-fw.fa-gears
-						.info
-							.name= client.title
-							.description= client.description
-							a.url(href=client.url, target="_blank", rel="nofollow")= client.url
-					form#loginForm(method="POST", action="")
-						input(type="hidden", name="csrf", value=csrf)
-						input(type="hidden", name="decision", value='1')
-						input.authorize(type="submit", value="Authorize")
-					form#loginForm(method="POST", action="")
-						input(type="hidden", name="csrf", value=csrf)
-						input(type="hidden", name="decision", value='0')
-						input.deny(type="submit", value="Deny")
-				.right
-					.haveaccess 
-						span This application can
-						ul.nobulletin
-							if scope.indexOf('email') !== -1
-								li 
-									i.fa.fa-fw.fa-envelope
-									|See your Email address
-							li 
-								i.fa.fa-fw.fa-user
-								|See your Display Name
-					.noaccess 
-						span This application cannot
-						ul.nobulletin
-							if scope.indexOf('email') === -1
-								li 
-									i.fa.fa-fw.fa-envelope
-									|See your Email address
-							li 
-								i.fa.fa-fw.fa-lock
-								|See your Password
-							li 
+	.container.mb-4.mt-4
+		h1 Authorize Application
+		p 
+			b= client.title
+			|  wants you to give them access to your user details and authenticate you, without giving them your password. The list of things 
+			b=client.title
+			|  can and cannot do are provided below.
+		.row.mb-2
+			.col
+				.application
+					.picture
+						if client.icon
+							img(src=client.icon)
+						else
+							.noicon
 								i.fa.fa-fw.fa-gears
-								|Change your Account Settings
-				if client.verified != 1
-					.unaffiliated
-						br
-						span
-							i.fa.fa-fw.fa-warning
-							|This application is not affiliated with Icy Network
-							i.fa.fa-fw.fa-warning
-
+					.info
+						.name= client.title
+						.description= client.description
+						a.url(href=client.url, target="_blank", rel="nofollow")= client.url
+				form(method="POST", action="")
+					input(type="hidden", name="csrf", value=csrf)
+					input(type="hidden", name="decision", value='1')
+					button.btn.btn-success(type="submit") Authorize Access
+				p
+				form(method="POST", action="")
+					input(type="hidden", name="csrf", value=csrf)
+					input(type="hidden", name="decision", value='0')
+					button.btn.btn-danger(type="submit") Deny Access
+			.col
+				.haveaccess 
+					span This application can
+					ul.nobulletin
+						if scope.indexOf('email') !== -1
+							li 
+								i.fa.fa-fw.fa-envelope
+								|See your Email address
+						li 
+							i.fa.fa-fw.fa-user
+							|See your Display Name
+				.noaccess 
+					span This application cannot
+					ul.nobulletin
+						if scope.indexOf('email') === -1
+							li 
+								i.fa.fa-fw.fa-envelope
+								|See your Email address
+						li 
+							i.fa.fa-fw.fa-lock
+							|See your Password
+						li 
+							i.fa.fa-fw.fa-gears
+							|Change your Account Settings
+		.alert.alert-info
+			b Note! 
+			|You can revoke #{client.title} at any time from your 
+			a(href="/user/manage") Account Settings
+			|.