enhance(frontend): サーバーエラー画面の多言語対応 (#15549)

* enhance(frontend): サーバーエラー画面の多言語対応

* indent

1 files changed, 51 insertions, 56 deletions

diff --git a/packages/backend/src/server/web/error.css b/packages/backend/src/server/web/error.css
index f2b63296eb..803bd1b4b5 100644
--- a/packages/backend/src/server/web/error.css
+++ b/packages/backend/src/server/web/error.css
@@ -5,112 +5,107 @@
  */
 
 * {
-    font-family: BIZ UDGothic, Roboto, HelveticaNeue, Arial, sans-serif;
+	font-family: BIZ UDGothic, Roboto, HelveticaNeue, Arial, sans-serif;
 }
 
 #misskey_app,
 #splash {
-    display: none !important;
+	display: none !important;
 }
 
 body,
 html {
-    background-color: #222;
-    color: #dfddcc;
-    justify-content: center;
-    margin: auto;
-    padding: 10px;
-    text-align: center;
+	background-color: #222;
+	color: #dfddcc;
+	justify-content: center;
+	margin: auto;
+	padding: 10px;
+	text-align: center;
 }
 
 button {
-    border-radius: 999px;
-    padding: 0px 12px 0px 12px;
-    border: none;
-    cursor: pointer;
-    margin-bottom: 12px;
+	border-radius: 999px;
+	padding: 0px 12px 0px 12px;
+	border: none;
+	cursor: pointer;
+	margin-bottom: 12px;
 }
 
 .button-big {
-    background: linear-gradient(90deg, rgb(134, 179, 0), rgb(74, 179, 0));
-    line-height: 50px;
+	background: linear-gradient(90deg, rgb(134, 179, 0), rgb(74, 179, 0));
+	line-height: 50px;
 }
 
 .button-big:hover {
-    background: rgb(153, 204, 0);
+	background: rgb(153, 204, 0);
 }
 
 .button-small {
-    background: #444;
-    line-height: 40px;
+	background: #444;
+	line-height: 40px;
 }
 
 .button-small:hover {
-    background: #555;
+	background: #555;
 }
 
 .button-label-big {
-    color: #222;
-    font-weight: bold;
-    font-size: 20px;
-    padding: 12px;
+	color: #222;
+	font-weight: bold;
+	font-size: 1.2em;
+	padding: 12px;
 }
 
 .button-label-small {
-    color: rgb(153, 204, 0);
-    font-size: 16px;
-    padding: 12px;
+	color: rgb(153, 204, 0);
+	font-size: 16px;
+	padding: 12px;
 }
 
 a {
-    color: rgb(134, 179, 0);
-    text-decoration: none;
+	color: rgb(134, 179, 0);
+	text-decoration: none;
 }
 
 p,
 li {
-    font-size: 16px;
-}
-
-.dont-worry,
-#msg {
-    font-size: 18px;
+	font-size: 16px;
 }
 
 .icon-warning {
-    color: #dec340;
-    height: 4rem;
-    padding-top: 2rem;
+	color: #dec340;
+	height: 4rem;
+	padding-top: 2rem;
 }
 
 h1 {
-    font-size: 32px;
+	font-size: 1.5em;
+	margin: 1em;
 }
 
 code {
-    display: block;
-    font-family: Fira, FiraCode, monospace;
-    background: #333;
-    padding: 0.5rem 1rem;
-    max-width: 40rem;
-    border-radius: 10px;
-    justify-content: center;
-    margin: auto;
-    white-space: pre-wrap;
-    word-break: break-word;
+	display: block;
+	font-family: Fira, FiraCode, monospace;
+	background: #333;
+	padding: 0.5rem 1rem;
+	max-width: 40rem;
+	border-radius: 10px;
+	justify-content: center;
+	margin: auto;
+	white-space: pre-wrap;
+	word-break: break-word;
 }
 
-summary {
-    cursor: pointer;
+#errorInfo summary {
+	cursor: pointer;
 }
 
-summary > * {
-    display: inline;
-    white-space: pre-wrap;
+#errorInfo summary>* {
+	display: inline;
 }
 
 @media screen and (max-width: 500px) {
-    details {
-        width: 50%;
-    }
+	#errorInfo {
+		width: 50%;
+	}
 }