Changed signin and signup design

3 files changed, 68 insertions, 51 deletions

diff --git a/assets/css/style.css b/assets/css/style.css
index 95e3a39..e8a88b7 100644
--- a/assets/css/style.css
+++ b/assets/css/style.css
@@ -34,10 +34,11 @@ main {
 }
 /*** INDEX.HTML ***/
 main .search {
-	background-color: rgba(235,235,235, 0.7);
+	background-color: rgba(235,235,235, 0.1);
 	overflow: auto;
 }
 
+
 main .search h2{
 	font-family: 'Lato', sans-serif;
 	color: gray;
@@ -508,6 +509,24 @@ hr {
 
 /***** Signin *****/
 
-.insite-signin {
-	border-right: 1px solid darkgray;
-}
\ No newline at end of file
+.signin-btn, .signup-btn {
+    border-radius: 0 !important;
+}
+
+.slate {
+    background-color: rgba(80,80,80, 0.3);
+    padding-bottom: 20px;
+    border-radius: 15px;
+}
+
+.slate .container {
+    width: 100%;
+    padding: 15px;
+}
+
+.signin, .signup {
+    color: #F8F8F8;
+    font-weight: normal;
+    text-align: center;
+}
+
diff --git a/views/signin.hbs b/views/signin.hbs
index b112485..dc0bb8a 100644
--- a/views/signin.hbs
+++ b/views/signin.hbs
@@ -1,52 +1,48 @@
 <main id="solutions-main">
-    <div class="row">
+        <div class="row">
+                <div class="slate signin-page col-sm-4 col-sm-offset-4 col-md-4 col-md-offset-4">
+                    <div class="container">
+                    {{# if success }}
+                        <section class="alert alert-success">
+                            <!-- Change those to banners later -->
+                            <h2>Signup Successful!</h2>
+                        </section>
+                    {{ else }}
+                        {{# if errors }}
+                            <section class="alert alert-danger">
+                                <ul>
+                                    {{# each errors }}
+                                        <li>{{ this.msg }}</li>
+                                    {{/each}}
+                                </ul>
+                            </section>
+                        {{/if}}
+                    {{/if}}
+                    {{#if flashMsg}}
+                        <section class="alert alert-danger">
+                            {{flashMsg}}
+                        </section>
+                    {{/if}}
 
-        <div class="col-md-4 col-md-offset-4 col-sm-6 col-sm-offset-3">
-            {{# if success }}
-                <section class="alert alert-success">
-                    <!-- Change those to banners later -->
-                    <h2>Signup Successful!</h2>
-                </section>
-            {{ else }}
-                {{# if errors }}
-                    <section class="alert alert-danger">
-                        <ul>
-                            {{# each errors }}
-                                <li>{{ this.msg }}</li>
-                            {{/each}}
-                        </ul>
-                    </section>
-                {{/if}}
-            {{/if}}
-            {{#if flashMsg}}
-                <section class="alert alert-danger">
-                    {{flashMsg}}
-                </section>
-            {{/if}}
+                    <h3 class="signin"><hr><i class="fa fa-sign-in" aria-hidden="true"></i> Sign In<hr></h3>
+                    <form action="/user/signin" method="post">
+                        <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>
+                        <input type="hidden" name="_csrf" value="{{ csrfToken }}">
+                        <button class="signin-btn signin-insite btn-lg btn btn-primary btn-block"><span>Sign In</span></button>
+                    </form>
 
-        </div>
 
-    </div>
-    <div class="row">
-        <div class="insite-signin col-sm-3 col-sm-offset-3 col-md-3 col-md-offset-3">
-            <h3><i class="fa fa-sign-in" aria-hidden="true"></i> Sign in</h3>
-            <form action="/user/signin" method="post">
-                <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">
+                    <h3 class="signin signin-or">or</h3>
+                    <a href="/auth/facebook" class=" signin-btn btn-lg btn btn-primary btn-block"><span>
+                        <span class="fa fa-facebook"> </span>   Facebook connect</span></a>
+
+                    </div>
                 </div>
-                <input type="hidden" name="_csrf" value="{{ csrfToken }}">
-                <button class="btn btn-primary">Sign In</button>
-            </form>
         </div>
-        <div class="col-sm-3 col-md-3">
-            <h3><i class="fa fa-sign-in" aria-hidden="true"></i> Sign in with:</h3>
-            <a href="/auth/facebook" class="btn btn-primary"><span class="fa fa-facebook"></span> Facebook</a>
-        </div>
-    </div>
-
-
 
 </main>
\ No newline at end of file
diff --git a/views/signup.hbs b/views/signup.hbs
index e7d9c9a..b9cbb86 100644
--- a/views/signup.hbs
+++ b/views/signup.hbs
@@ -2,7 +2,8 @@
 
 <div class="row" id="solutions-main">
 
-    <div class="col-md-4 col-md-offset-4 col-sm-6 col-sm-offset-3">
+    <div class="slate signup-page col-sm-4 col-sm-offset-4 col-md-4 col-md-offset-4">
+        <div class="container">
         {{# if success }}
             <section class="alert alert-success">
                 <!-- Change those to banners later -->
@@ -27,7 +28,7 @@
 
 
 
-        <h3><i class="fa fa-user-plus" aria-hidden="true"></i> Sign Up</h3>
+        <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">
@@ -62,8 +63,9 @@
                 <input type="text" class="form-control" placeholder="Department (optional)" name="dept">
             </div>
             <input type="hidden" name="_csrf" value="{{ csrfToken }}">
-            <button class="btn btn-primary">Sign Up</button>
+            <button class="signup-btn btn-lg btn btn-primary btn-block">Sign Up</button>
         </form>
+        </div>
     </div>
 
 </div>