Updated sign in and register pages

pull/229/merge
Abdullah Almsaeed 2015-02-06 12:33:55 -05:00
parent c371b396af
commit 3888ca4471
12 changed files with 196 additions and 617 deletions

View File

@ -104,46 +104,4 @@
.btn-linkedin { .btn-social(#007bb6); }
.btn-tumblr { .btn-social(#2c4762); }
.btn-twitter { .btn-social(#55acee); }
.btn-vk { .btn-social(#587ea3); }
// Button variants
// -------------------------
// Easily pump out default styles, as well as :hover, :focus, :active,
// and disabled options for all buttons
.button-variant(@color; @background; @border) {
color: @color;
background-color: @background;
border-color: @border;
&:hover,
&:focus,
&:active,
&.active,
.open .dropdown-toggle& {
color: @color;
background-color: darken(@background, 8%);
border-color: darken(@border, 12%);
}
&:active,
&.active,
.open .dropdown-toggle& {
background-image: none;
}
&.disabled,
&[disabled],
fieldset[disabled] & {
&,
&:hover,
&:focus,
&:active,
&.active {
background-color: @background;
border-color: @border;
}
}
.badge {
color: @background;
background-color: @color;
}
}
.btn-vk { .btn-social(#587ea3); }

View File

@ -4,10 +4,8 @@
*/
/* ADD THIS CLASS TO THE <BODY> TAG */
.lockscreen {
background: @gray;//url(../img/boxed-bg.png) repeat;
background: @gray;
}
/* We will put the dynamically generated digital clock here */
.lockscreen-logo {
font-size: 35px;
text-align: center;
@ -21,13 +19,11 @@
margin: 0 auto;
margin-top: 10%;
}
/* User name [optional] */
.lockscreen .lockscreen-name {
text-align: center;
font-weight: 600;
}
/* Will contain the image and the sign in form */
.lockscreen-item {
.border-radius(4px);
@ -37,7 +33,6 @@
margin: 10px auto 30px auto;
width: 290px;
}
/* User image */
.lockscreen-image {
.border-radius(50%);
@ -65,4 +60,8 @@
border: 0;
padding: 0 10px;
}
}
.lockscreen-footer {
margin-top: 10px;
}

View File

@ -2,41 +2,49 @@
* Page: Login & Register
* ----------------------
*/
.form-box {
width: 360px;
margin: 90px auto 0 auto;
.header {
.border-radius(4px, 4px, 0, 0);
background: @olive;
box-shadow: inset 0 -3px 0 rgba(0,0,0,0.2);
padding: 20px 10px;
text-align: center;
font-size: 26px;
font-weight: 300;
color: #fff;
}
.body, .footer {
padding: 10px 20px;
background: #fff;
.login-logo,
.register-logo {
font-size: 35px;
text-align: center;
margin-bottom: 25px;
a {
color: #444;
> .form-group {
margin-top: 20px;
> input {
border: #fff;
}
}
> .btn {
margin-bottom: 10px;
}
}
.footer {
.border-radius(0, 0, 4px, 4px);
}
@media (max-width: @screen-sm) {
width: 90%;
}
}
.login-page,
.register-page {
background: @gray;
}
.login-box,
.register-box {
width: 360px;
margin: 7% auto 0 auto;
@media (max-width: @screen-sm) {
width: 90%;
margin-top: 20px;
}
}
.login-box-body,
.register-box-body {
background: #fff;
padding: 20px;
color: #444;
border-top: 0;
color: #666;
.form-control-feedback {
color: #777;
}
}
.login-box-msg,
.register-box-msg {
margin: 0;
text-align: center;
padding: 0 20px 20px 20px;
}
.social-auth-links {
margin: 10px 0;
}

View File

@ -29,6 +29,9 @@
.product-description {
display: block;
color: #999;
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
}
}
.product-list-in-box > .item {

View File

@ -8,6 +8,7 @@
width: 25%;
float: left;
padding: 10px;
text-align: center;
> img {
.border-radius(50%);
max-width: 100%;
@ -17,12 +18,14 @@
}
.users-list-name,
.users-list-date {
display: block;
text-align: center;
display: block;
}
.users-list-name {
font-weight: 600;
color: #444;
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
&:hover {
color: #999;
}

View File

@ -21,3 +21,5 @@ v2.0
- Changed .right-side to .content-wrapper
- Changed .navbar-right to .navbar-custom-menu
- Removed unused files
- Updated lockscreen style (HTML markup changed!)
- Updated Login & Registration pages (HTML markup changed!)

517
dist/css/AdminLTE.css vendored
View File

@ -2153,6 +2153,9 @@ a:focus {
.products-list .product-description {
display: block;
color: #999;
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
}
.product-list-in-box > .item {
-webkit-box-shadow: none;
@ -2418,6 +2421,7 @@ table.text-center th {
width: 25%;
float: left;
padding: 10px;
text-align: center;
}
.users-list > li > img {
border-radius: 50%;
@ -2427,11 +2431,13 @@ table.text-center th {
.users-list-name,
.users-list-date {
display: block;
text-align: center;
}
.users-list-name {
font-weight: 600;
color: #444;
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
}
.users-list-name:hover {
color: #999;
@ -2558,7 +2564,6 @@ table.text-center th {
.lockscreen {
background: #d2d6de;
}
/* We will put the dynamically generated digital clock here */
.lockscreen-logo {
font-size: 35px;
text-align: center;
@ -2613,56 +2618,60 @@ table.text-center th {
border: 0;
padding: 0 10px;
}
.lockscreen-footer {
margin-top: 10px;
}
/*
* Page: Login & Register
* ----------------------
*/
.form-box {
width: 360px;
margin: 90px auto 0 auto;
}
.form-box .header {
border-top-left-radius: 4px;
border-top-right-radius: 4px;
border-bottom-right-radius: 0;
border-bottom-left-radius: 0;
background: #3d9970;
box-shadow: inset 0 -3px 0 rgba(0, 0, 0, 0.2);
padding: 20px 10px;
.login-logo,
.register-logo {
font-size: 35px;
text-align: center;
font-size: 26px;
font-weight: 300;
color: #fff;
margin-bottom: 25px;
}
.form-box .body,
.form-box .footer {
padding: 10px 20px;
background: #fff;
.login-logo a,
.register-logo a {
color: #444;
}
.form-box .body > .form-group,
.form-box .footer > .form-group {
margin-top: 20px;
.login-page,
.register-page {
background: #d2d6de;
}
.form-box .body > .form-group > input,
.form-box .footer > .form-group > input {
border: #fff;
}
.form-box .body > .btn,
.form-box .footer > .btn {
margin-bottom: 10px;
}
.form-box .footer {
border-top-left-radius: 0;
border-top-right-radius: 0;
border-bottom-right-radius: 4px;
border-bottom-left-radius: 4px;
.login-box,
.register-box {
width: 360px;
margin: 7% auto 0 auto;
}
@media (max-width: 768px) {
.form-box {
.login-box,
.register-box {
width: 90%;
margin-top: 20px;
}
}
.login-box-body,
.register-box-body {
background: #fff;
padding: 20px;
color: #444;
border-top: 0;
color: #666;
}
.login-box-body .form-control-feedback,
.register-box-body .form-control-feedback {
color: #777;
}
.login-box-msg,
.register-box-msg {
margin: 0;
text-align: center;
padding: 0 20px 20px 20px;
}
.social-auth-links {
margin: 10px 0;
}
/*
* Page: 400 and 500 error pages
* ------------------------------
@ -2900,42 +2909,6 @@ fieldset[disabled] .btn-bitbucket.active {
color: #205081;
background-color: #ffffff;
}
.btn-bitbucket:hover,
.btn-bitbucket:focus,
.btn-bitbucket:active,
.btn-bitbucket.active,
.open .dropdown-toggle.btn-bitbucket {
color: #ffffff;
background-color: #183c60;
border-color: rgba(0, 0, 0, 0.2);
}
.btn-bitbucket:active,
.btn-bitbucket.active,
.open .dropdown-toggle.btn-bitbucket {
background-image: none;
}
.btn-bitbucket.disabled,
.btn-bitbucket[disabled],
fieldset[disabled] .btn-bitbucket,
.btn-bitbucket.disabled:hover,
.btn-bitbucket[disabled]:hover,
fieldset[disabled] .btn-bitbucket:hover,
.btn-bitbucket.disabled:focus,
.btn-bitbucket[disabled]:focus,
fieldset[disabled] .btn-bitbucket:focus,
.btn-bitbucket.disabled:active,
.btn-bitbucket[disabled]:active,
fieldset[disabled] .btn-bitbucket:active,
.btn-bitbucket.disabled.active,
.btn-bitbucket[disabled].active,
fieldset[disabled] .btn-bitbucket.active {
background-color: #205081;
border-color: rgba(0, 0, 0, 0.2);
}
.btn-bitbucket .badge {
color: #205081;
background-color: #ffffff;
}
.btn-dropbox {
color: #ffffff;
background-color: #1087dd;
@ -2981,42 +2954,6 @@ fieldset[disabled] .btn-dropbox.active {
color: #1087dd;
background-color: #ffffff;
}
.btn-dropbox:hover,
.btn-dropbox:focus,
.btn-dropbox:active,
.btn-dropbox.active,
.open .dropdown-toggle.btn-dropbox {
color: #ffffff;
background-color: #0d70b7;
border-color: rgba(0, 0, 0, 0.2);
}
.btn-dropbox:active,
.btn-dropbox.active,
.open .dropdown-toggle.btn-dropbox {
background-image: none;
}
.btn-dropbox.disabled,
.btn-dropbox[disabled],
fieldset[disabled] .btn-dropbox,
.btn-dropbox.disabled:hover,
.btn-dropbox[disabled]:hover,
fieldset[disabled] .btn-dropbox:hover,
.btn-dropbox.disabled:focus,
.btn-dropbox[disabled]:focus,
fieldset[disabled] .btn-dropbox:focus,
.btn-dropbox.disabled:active,
.btn-dropbox[disabled]:active,
fieldset[disabled] .btn-dropbox:active,
.btn-dropbox.disabled.active,
.btn-dropbox[disabled].active,
fieldset[disabled] .btn-dropbox.active {
background-color: #1087dd;
border-color: rgba(0, 0, 0, 0.2);
}
.btn-dropbox .badge {
color: #1087dd;
background-color: #ffffff;
}
.btn-facebook {
color: #ffffff;
background-color: #3b5998;
@ -3062,42 +2999,6 @@ fieldset[disabled] .btn-facebook.active {
color: #3b5998;
background-color: #ffffff;
}
.btn-facebook:hover,
.btn-facebook:focus,
.btn-facebook:active,
.btn-facebook.active,
.open .dropdown-toggle.btn-facebook {
color: #ffffff;
background-color: #30487b;
border-color: rgba(0, 0, 0, 0.2);
}
.btn-facebook:active,
.btn-facebook.active,
.open .dropdown-toggle.btn-facebook {
background-image: none;
}
.btn-facebook.disabled,
.btn-facebook[disabled],
fieldset[disabled] .btn-facebook,
.btn-facebook.disabled:hover,
.btn-facebook[disabled]:hover,
fieldset[disabled] .btn-facebook:hover,
.btn-facebook.disabled:focus,
.btn-facebook[disabled]:focus,
fieldset[disabled] .btn-facebook:focus,
.btn-facebook.disabled:active,
.btn-facebook[disabled]:active,
fieldset[disabled] .btn-facebook:active,
.btn-facebook.disabled.active,
.btn-facebook[disabled].active,
fieldset[disabled] .btn-facebook.active {
background-color: #3b5998;
border-color: rgba(0, 0, 0, 0.2);
}
.btn-facebook .badge {
color: #3b5998;
background-color: #ffffff;
}
.btn-flickr {
color: #ffffff;
background-color: #ff0084;
@ -3143,42 +3044,6 @@ fieldset[disabled] .btn-flickr.active {
color: #ff0084;
background-color: #ffffff;
}
.btn-flickr:hover,
.btn-flickr:focus,
.btn-flickr:active,
.btn-flickr.active,
.open .dropdown-toggle.btn-flickr {
color: #ffffff;
background-color: #d6006f;
border-color: rgba(0, 0, 0, 0.2);
}
.btn-flickr:active,
.btn-flickr.active,
.open .dropdown-toggle.btn-flickr {
background-image: none;
}
.btn-flickr.disabled,
.btn-flickr[disabled],
fieldset[disabled] .btn-flickr,
.btn-flickr.disabled:hover,
.btn-flickr[disabled]:hover,
fieldset[disabled] .btn-flickr:hover,
.btn-flickr.disabled:focus,
.btn-flickr[disabled]:focus,
fieldset[disabled] .btn-flickr:focus,
.btn-flickr.disabled:active,
.btn-flickr[disabled]:active,
fieldset[disabled] .btn-flickr:active,
.btn-flickr.disabled.active,
.btn-flickr[disabled].active,
fieldset[disabled] .btn-flickr.active {
background-color: #ff0084;
border-color: rgba(0, 0, 0, 0.2);
}
.btn-flickr .badge {
color: #ff0084;
background-color: #ffffff;
}
.btn-foursquare {
color: #ffffff;
background-color: #0072b1;
@ -3224,42 +3089,6 @@ fieldset[disabled] .btn-foursquare.active {
color: #0072b1;
background-color: #ffffff;
}
.btn-foursquare:hover,
.btn-foursquare:focus,
.btn-foursquare:active,
.btn-foursquare.active,
.open .dropdown-toggle.btn-foursquare {
color: #ffffff;
background-color: #005888;
border-color: rgba(0, 0, 0, 0.2);
}
.btn-foursquare:active,
.btn-foursquare.active,
.open .dropdown-toggle.btn-foursquare {
background-image: none;
}
.btn-foursquare.disabled,
.btn-foursquare[disabled],
fieldset[disabled] .btn-foursquare,
.btn-foursquare.disabled:hover,
.btn-foursquare[disabled]:hover,
fieldset[disabled] .btn-foursquare:hover,
.btn-foursquare.disabled:focus,
.btn-foursquare[disabled]:focus,
fieldset[disabled] .btn-foursquare:focus,
.btn-foursquare.disabled:active,
.btn-foursquare[disabled]:active,
fieldset[disabled] .btn-foursquare:active,
.btn-foursquare.disabled.active,
.btn-foursquare[disabled].active,
fieldset[disabled] .btn-foursquare.active {
background-color: #0072b1;
border-color: rgba(0, 0, 0, 0.2);
}
.btn-foursquare .badge {
color: #0072b1;
background-color: #ffffff;
}
.btn-github {
color: #ffffff;
background-color: #444444;
@ -3305,42 +3134,6 @@ fieldset[disabled] .btn-github.active {
color: #444444;
background-color: #ffffff;
}
.btn-github:hover,
.btn-github:focus,
.btn-github:active,
.btn-github.active,
.open .dropdown-toggle.btn-github {
color: #ffffff;
background-color: #303030;
border-color: rgba(0, 0, 0, 0.2);
}
.btn-github:active,
.btn-github.active,
.open .dropdown-toggle.btn-github {
background-image: none;
}
.btn-github.disabled,
.btn-github[disabled],
fieldset[disabled] .btn-github,
.btn-github.disabled:hover,
.btn-github[disabled]:hover,
fieldset[disabled] .btn-github:hover,
.btn-github.disabled:focus,
.btn-github[disabled]:focus,
fieldset[disabled] .btn-github:focus,
.btn-github.disabled:active,
.btn-github[disabled]:active,
fieldset[disabled] .btn-github:active,
.btn-github.disabled.active,
.btn-github[disabled].active,
fieldset[disabled] .btn-github.active {
background-color: #444444;
border-color: rgba(0, 0, 0, 0.2);
}
.btn-github .badge {
color: #444444;
background-color: #ffffff;
}
.btn-google-plus {
color: #ffffff;
background-color: #dd4b39;
@ -3386,42 +3179,6 @@ fieldset[disabled] .btn-google-plus.active {
color: #dd4b39;
background-color: #ffffff;
}
.btn-google-plus:hover,
.btn-google-plus:focus,
.btn-google-plus:active,
.btn-google-plus.active,
.open .dropdown-toggle.btn-google-plus {
color: #ffffff;
background-color: #ca3523;
border-color: rgba(0, 0, 0, 0.2);
}
.btn-google-plus:active,
.btn-google-plus.active,
.open .dropdown-toggle.btn-google-plus {
background-image: none;
}
.btn-google-plus.disabled,
.btn-google-plus[disabled],
fieldset[disabled] .btn-google-plus,
.btn-google-plus.disabled:hover,
.btn-google-plus[disabled]:hover,
fieldset[disabled] .btn-google-plus:hover,
.btn-google-plus.disabled:focus,
.btn-google-plus[disabled]:focus,
fieldset[disabled] .btn-google-plus:focus,
.btn-google-plus.disabled:active,
.btn-google-plus[disabled]:active,
fieldset[disabled] .btn-google-plus:active,
.btn-google-plus.disabled.active,
.btn-google-plus[disabled].active,
fieldset[disabled] .btn-google-plus.active {
background-color: #dd4b39;
border-color: rgba(0, 0, 0, 0.2);
}
.btn-google-plus .badge {
color: #dd4b39;
background-color: #ffffff;
}
.btn-instagram {
color: #ffffff;
background-color: #3f729b;
@ -3467,42 +3224,6 @@ fieldset[disabled] .btn-instagram.active {
color: #3f729b;
background-color: #ffffff;
}
.btn-instagram:hover,
.btn-instagram:focus,
.btn-instagram:active,
.btn-instagram.active,
.open .dropdown-toggle.btn-instagram {
color: #ffffff;
background-color: #335d7e;
border-color: rgba(0, 0, 0, 0.2);
}
.btn-instagram:active,
.btn-instagram.active,
.open .dropdown-toggle.btn-instagram {
background-image: none;
}
.btn-instagram.disabled,
.btn-instagram[disabled],
fieldset[disabled] .btn-instagram,
.btn-instagram.disabled:hover,
.btn-instagram[disabled]:hover,
fieldset[disabled] .btn-instagram:hover,
.btn-instagram.disabled:focus,
.btn-instagram[disabled]:focus,
fieldset[disabled] .btn-instagram:focus,
.btn-instagram.disabled:active,
.btn-instagram[disabled]:active,
fieldset[disabled] .btn-instagram:active,
.btn-instagram.disabled.active,
.btn-instagram[disabled].active,
fieldset[disabled] .btn-instagram.active {
background-color: #3f729b;
border-color: rgba(0, 0, 0, 0.2);
}
.btn-instagram .badge {
color: #3f729b;
background-color: #ffffff;
}
.btn-linkedin {
color: #ffffff;
background-color: #007bb6;
@ -3548,42 +3269,6 @@ fieldset[disabled] .btn-linkedin.active {
color: #007bb6;
background-color: #ffffff;
}
.btn-linkedin:hover,
.btn-linkedin:focus,
.btn-linkedin:active,
.btn-linkedin.active,
.open .dropdown-toggle.btn-linkedin {
color: #ffffff;
background-color: #005f8d;
border-color: rgba(0, 0, 0, 0.2);
}
.btn-linkedin:active,
.btn-linkedin.active,
.open .dropdown-toggle.btn-linkedin {
background-image: none;
}
.btn-linkedin.disabled,
.btn-linkedin[disabled],
fieldset[disabled] .btn-linkedin,
.btn-linkedin.disabled:hover,
.btn-linkedin[disabled]:hover,
fieldset[disabled] .btn-linkedin:hover,
.btn-linkedin.disabled:focus,
.btn-linkedin[disabled]:focus,
fieldset[disabled] .btn-linkedin:focus,
.btn-linkedin.disabled:active,
.btn-linkedin[disabled]:active,
fieldset[disabled] .btn-linkedin:active,
.btn-linkedin.disabled.active,
.btn-linkedin[disabled].active,
fieldset[disabled] .btn-linkedin.active {
background-color: #007bb6;
border-color: rgba(0, 0, 0, 0.2);
}
.btn-linkedin .badge {
color: #007bb6;
background-color: #ffffff;
}
.btn-tumblr {
color: #ffffff;
background-color: #2c4762;
@ -3629,42 +3314,6 @@ fieldset[disabled] .btn-tumblr.active {
color: #2c4762;
background-color: #ffffff;
}
.btn-tumblr:hover,
.btn-tumblr:focus,
.btn-tumblr:active,
.btn-tumblr.active,
.open .dropdown-toggle.btn-tumblr {
color: #ffffff;
background-color: #1f3346;
border-color: rgba(0, 0, 0, 0.2);
}
.btn-tumblr:active,
.btn-tumblr.active,
.open .dropdown-toggle.btn-tumblr {
background-image: none;
}
.btn-tumblr.disabled,
.btn-tumblr[disabled],
fieldset[disabled] .btn-tumblr,
.btn-tumblr.disabled:hover,
.btn-tumblr[disabled]:hover,
fieldset[disabled] .btn-tumblr:hover,
.btn-tumblr.disabled:focus,
.btn-tumblr[disabled]:focus,
fieldset[disabled] .btn-tumblr:focus,
.btn-tumblr.disabled:active,
.btn-tumblr[disabled]:active,
fieldset[disabled] .btn-tumblr:active,
.btn-tumblr.disabled.active,
.btn-tumblr[disabled].active,
fieldset[disabled] .btn-tumblr.active {
background-color: #2c4762;
border-color: rgba(0, 0, 0, 0.2);
}
.btn-tumblr .badge {
color: #2c4762;
background-color: #ffffff;
}
.btn-twitter {
color: #ffffff;
background-color: #55acee;
@ -3710,42 +3359,6 @@ fieldset[disabled] .btn-twitter.active {
color: #55acee;
background-color: #ffffff;
}
.btn-twitter:hover,
.btn-twitter:focus,
.btn-twitter:active,
.btn-twitter.active,
.open .dropdown-toggle.btn-twitter {
color: #ffffff;
background-color: #309aea;
border-color: rgba(0, 0, 0, 0.2);
}
.btn-twitter:active,
.btn-twitter.active,
.open .dropdown-toggle.btn-twitter {
background-image: none;
}
.btn-twitter.disabled,
.btn-twitter[disabled],
fieldset[disabled] .btn-twitter,
.btn-twitter.disabled:hover,
.btn-twitter[disabled]:hover,
fieldset[disabled] .btn-twitter:hover,
.btn-twitter.disabled:focus,
.btn-twitter[disabled]:focus,
fieldset[disabled] .btn-twitter:focus,
.btn-twitter.disabled:active,
.btn-twitter[disabled]:active,
fieldset[disabled] .btn-twitter:active,
.btn-twitter.disabled.active,
.btn-twitter[disabled].active,
fieldset[disabled] .btn-twitter.active {
background-color: #55acee;
border-color: rgba(0, 0, 0, 0.2);
}
.btn-twitter .badge {
color: #55acee;
background-color: #ffffff;
}
.btn-vk {
color: #ffffff;
background-color: #587ea3;
@ -3791,42 +3404,6 @@ fieldset[disabled] .btn-vk.active {
color: #587ea3;
background-color: #ffffff;
}
.btn-vk:hover,
.btn-vk:focus,
.btn-vk:active,
.btn-vk.active,
.open .dropdown-toggle.btn-vk {
color: #ffffff;
background-color: #4a6a89;
border-color: rgba(0, 0, 0, 0.2);
}
.btn-vk:active,
.btn-vk.active,
.open .dropdown-toggle.btn-vk {
background-image: none;
}
.btn-vk.disabled,
.btn-vk[disabled],
fieldset[disabled] .btn-vk,
.btn-vk.disabled:hover,
.btn-vk[disabled]:hover,
fieldset[disabled] .btn-vk:hover,
.btn-vk.disabled:focus,
.btn-vk[disabled]:focus,
fieldset[disabled] .btn-vk:focus,
.btn-vk.disabled:active,
.btn-vk[disabled]:active,
fieldset[disabled] .btn-vk:active,
.btn-vk.disabled.active,
.btn-vk[disabled].active,
fieldset[disabled] .btn-vk.active {
background-color: #587ea3;
border-color: rgba(0, 0, 0, 0.2);
}
.btn-vk .badge {
color: #587ea3;
background-color: #ffffff;
}
/*
* Plugin: Full Calendar
* ---------------------

File diff suppressed because one or more lines are too long

View File

@ -859,7 +859,7 @@
<ul class="users-list clearfix">
<li>
<img src="dist/img/user1-128x128.jpg" alt="User Image"/>
<a class="users-list-name" href="#">Alex</a>
<a class="users-list-name" href="#">Alexander Pierce</a>
<span class="users-list-date">Today</span>
</li>
<li>

View File

@ -50,6 +50,10 @@
<div class='text-center'>
<a href="login.html">Or sign in as a different user</a>
</div>
<div class='lockscreen-footer text-center'>
Copyright &copy; 2014-2015 <b><a href="http://almsaeedstudio.com" class='text-black'>Almsaeed Studio</a></b><br>
All rights reserved
</div>
</div><!-- /.center -->
<script src="http://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

View File

@ -1,5 +1,5 @@
<!DOCTYPE html>
<html class="bg-black">
<html>
<head>
<meta charset="UTF-8">
<title>AdminLTE 2 | Log in</title>
@ -16,39 +16,47 @@
<script src="https://oss.maxcdn.com/libs/respond.js/1.3.0/respond.min.js"></script>
<![endif]-->
</head>
<body class="bg-black">
<div class="form-box" id="login-box">
<div class="header">Sign In</div>
<form action="../../index.html" method="post">
<div class="body bg-gray">
<div class="form-group">
<input type="text" name="userid" class="form-control" placeholder="User ID"/>
<body class="login-page">
<div class="login-box">
<div class="login-logo">
<a href="../../index2.html"><b>Admin</b>LTE</a>
</div><!-- /.login-logo -->
<div class="login-box-body">
<p class="login-box-msg">Sign in to start your session</p>
<form action="../../index2.html" method="post">
<div class="form-group has-feedback">
<input type="text" class="form-control" placeholder="Email"/>
<span class="glyphicon glyphicon-envelope form-control-feedback"></span>
</div>
<div class="form-group">
<input type="password" name="password" class="form-control" placeholder="Password"/>
<div class="form-group has-feedback">
<input type="password" class="form-control" placeholder="Password"/>
<span class="glyphicon glyphicon-lock form-control-feedback"></span>
</div>
<div class="form-group">
<input type="checkbox" name="remember_me"/> Remember me
<div class="row">
<div class="col-xs-8">
<div class="checkbox">
<label>
<input type="checkbox"> Remember Me
</label>
</div>
</div><!-- /.col -->
<div class="col-xs-4">
<button type="submit" class="btn btn-primary btn-block btn-flat">Sign In</button>
</div><!-- /.col -->
</div>
</div>
<div class="footer">
<button type="submit" class="btn bg-olive btn-block">Sign me in</button>
</form>
<p><a href="#">I forgot my password</a></p>
<div class="social-auth-links text-center">
<p>- or -</p>
<a href="#" class="btn btn-block btn-social btn-facebook btn-flat"><i class="fa fa-facebook"></i> Sign in using Facebook</a>
<a href="#" class="btn btn-block btn-social btn-google-plus btn-flat"><i class="fa fa-google-plus"></i> Sign in using Google+</a>
</div><!-- /.social-auth-links -->
<a href="register.html" class="text-center">Register a new membership</a>
</div>
</form>
<div class="margin text-center">
<span>Sign in using social networks</span>
<br/>
<button class="btn bg-light-blue btn-circle"><i class="fa fa-facebook"></i></button>
<button class="btn bg-aqua btn-circle"><i class="fa fa-twitter"></i></button>
<button class="btn bg-red btn-circle"><i class="fa fa-google-plus"></i></button>
</div>
</div>
<a href="#">I forgot my password</a><br>
<a href="register.html" class="text-center">Register a new membership</a>
</div><!-- /.login-box-body -->
</div><!-- /.login-box -->
<script src="http://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/js/bootstrap.min.js" type="text/javascript"></script>

View File

@ -1,5 +1,5 @@
<!DOCTYPE html>
<html class="bg-black">
<html>
<head>
<meta charset="UTF-8">
<title>AdminLTE 2 | Registration Page</title>
@ -16,37 +16,54 @@
<script src="https://oss.maxcdn.com/libs/respond.js/1.3.0/respond.min.js"></script>
<![endif]-->
</head>
<body class="bg-black">
<div class="form-box" id="login-box">
<div class="header">Register New Membership</div>
<form action="../../index.html" method="post">
<div class="body bg-gray">
<div class="form-group">
<input type="text" name="name" class="form-control" placeholder="Full name"/>
</div>
<div class="form-group">
<input type="text" name="userid" class="form-control" placeholder="User ID"/>
</div>
<div class="form-group">
<input type="password" name="password" class="form-control" placeholder="Password"/>
</div>
<div class="form-group">
<input type="password" name="password2" class="form-control" placeholder="Retype password"/>
</div>
</div>
<div class="footer">
<button type="submit" class="btn bg-olive btn-block">Sign me up</button>
<a href="login.html" class="text-center">I already have a membership</a>
</div>
</form>
<div class="margin text-center">
<span>Register using social networks</span>
<br/>
<button class="btn bg-light-blue btn-circle"><i class="fa fa-facebook"></i></button>
<button class="btn bg-aqua btn-circle"><i class="fa fa-twitter"></i></button>
<button class="btn bg-red btn-circle"><i class="fa fa-google-plus"></i></button>
<body class="register-page">
<div class="register-box">
<div class="register-logo">
<a href="../../index2.html"><b>Admin</b>LTE</a>
</div>
</div><!-- /.form-box -->
<div class="register-box-body">
<p class="login-box-msg">Register a new membership</p>
<form action="../../index.html" method="post">
<div class="form-group has-feedback">
<input type="text" class="form-control" placeholder="Full name"/>
<span class="glyphicon glyphicon-user form-control-feedback"></span>
</div>
<div class="form-group has-feedback">
<input type="text" class="form-control" placeholder="Email"/>
<span class="glyphicon glyphicon-envelope form-control-feedback"></span>
</div>
<div class="form-group has-feedback">
<input type="password" class="form-control" placeholder="Password"/>
<span class="glyphicon glyphicon-lock form-control-feedback"></span>
</div>
<div class="form-group has-feedback">
<input type="password" class="form-control" placeholder="Retype password"/>
<span class="glyphicon glyphicon-refresh form-control-feedback"></span>
</div>
<div class="row">
<div class="col-xs-8">
<div class="checkbox">
<label>
<input type="checkbox"> I agree to the <a href="#">terms</a>
</label>
</div>
</div><!-- /.col -->
<div class="col-xs-4">
<button type="submit" class="btn btn-primary btn-block btn-flat">Register</button>
</div><!-- /.col -->
</div>
</form>
<div class="social-auth-links text-center">
<p>- OR -</p>
<a href="#" class="btn btn-block btn-social btn-facebook btn-flat"><i class="fa fa-facebook"></i> Sign up using Facebook</a>
<a href="#" class="btn btn-block btn-social btn-google-plus btn-flat"><i class="fa fa-google-plus"></i> Sign up using Google+</a>
</div>
<a href="login.html" class="text-center">I already have a membership</a>
</div><!-- /.form-box -->
</div><!-- /.register-box -->
<script src="http://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/js/bootstrap.min.js" type="text/javascript"></script>