mirror of
https://github.com/overleaf/overleaf.git
synced 2024-11-21 20:47:08 -05:00
Graphically anchor elements of 500 error visual.
This commit is contained in:
parent
70863930c3
commit
659028cf0f
3 changed files with 40 additions and 16 deletions
|
@ -4,8 +4,8 @@ block content
|
|||
.content
|
||||
.container
|
||||
.error-container
|
||||
.error-figure.error-figure-404
|
||||
img.img-responsive(
|
||||
.error-figure
|
||||
img.error-img(
|
||||
src="/img/brand/404-visual.svg"
|
||||
alt="Not found"
|
||||
)
|
||||
|
|
|
@ -11,8 +11,8 @@ html.full-height(itemscope, itemtype='http://schema.org/Product')
|
|||
.container.full-height
|
||||
.error-container.full-height
|
||||
.error-figure.error-figure-500
|
||||
img.img-responsive(
|
||||
src="/img/brand/500-visual.svg"
|
||||
img.error-img(
|
||||
src="/img/brand/500-visual-socket.svg"
|
||||
alt="Error"
|
||||
)
|
||||
.error-details
|
||||
|
|
|
@ -10,21 +10,45 @@
|
|||
.error-figure {
|
||||
display: none;
|
||||
flex: 0 0 50%;
|
||||
align-self: stretch;
|
||||
padding: @line-height-computed * 2;
|
||||
&-404 {
|
||||
@media (min-width: @screen-sm-min) {
|
||||
display: block;
|
||||
}
|
||||
}
|
||||
&-500 {
|
||||
padding-bottom: 0;
|
||||
@media (min-width: @screen-sm-min) {
|
||||
display: flex;
|
||||
align-items: flex-end;
|
||||
}
|
||||
@media (min-width: @screen-sm-min) {
|
||||
display: block;
|
||||
}
|
||||
}
|
||||
.error-figure-500 {
|
||||
&::before {
|
||||
content: '';
|
||||
display: block;
|
||||
position: fixed;
|
||||
top: 0;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
right: 80%;
|
||||
background-image: url(/img/brand/500-visual-plug.svg);
|
||||
background-size: 400px;
|
||||
background-repeat: no-repeat;
|
||||
background-position: right 70%;
|
||||
}
|
||||
&::after {
|
||||
content: '';
|
||||
display: block;
|
||||
position: fixed;
|
||||
top: 0;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
background-image: url(/img/brand/500-visual-tail.svg);
|
||||
background-size: 100px;
|
||||
background-repeat: no-repeat;
|
||||
background-position: 35% bottom;
|
||||
}
|
||||
}
|
||||
.error-img {
|
||||
display: block;
|
||||
max-width: 380px;
|
||||
height: auto;
|
||||
margin: 0 auto;
|
||||
}
|
||||
|
||||
.error-details {
|
||||
flex: 0 1 50%;
|
||||
|
|
Loading…
Reference in a new issue