lychee/assets/scss/loading.scss
2014-08-26 16:47:12 +02:00

45 lines
1.1 KiB
SCSS

/**
* @name loading.css
* @author Tobias Reich
* @copyright 2014 by Tobias Reich
*/
#loading {
position: fixed;
width: 100%;
height: 3px;
background-size: 100px 3px;
background-repeat: repeat-x;
border-bottom: 1px solid rgba(0,0,0,.3);
display: none;
animation-name: moveBackground;
animation-duration: .3s;
animation-iteration-count: infinite;
animation-timing-function: linear;
}
/* Modes ------------------------------------------------*/
#loading.loading {
background-image: linear-gradient(to right, #153674 0%, #153674 47%, #2651AE 53%, #2651AE 100%);
z-index: 2;
}
#loading.error {
background-color: #2f0d0e;
background-image: linear-gradient(to right, #451317 0%, #451317 47%, #AA3039 53%, #AA3039 100%);
z-index: 1;
}
/* Content ------------------------------------------------*/
#loading h1 {
margin: 13px 13px 0px 13px;
color: #ddd;
font-size: 14px;
font-weight: bold;
text-shadow: 0px 1px 0px #000;
text-transform: capitalize;
}
#loading h1 span {
margin-left: 10px;
font-weight: normal;
text-transform: none;
}