From d45990330fbc14ad0863b91130dc650ec7a36474 Mon Sep 17 00:00:00 2001
From: Pete Nawara <pete@petenawara.com>
Date: Thu, 19 Jun 2014 14:12:28 -0500
Subject: [PATCH] Added some basic styling to views

---
 public/images/anvil.svg    |  43 ++++++
 public/stylesheets/app.css | 268 +++++++++++++++++++++++++++++++++++++
 views/authorize.jade       |  97 ++++++++------
 views/signin.jade          |  59 +++++---
 views/signup.jade          |  60 +++++----
 5 files changed, 444 insertions(+), 83 deletions(-)
 create mode 100644 public/images/anvil.svg
 create mode 100644 public/stylesheets/app.css

diff --git a/public/images/anvil.svg b/public/images/anvil.svg
new file mode 100644
index 00000000..1a434045
--- /dev/null
+++ b/public/images/anvil.svg
@@ -0,0 +1,43 @@
+<?xml version="1.0" encoding="utf-8"?>
+<!-- Generator: Adobe Illustrator 17.1.0, SVG Export Plug-In . SVG Version: 6.00 Build 0)  -->
+<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
+<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
+	 viewBox="0 0 150 62.6" enable-background="new 0 0 150 62.6" xml:space="preserve">
+<g>
+	<path d="M41.5,53.4c0.3-0.1,0.6-0.1,0.9-0.2c0.3-0.1,0.7-0.2,1-0.3c0.4-0.1,0.7-0.3,1.1-0.4c0.4-0.2,0.8-0.4,1.2-0.6
+		c0.8-0.4,1.6-1.1,2.3-1.8c0.7-0.7,1.5-1.5,2-2.5c0.1-0.2,0.3-0.5,0.4-0.7c0.1-0.3,0.2-0.5,0.3-0.8c0.1-0.6,0.3-1.1,0.4-1.6
+		c0.1-0.5,0.1-1.1,0.2-1.7c0-0.3,0-0.5,0-0.8c0-0.2,0-0.3,0-0.5l-6,1.2L39.7,53c0,0-0.1,0-0.1,0v0.6c0,0,0.3,0,0.6,0
+		C40.4,53.5,41,53.5,41.5,53.4z"/>
+	<path d="M109.7,0H77.6H52.4v4.1h-8.2v1.8h-4.1H0c8.6,12.3,23.2,21,39.8,21c0.7,0,1.4-0.2,2-0.2C43,26.8,44,27,45,27.4
+		c0.2,0.1,0.4,0.1,0.6,0.2c0.4,0.1,0.8,0.3,1.2,0.4c0.4,0.2,0.9,0.4,1.3,0.6c0.9,0.5,1.8,1.1,2.6,2c0.8,0.8,1.6,1.8,2.3,2.9
+		c0.6,1.1,1.2,2.4,1.5,3.7c0.1,0.3,0.1,0.7,0.2,1c0.1,0.3,0.1,0.7,0.1,1l0,0.5l0,0.3l0,0.1l0,0l0,0l0,0.1l0,0.1c0,0.3,0,0.6,0,0.9
+		c0,0.3-0.1,0.7-0.1,1c-0.1,0.4-0.1,0.7-0.3,1.1c-0.1,0.3-0.2,0.7-0.4,1c-0.1,0.3-0.3,0.6-0.5,0.9c-0.3,0.6-0.7,1.2-1.1,1.7
+		c-0.4,0.5-0.8,1-1.2,1.5c-0.8,0.9-1.7,1.7-2.6,2.4c-0.9,0.6-1.8,1.1-2.7,1.5c-0.4,0.2-0.9,0.4-1.3,0.5c-0.4,0.1-0.8,0.3-1.2,0.3
+		c0,0,0,0,0,0c-0.4,0.1-0.7,0.2-1.1,0.2c-0.3,0-0.6,0.1-0.9,0.1c-0.5,0.1-1.1,0-1.4,0.1c-0.3,0-0.6,0-0.6,0v9h17.7
+		c4.1-5.8,10.5-8.9,17.8-8.9s13.7,3.1,17.8,8.9h16.3v-9.3l-4,0h1.3c0,0-0.2,0-0.6,0c-0.2,0-0.4,0-0.7,0c-0.1,0-0.3,0-0.5,0
+		c-0.2,0-0.3,0-0.5-0.1c-0.4,0-0.8-0.1-1.2-0.2c-0.4-0.1-0.9-0.2-1.4-0.3c-0.5-0.1-1-0.3-1.6-0.5c-0.6-0.2-1.1-0.4-1.7-0.7
+		c-0.3-0.1-0.6-0.3-0.9-0.5c-0.3-0.2-0.6-0.3-0.9-0.5c-0.6-0.4-1.2-0.8-1.8-1.2c-1.2-0.9-2.4-2-3.7-3.2c-1.2-1.2-2.3-2.7-3.2-4.5
+		c-0.2-0.4-0.4-0.9-0.5-1.3C87.1,40,87,39.7,87,39.4l0,0c0-0.2-0.1-0.4-0.1-0.6c-0.1-0.5-0.2-1-0.2-1.4c0-0.2,0-0.5-0.1-0.7l0-0.4
+		l0-0.2l0-0.1l0,0c0-0.1,0,0.1,0-0.2l0,0c0.1-0.9,0.1-1.6,0.3-2.7c0.1-1.1,0.5-2,0.8-2.9c0.4-0.9,0.7-1.8,1.2-2.6
+		c0.3-0.4,0.5-0.8,0.7-1.2c0.3-0.4,0.6-0.7,0.8-1.1c0.3-0.4,0.6-0.7,0.9-1l0.5-0.5c0.2-0.2,0.3-0.3,0.5-0.4c0.3-0.3,0.7-0.6,1-0.8
+		c0.3-0.2,0.7-0.5,1-0.7c0.2-0.1,0.3-0.2,0.5-0.3c0.2-0.1,0.3-0.2,0.5-0.3c0.3-0.2,0.7-0.4,1-0.6c0.7-0.3,1.4-0.6,2-0.8
+		c0.7-0.2,1.3-0.4,1.9-0.5c0.6-0.1,1.2-0.3,1.7-0.3c0.6,0,1.1-0.1,1.5-0.1c0.5,0,0.9,0,1.3,0c0.2,0,0.4,0,0.5,0c0,0,0,0,0.1,0
+		c0,0,0,0,0,0c1.5,0,2.9,0.5,4.3,0.8l17.6-10.9h4.7V0H109.7z M43.6,18.7c-6.4-6.9-19.6,0.6-38-9.9h38V18.7z M51.8,12.3L51.8,12.3
+		c-0.2,1.3-1.3,2.3-2.6,2.3c-1.4,0-2.5-1-2.6-2.3h0V6.4h5.3V12.3z M86.6,48.7c0.6,0.4,1.1,0.8,1.7,1.2c0.5,0.4,1,0.8,1.5,1.1
+		c1,0.7,1.8,1.5,2.5,2.1c0.7,0.7,1.3,1.3,1.8,1.7c1,1,1.6,1.6,1.6,1.6s-0.6-0.5-1.6-1.5c-0.5-0.5-1.2-1-1.9-1.7
+		c-0.8-0.6-1.6-1.3-2.6-2c-0.5-0.4-1-0.7-1.5-1.1c-0.5-0.4-1.1-0.7-1.7-1.1c-0.3-0.2-0.6-0.4-0.9-0.5c-0.3-0.2-0.6-0.3-0.9-0.5
+		c-0.6-0.4-1.3-0.6-2-0.9c-1.4-0.5-2.8-1.1-4.4-1.4c-1.5-0.3-3.1-0.5-4.6-0.5c-1.6,0-3.1,0.2-4.6,0.6c-0.4,0.1-0.7,0.2-1.1,0.3
+		c-0.4,0.1-0.7,0.2-1.1,0.3c-0.7,0.2-1.4,0.5-2.1,0.8c-1.4,0.6-2.6,1.2-3.8,1.9c-1.2,0.7-2.3,1.4-3.2,2.1c-1,0.7-1.8,1.4-2.6,2
+		c-0.8,0.6-1.4,1.2-1.9,1.6c-0.5,0.5-0.9,0.8-1.2,1.1c-0.3,0.3-0.4,0.4-0.4,0.4s0.1-0.1,0.4-0.4c0.3-0.3,0.6-0.7,1.1-1.2
+		c0.5-0.5,1.1-1.1,1.8-1.8c0.7-0.7,1.5-1.4,2.5-2.2c1.9-1.6,4.2-3.3,6.9-4.7c0.7-0.3,1.4-0.7,2.2-0.9c0.4-0.1,0.8-0.3,1.1-0.4
+		c0.4-0.1,0.8-0.2,1.2-0.3c1.6-0.4,3.3-0.5,4.9-0.5c1.7,0.1,3.3,0.3,4.9,0.8c1.6,0.4,3,1,4.4,1.7c0.7,0.4,1.4,0.7,2,1.1
+		c0.3,0.2,0.6,0.4,0.9,0.5C86,48.3,86.3,48.5,86.6,48.7z M131.4,1.5l-0.2,1.5H131l-0.1-1.1c-1.5,0.2-3,0.3-4.5,0.5
+		c-1.6,0.1-3.2,0.3-4.8,0.4l-4.8,0.3l-4.8,0.2c-1.6,0.1-3.2,0.1-4.8,0.2l-4.8,0.1c-1.6,0-3.2,0-4.8,0.1l-4.8,0l-9.5-0.1l-4.8-0.1
+		c-1.6,0-3.2-0.1-4.8-0.2l-4.8-0.2l-4.8-0.3c-1.6-0.1-3.2-0.3-4.8-0.4c-1.5-0.1-3-0.3-4.5-0.5l-0.1,1.1h-0.2l-0.2-1.5V1.2H55l38-0.1
+		l38,0.1h0.3V1.5z"/>
+	<path d="M103.3,42.7l-10.9-2.2c0,0.3,0.1,0.5,0.1,0.8l0.1,0.6l0.1,0.5c0.1,0.4,0.1,0.7,0.2,1.1c0.1,0.4,0.2,0.7,0.3,1.1
+		c0.5,1.4,1.3,2.7,2.2,3.7c0.5,0.5,1,1,1.5,1.4c0.5,0.4,1.1,0.8,1.6,1.1c0.5,0.3,1.1,0.6,1.6,0.8c0.5,0.2,1,0.4,1.5,0.6
+		c0.5,0.1,0.9,0.3,1.4,0.4c0.4,0.1,0.8,0.2,1.2,0.2c0.2,0,0.4,0.1,0.5,0.1c0.2,0,0.3,0,0.5,0c0.3,0,0.5,0,0.7,0.1c0.4,0,0.6,0,0.6,0
+		h2.7L103.3,42.7z"/>
+</g>
+</svg>
diff --git a/public/stylesheets/app.css b/public/stylesheets/app.css
new file mode 100644
index 00000000..7d8f783c
--- /dev/null
+++ b/public/stylesheets/app.css
@@ -0,0 +1,268 @@
+body {
+  background: #fafafa;
+  font-family: 'Roboto', sans-serif;
+}
+
+* {
+  box-sizing: border-box;
+}
+
+:hover {
+  transition: .3s background;
+}
+
+h1, h2, h3, h4, h5, h6 {
+  font-family: 'Raleway', sans-serif;
+  text-transform: uppercase;
+  font-weight: 300;
+}
+
+a {
+  text-decoration: none;
+  color: #00a35f;
+}
+
+.logomark {
+  width: 140px;
+  background-origin: content-box;
+  margin: 0 auto;
+  display: block;
+}
+
+.logotype {
+  font-family: 'Playfair Display', sans-serif;
+  font-weight: 800;
+  font-size: 72px;
+  color: #00d97f;
+  width: 100%;
+  margin: -.2em auto 30px;
+}
+
+.thin {
+  font-weight: 100;
+  display: block;
+  font-size: 18px;
+  color: #000;
+  letter-spacing: 1.3em;
+  margin-right: -1.3em;
+  line-height: 0em;
+}
+
+.anvilform {
+  width: 500px;
+  margin: 0 auto;
+  margin-top: 60px;
+  min-height: 200px;
+  position: relative;
+}
+
+.anvilform h1 {
+  text-align: center;
+}
+
+.anvilform .textsep {
+  color: #999;
+  border: solid 1px #ccc;
+  text-align: center;
+  position: relative;
+  height: 0px;
+  border-width: 1px 0 0;
+}
+
+.anvilform .textsep:before {
+  content: '';
+  display: inline-block;
+  position: relative;
+  top: -14px;
+  padding: 0 10px;
+  background: #fff;
+  color: #8c8b8b;
+  font-size: 16px;
+  font-style: italic;
+}
+
+.anvilform .textsep.signinwith:before {
+  content: 'sign in with';
+}
+
+.anvilform .textsep.signupwith:before {
+  content: 'sign up with';
+}
+
+.anvilform .textsep.or:before {
+  content: 'or';
+}
+
+.anvilform .panel {
+  background: #ffffff;
+  border: 1px solid #ccc;
+  padding: 30px;
+  width: 400px;
+  margin: 0 auto;
+  position: relative;
+}
+
+.anvilform .error {
+  background: #f15a24;
+  color: #fff;
+  padding: 10px;
+  position: relative;
+  top: -16px;
+}
+
+.anvilform .panel .providers {
+  padding: 0px;
+  list-style-type: none;
+}
+
+.anvilform form input[type="text"], .anvilform form input[type="password"] {
+  background: #fafafa;
+  border: 1px solid #ccc;
+  height: 65px;
+  display: block;
+  padding: 20px;
+  width: 100%;
+  margin: 10px 0 0;
+  font-size: 18px;
+}
+
+.singlebutton {
+  display: inline-block;
+  margin-right: 2px;
+}
+
+.singlebutton.cancel {
+  margin-right: 0;
+}
+
+.anvilform button {
+  height: 65px;
+  margin: 10px 2px 0 0;
+  border: 0px solid #ccc;
+  background: #ccc;
+  cursor: pointer;
+  font-size: 24px;
+  text-transform: uppercase;
+  font-family: 'Raleway', sans-serif;
+  text-decoration: none;
+  font-weight: 100;
+  padding: 20px;
+  width: 168px;
+  transition: .3s background;
+  -webkit-user-select: none;
+  /* Chrome all / Safari all */
+  -moz-user-select: none;
+  /* Firefox all */
+  -ms-user-select: none;
+  /* IE 10+ */
+  -o-user-select: none;
+  user-select: none;
+}
+
+.anvilform button:hover {
+  background: #aaa;
+}
+
+.anvilform button.callout {
+  background: #21d782;
+  font-weight: 400;
+  color: #fff;
+}
+
+.anvilform button.full {
+  width: 100%;
+}
+
+.anvilform button.smalltext {
+  font-size: 12px;
+  position: relative;
+  top: -7px;
+}
+
+.anvilform button.callout:hover {
+  background: #4ddf9b;
+}
+
+.anvilform button:last-child {
+  margin-right: 0px;
+}
+
+.anvilform button a {
+  text-decoration: none;
+  color: #000;
+  font-weight: 100;
+}
+
+.providers li {
+  display: inline-block;
+  margin: 0 2px 4px;
+  height: 63px;
+  width: 63px;
+}
+
+.provider {
+  background: #aaa;
+  color: #fff;
+  display: inline-block;
+  padding: 15px;
+  height: 100%;
+  width: 100%;
+  text-align: center;
+  transition: .3s background;
+}
+
+.provider.google {
+  background: #dd4b39;
+}
+
+.provider.google:hover {
+  background: #a6382b;
+}
+
+.provider.facebook {
+  background: #3b5998;
+}
+
+.provider.facebook:hover {
+  background: #2c4372;
+}
+
+.provider.twitter {
+  background: #55acee;
+}
+
+.provider.twitter:hover {
+  background: #4993CC;
+}
+
+.provider.github, .provider.codepen {
+  background: #000;
+}
+
+.provider.github:hover, .provider.codepen:hover {
+  background: #333;
+}
+
+.provider.dribbble {
+  background: #ea4c89;
+}
+
+.provider.dribbble:hover {
+  background: #c06185;
+}
+
+.provider.instagram {
+  background: #517fa4;
+}
+
+.provider.instagram:hover {
+  background: #24557b;
+}
+
+.provider.wordpress {
+  background: #21759b;
+}
+
+.provider.wordpress:hover {
+  background: #195874;
+}
\ No newline at end of file
diff --git a/views/authorize.jade b/views/authorize.jade
index 3649be15..30f0defc 100644
--- a/views/authorize.jade
+++ b/views/authorize.jade
@@ -1,40 +1,57 @@
-h1 Authorize
-
-
-p= user.name || user.email
-
-if client.logo_uri
-  img(src=client.logo_uri)
-
-h3= client.client_name || client._id
-
-p This app would like to:
-
-ul
-  each scope in scopes
-    li= scope.description
-
-form(action='/authorize', method='POST')
-  input(type='hidden', name='response_type', value=request.response_type)
-  input(type='hidden', name='client_id', value=request.client_id)
-  input(type='hidden', name='redirect_uri', value=request.redirect_uri)
-  input(type='hidden', name='scope', value=request.scope)
-  input(type='hidden', name='nonce', value=request.nonce)
-  input(type='hidden', name='state', value=request.state)
-  input(type='hidden', name='authorize', value='true')
-  input(type='submit', value='Accept')
-
-
-form(action='/authorize', method='POST')
-  input(type='hidden', name='response_type', value=request.response_type)
-  input(type='hidden', name='client_id', value=request.client_id)
-  input(type='hidden', name='redirect_uri', value=request.redirect_uri)
-  input(type='hidden', name='scope', value=request.scope)
-  input(type='hidden', name='nonce', value=request.nonce)
-  input(type='hidden', name='state', value=request.state)
-  input(type='hidden', name='authorize', value='false')
-  input(type='submit', value='Cancel')
-
-
-p= 'Not ' + user.email + '? '
-  a(href='/signout') Signout
+html(lang="en")
+  head
+    title
+      | Sign in to Anvil Connect
+    
+    link(rel='stylesheet', href='//maxcdn.bootstrapcdn.com/font-awesome/4.1.0/css/font-awesome.min.css')
+    link(rel='stylesheet', href='/stylesheets/app.css')
+    link(rel='stylesheet', href='//fonts.googleapis.com/css?family=Roboto:400,100,100italic,400italic,700,700italic|Raleway:400,100,600,300')
+  body
+
+    .anvilform
+      img.logomark(src='/images/anvil.svg')
+      h1.logotype Anvil
+        span.thin Connect
+      .panel
+        h2
+          | Hello 
+          = user.name || user.email
+          | ,
+
+        //- if client.logo_uri
+        //-   img(src=client.logo_uri)
+
+        //- h3= client.client_name || client._id
+
+        p This app would like to:
+
+        ul
+          each scope in scopes
+            li= scope.description
+
+        form.singlebutton(action='/authorize', method='POST')
+          input(type='hidden', name='response_type', value=request.response_type)
+          input(type='hidden', name='client_id', value=request.client_id)
+          input(type='hidden', name='redirect_uri', value=request.redirect_uri)
+          input(type='hidden', name='scope', value=request.scope)
+          input(type='hidden', name='nonce', value=request.nonce)
+          input(type='hidden', name='state', value=request.state)
+          input(type='hidden', name='authorize', value='true')
+          button.callout(type='submit', value='Accept')
+            | Accept
+
+
+        form.singlebutton.cancel(action='/authorize', method='POST')
+          input(type='hidden', name='response_type', value=request.response_type)
+          input(type='hidden', name='client_id', value=request.client_id)
+          input(type='hidden', name='redirect_uri', value=request.redirect_uri)
+          input(type='hidden', name='scope', value=request.scope)
+          input(type='hidden', name='nonce', value=request.nonce)
+          input(type='hidden', name='state', value=request.state)
+          input(type='hidden', name='authorize', value='false')
+          button(type='submit', value='Cancel')
+            | Cancel
+
+
+        p= 'Not ' + user.email + '? '
+          a(href='/signout') Signout
diff --git a/views/signin.jade b/views/signin.jade
index 0661b518..614d6df8 100644
--- a/views/signin.jade
+++ b/views/signin.jade
@@ -1,25 +1,44 @@
-h1 Sign In
+doctype html
+html(lang="en")
+  head
+    title
+      | Sign in to Anvil Connect
+    
+    link(rel='stylesheet', href='//maxcdn.bootstrapcdn.com/font-awesome/4.1.0/css/font-awesome.min.css')
+    link(rel='stylesheet', href='/stylesheets/app.css')
+    link(rel='stylesheet', href='//fonts.googleapis.com/css?family=Roboto:400,100,100italic,400italic,700,700italic|Raleway:400,100,600,300')
+  body
 
