aboutsummaryrefslogtreecommitdiffhomepage
path: root/client
diff options
context:
space:
mode:
authorWicklow <wicklow@framasoft.org>2023-02-16 12:36:36 +0100
committerChocobozzz <chocobozzz@cpy.re>2023-02-20 13:52:22 +0100
commit422a11e2a4e52ec8a052a9646e1677cf284931a2 (patch)
tree7caf3ed66f240fa3ec93efa8c62008c233ce9ff0 /client
parent389eb1312929a946b16dfcdd02d646902425a494 (diff)
downloadPeerTube-422a11e2a4e52ec8a052a9646e1677cf284931a2.tar.gz
PeerTube-422a11e2a4e52ec8a052a9646e1677cf284931a2.tar.zst
PeerTube-422a11e2a4e52ec8a052a9646e1677cf284931a2.zip
Refactoring error page component style
Diffstat (limited to 'client')
-rw-r--r--client/src/app/+error-page/error-page.component.html2
-rw-r--r--client/src/app/+error-page/error-page.component.scss23
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}