Last active
January 20, 2016 12:56
-
-
Save dingo-d/1538213417d3a9b4cacd to your computer and use it in GitHub Desktop.
Unfinished .css file for AJAX log in and register. Part of Header AJAX login/register gist (4)
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
/*------------------------ AJAX login -------------------------*/ | |
.top_bar{ | |
text-align: right; | |
} | |
.top_bar .ajax_login{ | |
display: inline-block; | |
margin-right: 10px; | |
} | |
.top_bar .ajax_login_overlay{ | |
position: fixed; | |
top: 0; | |
left: 0; | |
width: 100%; | |
height: 100%; | |
background: rgb(0,0,0); | |
background: rgba(0,0,0,0.5); | |
display: none; | |
cursor: default; | |
z-index: 101; | |
transform: translateZ(1px); | |
} | |
.top_bar .ajax_login form#login{ | |
display: none; | |
background-color: #FFFFFF; | |
position: fixed; | |
top: 50%; | |
margin-top: -117px; | |
z-index: 999; | |
left: 50%; | |
margin-left: -200px; | |
cursor: default; | |
} | |
.top_bar .ajax_login form#login h1{ | |
color: #656565; | |
background: #eee; | |
font-weight: 700; | |
text-transform: uppercase; | |
font-size: 15px; | |
padding: 2px 20px; | |
text-align: left; | |
} | |
.top_bar .ajax_login form#login p.status{ | |
display: none; | |
padding: 0 20px; | |
margin-bottom: 12px; | |
} | |
.top_bar .ajax_login form#login input#username, | |
.top_bar .ajax_login form#login input#password{ | |
margin: 10px 20px; | |
width: 400px; | |
display: block; | |
} | |
.top_bar .ajax_login form#login .forgotten_box{ | |
display: inline-block; | |
padding: 3px 20px 0 20px; | |
} | |
.top_bar .ajax_login form#login .forgotten_box .lost{ | |
display: block; | |
padding: 5px; | |
padding-left: 0; | |
margin-bottom: 0; | |
} | |
.top_bar .ajax_login form#login input.submit_button{ | |
padding: 15px; | |
border-radius: 4px; | |
font-weight: 700; | |
text-transform: uppercase; | |
margin-right: 20px; | |
float: right; | |
cursor: pointer; | |
-webkit-transition: all 180ms ease-in; | |
-moz-transition: all 180ms ease-in; | |
-o-transition: all 180ms ease-in; | |
transition: all 180ms ease-in; | |
} | |
.top_bar .ajax_login .login_overlay{ | |
height: 100%; | |
width: 100%; | |
background-color: #F6F6F6; | |
opacity: 0.9; | |
position: fixed; | |
z-index: 998; | |
} | |
.top_bar .ajax_login .login_button, | |
.top_bar .register a{ | |
display: inline-block; | |
color: #0c0f0b; | |
font-size: 12px; | |
font-weight: 700; | |
line-height: 30px; | |
} | |
.top_bar .ajax_login .login_button:hover{ | |
color: #d84949; | |
} | |
.top_bar .register{ | |
display: inline-block; | |
} | |
/*------------------------ AJAX register -------------------------*/ | |
.top_bar .register #register_form{ | |
display: none; | |
background-color: #FFFFFF; | |
position: fixed; | |
top: 50%; | |
margin-top: -117px; | |
z-index: 999; | |
left: 50%; | |
margin-left: -200px; | |
cursor: default; | |
} | |
.top_bar .register #register_form input[type="text"]{ | |
margin: 10px 20px; | |
width: 400px; | |
display: block; | |
background: #f2f2f2; | |
border: 0; | |
font-family: 'Roboto', sans-serif; | |
color: rgb(115, 115, 115); | |
color: rgba(115, 115, 115, 0.5); | |
font-size: 14px; | |
font-weight: 400; | |
line-height: 20px; | |
text-align: left; | |
font-style: italic; | |
} | |
.top_bar .register #register_form .register-heading{ | |
background: #be0017; | |
font-family: Arial; | |
color: #ffffff; | |
font-size: 16px; | |
line-height: 12px; | |
font-weight: 700; | |
letter-spacing: 0.64px; | |
text-align: left; | |
padding:15px 20px; | |
text-transform:uppercase; | |
} |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment