interesting
/
PeerTube
mirror of https://github.com/Chocobozzz/PeerTube.git
1
0
Fork 0
Code Issues Projects Releases Wiki Activity

Refactoring error page component style

This commit is contained in:
Wicklow 2023-02-16 12:36:36 +01:00 committed by Chocobozzz
parent 389eb13129
commit 422a11e2a4
2 changed files with 7 additions and 18 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
client/src/app/+error-page/error-page.component.html
View File

@ -54,5 +54,5 @@
<div class="muted" i18n="This is about Sepia's tea">Sepia seems to like it.</div> <div class="muted" i18n="This is about Sepia's tea">Sepia seems to like it.</div>
</div> </div>
<img src='/client/assets/images/mascot/{{ getMascotName() }}.svg' alt='{{ status }} mascot' class="mb-4"> <img src='/client/assets/images/mascot/{{ getMascotName() }}.svg' alt='{{ status }} mascot' class="mb-4 h-auto">
</div> </div>

23
client/src/app/+error-page/error-page.component.scss
View File

@ -4,25 +4,26 @@
.root { .root {
@include margin-left(auto); @include margin-left(auto);
@include margin-right(auto); @include margin-right(auto);
@include padding-top(9rem);
@include rfs(45rem, width);
height: 100%; height: 100%;
text-align: center; text-align: center;
padding-top: 150px;
display: flex; display: flex;
justify-content: center; justify-content: center;
flex-direction: column-reverse; flex-direction: column-reverse;
.box { .box {
@include font-size(1.20rem);
text-align: start; text-align: start;
font-size: 120%;
padding: 0 15px; padding: 0 15px;
} }
img { img {
@include margin-left(auto); @include margin-left(auto);
@include rfs(14rem, width);
width: 220px;
height: auto;
} }
@media screen and (max-width: $mobile-view) { @media screen and (max-width: $mobile-view) {
@ -30,16 +31,4 @@
@include margin-right(auto); @include margin-right(auto);
} }
} }
@media screen and (min-width: $mobile-view) {
width: 400px;
}
@media screen and (max-height: 600px) {
padding-top: 50px;
img {
width: 160px;
}
}
} }