-ul
-  each provider in Object.keys(providers)
-    li
-      a(href='/connect/' + provider + '?' + params)= provider
+    .anvilform
+      img.logomark(src='/images/anvil.svg')
+      h1.logotype Anvil
+        span.thin Connect
 
+      form.panel(method='POST', action='/signin')
+        // adding a class of error to this paragraph will add error styling
+        p= error
+        input(type='hidden', name='response_type', value=request.response_type)
+        input(type='hidden', name='client_id', value=request.client_id)
+        input(type='hidden', name='redirect_uri', value=request.redirect_uri)
+        input(type='hidden', name='scope', value=request.scope)
+        input(type='hidden', name='state', value=request.state)
+        hr.textsep.signinwith
+        ul.providers
+          each provider in Object.keys(providers)
+            li
+              a(href='/connect/' + provider + '?' + params)
+                i(class='provider fa-2x fa fa-' + provider + ' ' + provider)
+        hr.textsep.or
+        input(type='text', name='email', placeholder='Email')
+        input(type='password', name='password', placeholder='Password')
+        button.callout.full(type='submit', value='Sign in')
+          | Sign in
+        p
+          | Don't have an account? 
+          a(href='/signup?' + params) 
+            | Get Registered in Seconds
 
-form(method='POST', action='/signin')
-  p= error
-  input(type='hidden', name='response_type', value=request.response_type)
-  input(type='hidden', name='client_id', value=request.client_id)
-  input(type='hidden', name='redirect_uri', value=request.redirect_uri)
-  input(type='hidden', name='scope', value=request.scope)
-  input(type='hidden', name='state', value=request.state)
+      
 
