diff options
Diffstat (limited to 'src/styles/auth.scss')
-rw-r--r-- | src/styles/auth.scss | 67 |
1 files changed, 45 insertions, 22 deletions
diff --git a/src/styles/auth.scss b/src/styles/auth.scss index 53c03a40a..448b8c2b3 100644 --- a/src/styles/auth.scss +++ b/src/styles/auth.scss | |||
@@ -5,18 +5,20 @@ | |||
5 | 5 | ||
6 | .auth__container { | 6 | .auth__container { |
7 | background: $dark-theme-gray-darker; | 7 | background: $dark-theme-gray-darker; |
8 | box-shadow: 0 0 50px rgba($dark-theme-black, .2); | 8 | box-shadow: 0 0 50px rgba($dark-theme-black, 0.2); |
9 | } | 9 | } |
10 | 10 | ||
11 | .auth__logo.auth__logo--sm { | 11 | .auth__logo.auth__logo--sm { |
12 | border: none; | 12 | border: none; |
13 | box-shadow: 0 0 6px rgba($dark-theme-black, .5); | 13 | box-shadow: 0 0 6px rgba($dark-theme-black, 0.5); |
14 | } | 14 | } |
15 | 15 | ||
16 | .auth__links { | 16 | .auth__links { |
17 | background: $dark-theme-gray-dark; | 17 | background: $dark-theme-gray-dark; |
18 | 18 | ||
19 | a { color: $dark-theme-text-color; } | 19 | a { |
20 | color: $dark-theme-text-color; | ||
21 | } | ||
20 | } | 22 | } |
21 | 23 | ||
22 | .welcome__featured-services { | 24 | .welcome__featured-services { |
@@ -26,7 +28,9 @@ | |||
26 | .legal { | 28 | .legal { |
27 | color: $dark-theme-text-color; | 29 | color: $dark-theme-text-color; |
28 | 30 | ||
29 | a { color: $dark-theme-gray-lightest; } | 31 | a { |
32 | color: $dark-theme-gray-lightest; | ||
33 | } | ||
30 | } | 34 | } |
31 | 35 | ||
32 | .locked__or_line { | 36 | .locked__or_line { |
@@ -53,14 +57,16 @@ | |||
53 | } | 57 | } |
54 | 58 | ||
55 | .auth__container { | 59 | .auth__container { |
56 | background: #FFF; | 60 | background: #fff; |
57 | border-radius: $theme-border-radius; | 61 | border-radius: $theme-border-radius; |
58 | height: auto; | 62 | height: auto; |
59 | margin: 40px auto 0; | 63 | margin: 40px auto 0; |
60 | position: relative; | 64 | position: relative; |
61 | width: 350px; | 65 | width: 350px; |
62 | 66 | ||
63 | &.auth__container--signup { width: 450px; } | 67 | &.auth__container--signup { |
68 | width: 450px; | ||
69 | } | ||
64 | 70 | ||
65 | &.auth__container--releasenotes { | 71 | &.auth__container--releasenotes { |
66 | width: 90%; | 72 | width: 90%; |
@@ -77,16 +83,18 @@ | |||
77 | width: 150px; | 83 | width: 150px; |
78 | 84 | ||
79 | &.auth__logo--sm { | 85 | &.auth__logo--sm { |
80 | border: 4px solid #FFF; | 86 | border: 4px solid #fff; |
81 | border-radius: 100%; | 87 | border-radius: 100%; |
82 | box-shadow: 0 0 6px rgba(black, .5); | 88 | box-shadow: 0 0 6px rgba(black, 0.5); |
83 | } | 89 | } |
84 | } | 90 | } |
85 | 91 | ||
86 | .auth__form { | 92 | .auth__form { |
87 | padding: 20px; | 93 | padding: 20px; |
88 | 94 | ||
89 | h1 { text-align: center; } | 95 | h1 { |
96 | text-align: center; | ||
97 | } | ||
90 | } | 98 | } |
91 | 99 | ||
92 | .auth__button { | 100 | .auth__button { |
@@ -138,11 +146,11 @@ | |||
138 | margin-bottom: 20px; | 146 | margin-bottom: 20px; |
139 | 147 | ||
140 | &:after { | 148 | &:after { |
141 | background: #FFF; | 149 | background: #fff; |
142 | content: 'or'; | 150 | content: 'or'; |
143 | padding: 0 10px; | 151 | padding: 0 10px; |
144 | position: relative; | 152 | position: relative; |
145 | top: -9px; | 153 | top: -9px; |
146 | } | 154 | } |
147 | } | 155 | } |
148 | 156 | ||
@@ -158,7 +166,9 @@ | |||
158 | margin-bottom: 8px; | 166 | margin-bottom: 8px; |
159 | text-align: center; | 167 | text-align: center; |
160 | 168 | ||
161 | &:last-of-type { margin-bottom: 0; } | 169 | &:last-of-type { |
170 | margin-bottom: 0; | ||
171 | } | ||
162 | } | 172 | } |
163 | } | 173 | } |
164 | 174 | ||
@@ -175,24 +185,37 @@ | |||
175 | position: absolute; | 185 | position: absolute; |
176 | right: 25px; | 186 | right: 25px; |
177 | 187 | ||
178 | img { width: 65px; } | 188 | img { |
189 | width: 65px; | ||
190 | } | ||
179 | } | 191 | } |
180 | 192 | ||
181 | .auth__letter { margin-bottom: 30px; text-align: left; } | 193 | .auth__letter { |
182 | .scroll-container { z-index: 10; } | 194 | margin-bottom: 30px; |
183 | .info-bar { position: absolute; } | 195 | text-align: left; |
196 | } | ||
197 | .scroll-container { | ||
198 | z-index: 10; | ||
199 | } | ||
200 | .info-bar { | ||
201 | position: absolute; | ||
202 | } | ||
184 | 203 | ||
185 | &__scroll-container { | 204 | &__scroll-container { |
186 | width: 100%; | 205 | width: 100%; |
187 | height: fit-content; | 206 | height: fit-content; |
188 | } | 207 | } |
189 | 208 | ||
190 | .available-services { margin-bottom: 15px; } | 209 | .available-services { |
210 | margin-bottom: 15px; | ||
211 | } | ||
191 | 212 | ||
192 | .unavailable-services { | 213 | .unavailable-services { |
193 | margin: 15px 0; | 214 | margin: 15px 0; |
194 | 215 | ||
195 | p { text-transform: capitalize; } | 216 | p { |
217 | text-transform: capitalize; | ||
218 | } | ||
196 | } | 219 | } |
197 | 220 | ||
198 | .legal { | 221 | .legal { |
@@ -220,7 +243,7 @@ | |||
220 | height: fit-content; | 243 | height: fit-content; |
221 | 244 | ||
222 | &-item__secondary { | 245 | &-item__secondary { |
223 | padding-left: 5px | 246 | padding-left: 5px; |
224 | } | 247 | } |
225 | } | 248 | } |
226 | 249 | ||