diff options
| -rw-r--r-- | assets/css/creative.css | 1 | ||||
| -rw-r--r-- | assets/css/style.css | 78 | ||||
| -rw-r--r-- | views/signin.hbs | 24 | ||||
| -rw-r--r-- | views/signup.hbs | 82 |
4 files changed, 151 insertions, 34 deletions
diff --git a/assets/css/creative.css b/assets/css/creative.css index 17ee257..a4c3ab8 100644 --- a/assets/css/creative.css +++ b/assets/css/creative.css @@ -386,3 +386,4 @@ header .header-content .header-content-inner hr { .follow-exam-btn{ margin: 15px; } + diff --git a/assets/css/style.css b/assets/css/style.css index e8a88b7..f688524 100644 --- a/assets/css/style.css +++ b/assets/css/style.css @@ -522,6 +522,8 @@ hr { .slate .container { width: 100%; padding: 15px; + padding-left: 25px; + padding-right: 25px; } .signin, .signup { @@ -530,3 +532,79 @@ hr { text-align: center; } +.signin-insite, .signup-btn{ + color: #fff; + background-color: rgba(80,80,80, 0.5) !important; + border-color: rgba(80,80,80, 0.5) !important; +} + +.signin-insite:hover, .signup-btn:hover { + color: #fff; + background-color: rgba(80,80,80, 0.2) !important; + border-color: rgba(80,80,80, 0.2) !important; +} + +.signin-fb{ + color: #fff; + background-color: #3b5998 !important; + border-color: #3b5998 !important; +} + +.signin-fb:hover { + color: #fff; + background-color: #8b9dc3 !important; + border-color: #8b9dc3 !important; +} + + + +.input-username, .input-password, .input-group-addon{ + font-size: 1em !important; + border-radius: 0 !important; +} + +.input-lname, .input-email, .input-username-signin, .input-new-password, +.input-confirm, .input-phone, .input-univ{ + font-size: 1em !important; + border-radius: 0 !important; + border-bottom: 0 !important; + box-shadow: none !important; +} + +.input-fname{ + font-size: 1em !important; + border-radius: 0 !important; + border-top-right-radius: 8px !important; + border-bottom: 0 !important; + box-shadow: none !important; +} + +.input-dept { + font-size: 1em !important; + border-radius: 0 !important; + border-bottom-right-radius: 8px !important; + box-shadow: none !important; +} +.input-username { + font-size: 1em !important; + border-top-right-radius: 8px !important; +} + +.addon-username, .addon-fname { + border-top-left-radius: 8px !important; +} + +.input-password, .input-dept { + border-bottom-right-radius: 8px !important; +} + +.addon-password, .addon-dept { + border-bottom-left-radius: 8px !important; +} + + + +.input-group-addon { + min-width:50px; + text-align:left; +}
\ No newline at end of file diff --git a/views/signin.hbs b/views/signin.hbs index dc0bb8a..e985c13 100644 --- a/views/signin.hbs +++ b/views/signin.hbs @@ -26,20 +26,28 @@ <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 class="form-group signin-group"> + <div class="input-group input-group-lg"> + <div class="input-group-addon addon-username"> + <i class="fa fa-envelope" aria-hidden="true"></i> + </div> + <input type="text" class="form-control input-username" placeholder="email" name="usrname"> + </div> + <div class="input-group input-group-lg"> + <div class="input-group-addon addon-password"> + <i class="fa fa-key" aria-hidden="true"></i> + </div> + <input type="password" class="form-control input-lg input-password" placeholder="password" name="password"> + </div> </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> - <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> + <h4 class="signin signin-or">or</h4> + <a href="/auth/facebook" class="signin-fb signin-btn btn-lg btn btn-primary btn-block"><span> + <span class="fa fa-facebook"> </span> Sign in with Facebook</span></a> </div> </div> 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> |