app/assets/stylesheets/_style.scss
/* common layout */
html {
position: relative;
min-height: 100%;
}
body {
margin-bottom: $height-footer;
background-color: $brand-bg;
}
.header-staff {
color: $brand-bg;
background-color: $brand-primary;
height: $height-header;
margin-bottom: 40px;
.container {
position: relative;
height: 100%;
}
h1 {
font-family: Inconsolata;
font-size: $font-size-large * 3;
margin: 30px 0;
.link-actopus {
text-decoration: none;
color: $brand-bg;
}
}
}
/* footer */
footer{
font-family: Inconsolata;
text-align: center;
width: 100%;
height: $height-footer;
position:absolute;
bottom: 0;
color: $alpha-text;
background-color: $brand-primary;
padding: 10px;
a {
border-bottom: 1px dotted;
&:link,
&:visited {
text-decoration: none;
color: $alpha-link;
}
&:hover,
&:active {
border-bottom: solid 1px $alpha-link;
}
}
}
.content {
margin-bottom: 20px;
}
.header-sub {
margin-bottom: 30px;
}
/* lecturers */
.table-lecturer {
.lecturer-department {
font-size: $font-size-large;
border-top: none;
&:first-letter {
color: $brand-primary;
}
}
.lecturer-name {
vertical-align: middle;
font-size: $font-size-large;
}
}
.list-table {
display: table;
table-layout: fixed;
width: 100%;
> li {
$list-table-height: 48px;
display: table-cell;
height: $list-table-height;
text-align: center;
border: 1px solid $list-border-fg;
border-left-style: none;
&:first-child {
border-left-style: solid;
@include border-left-radius($list-group-border-radius);
}
&:last-child {
@include border-right-radius($list-group-border-radius);
}
&:hover { background-color: $list-bg-hover; }
> a {
color: $list-link-fg;
display: block;
text-decoration: none;
height: 100%;
line-height: $list-table-height;
}
}
}
/* sign_in */
.form-input {
max-width: 330px;
padding: 15px;
margin: 0 auto;
.form-signin-heading, .checkbox {
margin-bottom: 10px;
}
.form-control {
@include box-sizing(border-box);
position: relative;
height: auto;
padding: 10px;
font-size: 16px;
&:focus {
z-index: 2;
}
}
.remember-checkbox {
margin-bottom: 10px;
}
.field {
input {
border-radius: 0;
}
&:first-of-type {
input {
@include border-top-radius(4px);
margin-bottom: -1px;
}
}
&:nth-of-type(2) {
input {
@include border-bottom-radius(4px);
margin-bottom: 10px;
}
}
}
}
/* staffs */
.form-staff-new {
margin-bottom: 10px;
.field-staff-new {
@include border-right-radius(0);
}
.btn-staff-new {
@include border-left-radius(0);
margin-left: -3px;
}
}
.rescheduling-buttons {
margin-left: 40px;
a { margin-left: 20px; }
}
.pagination-timetable {
.btn { margin: 20px 5px; }
}
/* landing-page */
.header-landing {
color: $brand-bg;
background-color: $brand-primary;
@include size(100%, 330px);
.container {
position: relative;
height: 100%;
}
h1 {
font-family: Inconsolata;
font-size: $font-size-large * 5;
margin: 40px 0;
}
p {
a {
border-bottom: 1px dotted;
&:link,
&:visited {
text-decoration: none;
color: $brand-bg;
}
&:hover,
&:active {
border-bottom: solid 1px $brand-bg;
}
}
}
.header-buttons {
a {
color: $brand-bg;
span {
margin-left: 10px;
i:nth-child(2) { color: $brand-primary; }
}
}
}
.fa-circle { color: $brand-bg; }
}
.content-landing {
margin: 60px 0;
}
.box-landing {
text-align: center;
color: $gray;
border-radius: 12px;
display: block;
@include size(100%, 300px);
line-height: 24px;
margin: 0px 1% 16px;
padding: 60px 40px;
.box-logo {
font-size: $font-size-large * 3;
color: $brand-primary;
}
p { margin-top: 40px; }
a {
color: $brand-primary;
border-bottom: 1px dotted;
text-decoration: none;
&:link,
&:visited {
text-decoration: none;
}
&:hover,
&:active {
border-bottom: solid 1px $brand-primary;
}
}
}
/* unsignedin_user */
.header {
@extend .header-landing;
@include size(100%, 200px);
min-height: 200px;
margin-bottom: 30px;
h1 {
font-size: $font-size-large * 4;
float: left;
a {
color: $brand-bg;
text-decoration: none;
}
}
.header-buttons {
margin-top: 40px;
float: right;
}
}
.home-button {
text-align: center;
margin-bottom: 20px;
}