diff options
Diffstat (limited to 'client/src')
-rw-r--r-- | client/src/app/+error-page/error-page.component.html | 2 | ||||
-rw-r--r-- | client/src/app/+error-page/error-page.component.scss | 23 |
2 files changed, 7 insertions, 18 deletions
diff --git a/client/src/app/+error-page/error-page.component.html b/client/src/app/+error-page/error-page.component.html index b8b9296a3..6a1675f90 100644 --- a/client/src/app/+error-page/error-page.component.html +++ b/client/src/app/+error-page/error-page.component.html | |||
@@ -54,5 +54,5 @@ | |||
54 | <div class="muted" i18n="This is about Sepia's tea">Sepia seems to like it.</div> | 54 | <div class="muted" i18n="This is about Sepia's tea">Sepia seems to like it.</div> |
55 | </div> | 55 | </div> |
56 | 56 | ||
57 | <img src='/client/assets/images/mascot/{{ getMascotName() }}.svg' alt='{{ status }} mascot' class="mb-4"> | 57 | <img src='/client/assets/images/mascot/{{ getMascotName() }}.svg' alt='{{ status }} mascot' class="mb-4 h-auto"> |
58 | </div> | 58 | </div> |
diff --git a/client/src/app/+error-page/error-page.component.scss b/client/src/app/+error-page/error-page.component.scss index 4e12e8c78..5193c2871 100644 --- a/client/src/app/+error-page/error-page.component.scss +++ b/client/src/app/+error-page/error-page.component.scss | |||
@@ -4,25 +4,26 @@ | |||
4 | .root { | 4 | .root { |
5 | @include margin-left(auto); | 5 | @include margin-left(auto); |
6 | @include margin-right(auto); | 6 | @include margin-right(auto); |
7 | @include padding-top(9rem); | ||
8 | @include rfs(45rem, width); | ||
7 | 9 | ||
8 | height: 100%; | 10 | height: 100%; |
9 | text-align: center; | 11 | text-align: center; |
10 | padding-top: 150px; | ||
11 | display: flex; | 12 | display: flex; |
12 | justify-content: center; | 13 | justify-content: center; |
13 | flex-direction: column-reverse; | 14 | flex-direction: column-reverse; |
14 | 15 | ||
16 | |||
15 | .box { | 17 | .box { |
18 | @include font-size(1.20rem); | ||
19 | |||
16 | text-align: start; | 20 | text-align: start; |
17 | font-size: 120%; | ||
18 | padding: 0 15px; | 21 | padding: 0 15px; |
19 | } | 22 | } |
20 | 23 | ||
21 | img { | 24 | img { |
22 | @include margin-left(auto); | 25 | @include margin-left(auto); |
23 | 26 | @include rfs(14rem, width); | |
24 | width: 220px; | ||
25 | height: auto; | ||
26 | } | 27 | } |
27 | 28 | ||
28 | @media screen and (max-width: $mobile-view) { | 29 | @media screen and (max-width: $mobile-view) { |
@@ -30,16 +31,4 @@ | |||
30 | @include margin-right(auto); | 31 | @include margin-right(auto); |
31 | } | 32 | } |
32 | } | 33 | } |
33 | |||
34 | @media screen and (min-width: $mobile-view) { | ||
35 | width: 400px; | ||
36 | } | ||
37 | |||
38 | @media screen and (max-height: 600px) { | ||
39 | padding-top: 50px; | ||
40 | |||
41 | img { | ||
42 | width: 160px; | ||
43 | } | ||
44 | } | ||
45 | } | 34 | } |