source: main/waeup-hugo/public/sass/layout/_bg.scss @ 17397

Last change on this file since 17397 was 14926, checked in by Henrik Bettermann, 7 years ago
File size: 1.7 KB
Line 
1///
2/// Dimension by HTML5 UP
3/// html5up.net | @ajlkn
4/// Free for personal and commercial use under the CCA 3.0 license (html5up.net/license)
5///
6
7/* BG */
8
9  #bg {
10    @include vendor('transform', 'scale(1.0)');
11    -webkit-backface-visibility: hidden;
12    position: fixed;
13    top: 0;
14    left: 0;
15    width: 100%;
16    height: 100vh;
17    z-index: 1;
18
19    &:before, &:after {
20      content: '';
21      display: block;
22      position: absolute;
23      top: 0;
24      left: 0;
25      width: 100%;
26      height: 100%;
27    }
28
29    &:before {
30      @include vendor('transition', 'background-color #{_duration(bg)} ease-in-out');
31      @include vendor('transition-delay', '#{_duration(intro)}');
32      background-image:   linear-gradient(to top, #{_palette(bg-overlay)}, #{_palette(bg-overlay)}),
33                  url('/images/overlay.png');
34      background-size:    auto,
35                  256px 256px;
36      background-position:  center,
37                  center;
38      background-repeat:    no-repeat,
39                  repeat;
40      z-index: 2;
41    }
42
43    &:after {
44      @include vendor('transform', 'scale(1.125)');
45      @include vendor('transition', (
46        'transform #{_duration(article)} ease-in-out',
47        'filter #{_duration(article)} ease-in-out'
48      ));
49      background-image:   url('/images/bg.jpg');
50      background-position:  center;
51      background-size:    cover;
52      background-repeat:    no-repeat;
53      z-index: 1;
54    }
55
56    body.is-article-visible & {
57      &:after {
58        @include vendor('transform', 'scale(1.0825)');
59        @include vendor('filter', 'blur(0.2rem)');
60      }
61    }
62
63    body.is-loading & {
64      &:before {
65        background-color: _palette(bg-alt);
66      }
67    }
68  }
Note: See TracBrowser for help on using the repository browser.