-  input(type='text', name='email', placeholder='Email')
-  br
-  input(type='password', name='password', placeholder='Password')
-  br
-  input(type='submit', value='Sign in')
 
-
-p= 'New here? '
-  a(href='/signup?' + params) Create a new account.
+   
diff --git a/views/signup.jade b/views/signup.jade
index 3e78d2f2..b7d4eef1 100644
--- a/views/signup.jade
+++ b/views/signup.jade
@@ -1,26 +1,40 @@
-h1 Sign up
+doctype html
+html(lang="en")
+  head
+    title
+      | Sign in to Anvil Connect
+    
+    link(rel='stylesheet', href='//maxcdn.bootstrapcdn.com/font-awesome/4.1.0/css/font-awesome.min.css')
+    link(rel='stylesheet', href='/stylesheets/app.css')
+    link(rel='stylesheet', href='//fonts.googleapis.com/css?family=Roboto:400,100,100italic,400italic,700,700italic|Raleway:400,100,600,300|Playfair+Display+SC:900,400')
+  body
 
-ul
-  each provider in Object.keys(providers)
-    li
-      a(href='/connect/' + provider + '?' + params)= provider
+    .anvilform
+      img.logomark(src='/images/anvil.svg')
+      h1.logotype Anvil
+        span.thin Connect
 
