2018-07-13 13:24:58 +00:00
|
|
|
// smoke effect
|
|
|
|
@if $icedream-fog-bg {
|
|
|
|
#main {
|
|
|
|
position: relative;
|
2018-07-13 13:54:11 +00:00
|
|
|
min-width: 100%;
|
|
|
|
max-width: 100%;
|
|
|
|
width: 100%;
|
|
|
|
overflow-x: hidden;
|
2018-07-13 13:24:58 +00:00
|
|
|
|
|
|
|
&::before {
|
|
|
|
opacity: .2;
|
2018-07-13 13:54:11 +00:00
|
|
|
background-image: url('../images/whitefog.png');
|
2018-07-13 13:24:58 +00:00
|
|
|
background-attachment: fixed;
|
|
|
|
content: ' '; // sass-lint:disable-line variable-for-property
|
|
|
|
position: absolute;
|
|
|
|
left: 0;
|
|
|
|
top: 0;
|
|
|
|
height: 100%;
|
2018-07-13 13:54:11 +00:00
|
|
|
min-width: 100%;
|
|
|
|
|
2018-07-15 22:42:34 +00:00
|
|
|
@if $icedream-fog-bg-blur {
|
|
|
|
filter: blur(16px);
|
|
|
|
}
|
|
|
|
|
2018-07-13 13:24:58 +00:00
|
|
|
@if not($icedream-fog-bg-animated) {
|
2018-07-13 13:54:11 +00:00
|
|
|
background-size: 200% 100%;
|
2018-07-13 13:24:58 +00:00
|
|
|
}
|
|
|
|
|
|
|
|
// animate it so it moves right to left slowly?
|
|
|
|
@if $icedream-fog-bg-animated {
|
|
|
|
background-repeat: repeat-x;
|
|
|
|
background-size: 100% 100%;
|
|
|
|
animation: icedream-bg-slide linear $icedream-fog-bg-animation-length infinite;
|
2018-07-13 13:54:11 +00:00
|
|
|
transform: scale(2, 1) translateX(0);
|
|
|
|
transform-origin: left;
|
2018-07-13 13:24:58 +00:00
|
|
|
@keyframes icedream-bg-slide {
|
|
|
|
to {
|
2018-07-13 13:54:11 +00:00
|
|
|
transform: scale(2, 1) translateX(-50%);
|
2018-07-13 13:24:58 +00:00
|
|
|
}
|
|
|
|
}
|
|
|
|
}
|
|
|
|
}
|
|
|
|
}
|
|
|
|
}
|