diff options
Diffstat (limited to 'src/styles/services.scss')
-rw-r--r-- | src/styles/services.scss | 29 |
1 files changed, 20 insertions, 9 deletions
diff --git a/src/styles/services.scss b/src/styles/services.scss index 359a41ab0..7ce6f8c87 100644 --- a/src/styles/services.scss +++ b/src/styles/services.scss | |||
@@ -3,7 +3,9 @@ | |||
3 | .theme__dark .services { | 3 | .theme__dark .services { |
4 | background: $dark-theme-gray-darkest; | 4 | background: $dark-theme-gray-darkest; |
5 | 5 | ||
6 | .services__webview-wrapper { background: $dark-theme-gray-darkest; } | 6 | .services__webview-wrapper { |
7 | background: $dark-theme-gray-darkest; | ||
8 | } | ||
7 | 9 | ||
8 | .services__webview, | 10 | .services__webview, |
9 | .services__info-layer { | 11 | .services__info-layer { |
@@ -14,7 +16,9 @@ | |||
14 | .services__info-layer { | 16 | .services__info-layer { |
15 | background: $dark-theme-gray-darkest; | 17 | background: $dark-theme-gray-darkest; |
16 | 18 | ||
17 | h1 { color: $dark-theme-gray-lightest; } | 19 | h1 { |
20 | color: $dark-theme-gray-lightest; | ||
21 | } | ||
18 | } | 22 | } |
19 | } | 23 | } |
20 | 24 | ||
@@ -31,21 +35,23 @@ | |||
31 | } | 35 | } |
32 | 36 | ||
33 | @for $i from $split-columns-min through $split-columns-max { | 37 | @for $i from $split-columns-min through $split-columns-max { |
34 | &[data-columns="#{$i}"] .services .services__webview { | 38 | &[data-columns='#{$i}'] .services .services__webview { |
35 | flex-basis: calc(100% / $i); | 39 | flex-basis: calc(100% / $i); |
36 | } | 40 | } |
37 | } | 41 | } |
38 | } | 42 | } |
39 | 43 | ||
40 | .services { | 44 | .services { |
41 | background: #FFF; | 45 | background: #fff; |
42 | flex: 1; | 46 | flex: 1; |
43 | height: 100%; | 47 | height: 100%; |
44 | order: 5; | 48 | order: 5; |
45 | overflow: hidden; | 49 | overflow: hidden; |
46 | position: relative; | 50 | position: relative; |
47 | 51 | ||
48 | .services__webview-wrapper { background: $theme-gray-lighter; } | 52 | .services__webview-wrapper { |
53 | background: $theme-gray-lighter; | ||
54 | } | ||
49 | 55 | ||
50 | .services__webview, | 56 | .services__webview, |
51 | .services__info-layer { | 57 | .services__info-layer { |
@@ -66,9 +72,13 @@ | |||
66 | z-index: 100; | 72 | z-index: 100; |
67 | } | 73 | } |
68 | 74 | ||
69 | &--force-repaint webview { z-index: 5; } | 75 | &--force-repaint webview { |
76 | z-index: 5; | ||
77 | } | ||
70 | 78 | ||
71 | &.is-loading webview { background: #FFF } | 79 | &.is-loading webview { |
80 | background: #fff; | ||
81 | } | ||
72 | } | 82 | } |
73 | 83 | ||
74 | .services__no-service, | 84 | .services__no-service, |
@@ -86,12 +96,13 @@ | |||
86 | } | 96 | } |
87 | 97 | ||
88 | .button, | 98 | .button, |
89 | button { margin: 40px 0 20px; } | 99 | button { |
100 | margin: 40px 0 20px; | ||
101 | } | ||
90 | } | 102 | } |
91 | 103 | ||
92 | .services__info-layer { | 104 | .services__info-layer { |
93 | position: absolute; | 105 | position: absolute; |
94 | z-index: 110; | 106 | z-index: 110; |
95 | } | 107 | } |
96 | |||
97 | } | 108 | } |