+      form.panel(method='POST', action='/signup')
+        p= error
+        input(type='hidden', name='response_type', value=request.response_type)
+        input(type='hidden', name='client_id', value=request.client_id)
+        input(type='hidden', name='redirect_uri', value=request.redirect_uri)
+        input(type='hidden', name='scope', value=request.scope)
+        input(type='hidden', name='state', value=request.state)
+        hr.textsep.signupwith
+        ul.providers
+          each provider in Object.keys(providers)
+            li
+              a(href='/connect/' + provider + '?' + params)
+                i(class='provider fa-2x fa fa-' + provider + ' ' + provider)
+        hr.textsep.or
+        input(type='text', name='firstname', placeholder='First Name')
+        input(type='text', name='lastname', placeholder='Last Name')
+        input(type='text', name='email', placeholder='Email')
+        input(type='password', name='password', placeholder='Password')
+        button.callout.full(type='submit', value='Sign up')
+          | Sign up
 
-form(method='POST', action='/signup')
-  p= error
-  input(type='hidden', name='response_type', value=request.response_type)
-  input(type='hidden', name='client_id', value=request.client_id)
-  input(type='hidden', name='redirect_uri', value=request.redirect_uri)
-  input(type='hidden', name='scope', value=request.scope)
-  input(type='hidden', name='state', value=request.state)
-
-  input(type='text', name='name', placeholder='Name')
-  br
-  input(type='text', name='email', placeholder='Email')
-  br
-  input(type='password', name='password', placeholder='Password')
-  br
-  input(type='submit', value='Sign up')
-
-p= 'Already have an account? '
-  a(href='/signin?' + params) Sign in.
+        p
+          | Already have an account? 
+          a(href='/signin?' + params) Sign in here