ensl.org/app/assets/stylesheets/layout/_header.scss
2014-05-04 00:01:36 +01:00

159 lines
2.5 KiB
SCSS

/*
Banner
*/
header .banner {
height: 125px;
#logo {
@include span-columns(7 of 12);
min-height: 180px;
position: relative;
img {
height: 180px;
position: absolute;
top: 30px;
left: -10px;
z-index: 1;
}
}
#authentication {
@include span-columns(5 of 12);
padding: 30px 0;
padding-top: 50px;
color: white;
line-height: 16px;
.fields {
input[type=text],
input[type=password] {
text-align: right;
margin-bottom: 3px;
}
}
.logged {
position: relative;
}
a {
color: #497588;
}
form {
display: inline;
}
&.admin {
}
.fields {
@include span-columns(12);
input {
@include span-columns(6);
margin-bottom: 10px;
}
}
.controls {
margin-top: 10px;
text-align: right;
input {
@include span-columns(12);
margin-bottom: 10px;
}
a {
@include span-columns(12);
text-align: left;
}
}
.password-reset {
float: right;
}
.links {
float: right;
position: relative;
padding-right: 80px;
li {
text-align: right;
}
li i {
display: inline-block;
width: 1em;
text-align: center;
margin: 0 5px;
}
}
.avatar {
box-shadow: $content-shadow;
border-radius: $base-border-radius;
border: 1px solid #61beff;
text-align: center;
vertical-align: middle;
position: relative;
float: left;
height: 0;
background-size: cover;
position: absolute;
right: 0;
top: 0;
background-position: center;
background-repeat: no-repeat;
height: 75px;
width: 75px;
}
.buttons {
@include span-columns(12);
font-family: $header-font-family;
text-align: right;
text-transform: uppercase;
font-size: 12px;
.login,
.register {
@include span-columns(6);
}
.login input {
background: none;
border: 0;
font-family: $header-font-family;
color: #73d5f7;
font-size: 14px;
padding: 0;
text-transform: uppercase;
}
.register a {
float: right;
display: block;
clear: both;
}
}
}
&.authenticated {
#logo {
@include span-columns(9 of 12);
}
#authentication {
@include span-columns(3 of 12);
padding: 30px 0;
}
}
}