Refactoring error page component style
This commit is contained in:
parent
389eb13129
commit
422a11e2a4
|
@ -54,5 +54,5 @@
|
|||
<div class="muted" i18n="This is about Sepia's tea">Sepia seems to like it.</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>
|
||||
|
|
|
@ -4,25 +4,26 @@
|
|||
.root {
|
||||
@include margin-left(auto);
|
||||
@include margin-right(auto);
|
||||
@include padding-top(9rem);
|
||||
@include rfs(45rem, width);
|
||||
|
||||
height: 100%;
|
||||
text-align: center;
|
||||
padding-top: 150px;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
flex-direction: column-reverse;
|
||||
|
||||
|
||||
.box {
|
||||
@include font-size(1.20rem);
|
||||
|
||||
text-align: start;
|
||||
font-size: 120%;
|
||||
padding: 0 15px;
|
||||
}
|
||||
|
||||
img {
|
||||
@include margin-left(auto);
|
||||
|
||||
width: 220px;
|
||||
height: auto;
|
||||
@include rfs(14rem, width);
|
||||
}
|
||||
|
||||
@media screen and (max-width: $mobile-view) {
|
||||
|
@ -30,16 +31,4 @@
|
|||
@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;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
Loading…
Reference in New Issue