From c03f38b02b5fb383127284931f0c598e52125030 Mon Sep 17 00:00:00 2001
From: nanalelfe <nargiza.nosirova@mail.utoronto.ca>
Date: Mon, 15 Aug 2016 04:57:33 -0400
Subject: Improved UI for signin and signup

---
 views/signup.hbs | 82 ++++++++++++++++++++++++++++++++++++++------------------
 1 file changed, 56 insertions(+), 26 deletions(-)

(limited to 'views/signup.hbs')

diff --git a/views/signup.hbs b/views/signup.hbs
index b9cbb86..09b6c20 100644
--- a/views/signup.hbs
+++ b/views/signup.hbs
@@ -30,38 +30,68 @@
 
         <h3 class="signup"><hr><i class="fa fa-user-plus" aria-hidden="true"></i> Sign Up<hr></h3>
         <form action="/user/signup" method="post">
-            <div class="form-group">
-                <input type="text" class="form-control" placeholder="First Name" name="fname">
-            </div>
+            <div class="form-group signup-group ">
+                <div class="input-group input-group-lg">
+                    <div class="input-group-addon addon-fname">
+                        <i class="fa fa-male" aria-hidden="true"></i>
+                    </div>
+                    <input type="text" class="form-control input-fname" placeholder="first name" name="fname">
+                </div>
+                <div class="input-group input-group-lg">
+                    <div class="input-group-addon">
+                        <i class="fa fa-cube" aria-hidden="true"></i>
+                    </div>
+                    <input type="text" class="form-control input-lname" placeholder="last name" name="lname">
+                </div>
+                <div class="input-group input-group-lg">
+                    <div class="input-group-addon">
+                        <i class="fa fa-at" aria-hidden="true"></i>
+                    </div>
+                    <input type="email" class="form-control input-email" placeholder="email" name="email">
+                </div>
+                <div class="input-group input-group-lg">
+                    <div class="input-group-addon">
+                        <i class="fa fa-user" aria-hidden="true"></i>
+                    </div>
+                    <input type="text" class="form-control input-username-signin" placeholder="username" name="usrname">
+                </div>
+                <div class="input-group input-group-lg">
+                    <div class="input-group-addon">
+                        <i class="fa fa-lock" aria-hidden="true"></i>
+                    </div>
+                    <input type="password" class="form-control input-new-password" placeholder="password" name="password">
+                </div>
 
-            <div class="form-group">
-                <input type="text" class="form-control" placeholder="Last Name" name="lname">
-            </div>
+                <div class="input-group input-group-lg">
+                    <div class="input-group-addon">
+                        <i class="fa fa-unlock-alt" aria-hidden="true"></i>
+                    </div>
+                    <input type="password" class="form-control input-confirm" placeholder="confirm password" name="confirmPassword">
+                </div>
 
-            <div class="form-group">
-                <input type="email" class="form-control" placeholder="Email" name="email">
-            </div>
+                <div class="input-group input-group-lg">
+                    <div class="input-group-addon">
+                        <i class="fa fa-mobile" aria-hidden="true"></i>
+                    </div>
+                    <input type="number" class="form-control input-phone" placeholder="phone number (optional)" name="phone_num">
+                </div>
 
-            <div class="form-group">
-                <input type="text" class="form-control" placeholder="New Username" name="usrname">
-            </div>
-            <div class="form-group">
-                <input type="password" class="form-control" placeholder="New Password" name="password">
-            </div>
+                <div class="input-group input-group-lg">
+                    <div class="input-group-addon">
+                        <i class="fa fa-university" aria-hidden="true"></i>
+                    </div>
+                    <input type="text" class="form-control input-univ" placeholder="university (optional)" name="univ">
+                </div>
 
-            <div class="form-group">
-                <input type="password" class="form-control" placeholder="Confirm Password" name="confirmPassword">
-            </div>
-            <div class="form-group">
-                <input type="number" class="form-control" placeholder="Phone Number (optional)" name="phone_num">
-            </div>
-            <div class="form-group">
-                <input type="text" class="form-control" placeholder="University (optional)" name="univ">
+                <div class="input-group input-group-lg">
+                    <div class="input-group-addon addon-dept">
+                        <i class="fa fa-trophy" aria-hidden="true"></i>
+                    </div>
+                    <input type="text" class="form-control input-dept" placeholder="department (optional)" name="dept">
+                </div>
             </div>
 
-            <div class="form-group">
-                <input type="text" class="form-control" placeholder="Department (optional)" name="dept">
-            </div>
+
             <input type="hidden" name="_csrf" value="{{ csrfToken }}">
             <button class="signup-btn btn-lg btn btn-primary btn-block">Sign Up</button>
         </form>
-- 
cgit v1.2.3