Fix styles of error pages (#5335)

Signed-off-by: Lynx Kotoura <admin@sanin.link>

Signed-off-by: Lynx Kotoura <admin@sanin.link>

app/javascript/styles/basics.scss

@@ -29,8 +29,7 @@ body {
     font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", mastodon-font-sans-serif, sans-serif;
   }
 
-  &.app-body,
+  &.app-body {
-  &.error {
     position: fixed;
     width: 100%;
     height: 100%;
@@ -70,25 +69,34 @@ body {
   }
 
   &.error {
+    position: absolute;
     text-align: center;
     color: $ui-primary-color;
-    padding: 20px;
+    background: $ui-base-color;
+    width: 100%;
+    height: 100%;
+    padding: 0;
     display: flex;
     justify-content: center;
     align-items: center;
 
-    .dialog img {
+    .dialog {
-      display: block;
+      vertical-align: middle;
-      max-width: 470px;
+      margin: 20px;
-      width: 100%;
+
-      height: auto;
+      img {
-      margin-top: -120px;
+        display: block;
-    }
+        max-width: 470px;
+        width: 100%;
+        height: auto;
+        margin-top: -120px;
+      }
 
-    .dialog h1 {
+      h1 {
-      font-size: 20px;
+        font-size: 20px;
-      line-height: 28px;
+        line-height: 28px;
-      font-weight: 400;
+        font-weight: 400;
+      }
     }
   }
 }