laoxong/misskey
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

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

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

* indent
This commit is contained in:
かっこかり 2025-02-24 14:23:20 +09:00 committed by GitHub
parent 5dc99e6f89
commit 1b44954dcb
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
4 changed files with 122 additions and 80 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

107
packages/backend/src/server/web/error.css
View File

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

40
packages/backend/src/server/web/error.js Normal file
View File

@ -0,0 +1,40 @@
/*
* SPDX-FileCopyrightText: syuilo and misskey-project
* SPDX-License-Identifier: AGPL-3.0-only
*/
'use strict';
(() => {
document.addEventListener('DOMContentLoaded', () => {
const locale = JSON.parse(localStorage.getItem('locale') || '{}');
const messages = Object.assign({
title: 'Failed to initialize Misskey',
serverError: 'If reloading after a period of time does not resolve the problem, contact the server administrator with the following ERROR ID.',
solution: 'The following actions may solve the problem.',
solution1: 'Update your os and browser',
solution2: 'Disable an adblocker',
solution3: 'Clear the browser cache',
solution4: '(Tor Browser) Set dom.webaudio.enabled to true',
otherOption: 'Other options',
otherOption1: 'Clear preferences and cache',
otherOption2: 'Start the simple client',
otherOption3: 'Start the repair tool',
}, locale?._bootErrors || {});
const reload = locale?.reload || 'Reload';
const reloadEls = document.querySelectorAll('[data-i18n-reload]');
for (const el of reloadEls) {
el.textContent = reload;
}
const i18nEls = document.querySelectorAll('[data-i18n]');
for (const el of i18nEls) {
const key = el.dataset.i18n;
if (key && messages[key]) {
el.textContent = messages[key];
}
}
});
})();

46
packages/backend/src/server/web/views/error.pug
View File

@ -6,7 +6,7 @@ doctype html
| |_|___ ___| |_ ___ _ _ | |_|___ ___| |_ ___ _ _
| | | | |_ -|_ -| '_| -_| | | | | | | |_ -|_ -| '_| -_| | |
|_|_|_|_|___|___|_,_|___|_ | |_|_|_|_|___|___|_,_|___|_ |
|___| |___|
Thank you for using Misskey! Thank you for using Misskey!
If you are reading this message... how about joining the development? If you are reading this message... how about joining the development?
https://github.com/misskey-dev/misskey https://github.com/misskey-dev/misskey
@ -27,39 +27,45 @@ html
style style
include ../error.css include ../error.css
script
include ../error.js
body body
svg.icon-warning(xmlns="http://www.w3.org/2000/svg", viewBox="0 0 24 24", stroke-width="2", stroke="currentColor", fill="none", stroke-linecap="round", stroke-linejoin="round") svg.icon-warning(xmlns="http://www.w3.org/2000/svg", viewBox="0 0 24 24", stroke-width="2", stroke="currentColor", fill="none", stroke-linecap="round", stroke-linejoin="round")
path(stroke="none", d="M0 0h24v24H0z", fill="none") path(stroke="none", d="M0 0h24v24H0z", fill="none")
path(d="M12 9v2m0 4v.01") path(d="M12 9v2m0 4v.01")
path(d="M5 19h14a2 2 0 0 0 1.84 -2.75l-7.1 -12.25a2 2 0 0 0 -3.5 0l-7.1 12.25a2 2 0 0 0 1.75 2.75") path(d="M5 19h14a2 2 0 0 0 1.84 -2.75l-7.1 -12.25a2 2 0 0 0 -3.5 0l-7.1 12.25a2 2 0 0 0 1.75 2.75")
h1 An error has occurred! h1(data-i18n="title") Failed to initialize Misskey
button.button-big(onclick="location.reload();") button.button-big(onclick="location.reload();")
span.button-label-big Refresh span.button-label-big(data-i18n-reload) Reload
p.dont-worry Don't worry, it's (probably) not your fault. p(data-i18n="serverError") If reloading after a period of time does not resolve the problem, contact the server administrator with the following ERROR ID.
p If reloading after a period of time does not resolve the problem, contact the server administrator with the following ERROR ID.
div#errors div#errors
code. code.
ERROR CODE: #{code} ERROR CODE: #{code}
ERROR ID: #{id} ERROR ID: #{id}
p You may also try the following options: p
b(data-i18n="solution") The following actions may solve the problem.
p Update your os and browser. p(data-i18n="solution1") Update your os and browser
p Disable an adblocker. p(data-i18n="solution2") Disable an adblocker
p(data-i18n="solution3") Clear your browser cache
p(data-i18n="solution4") (Tor Browser) Set dom.webaudio.enabled to true
a(href="/flush") details(style="color: #86b300;")
button.button-small summary(data-i18n="otherOption") Other options
span.button-label-small Clear preferences and cache a(href="/flush")
br button.button-small
a(href="/cli") span.button-label-small(data-i18n="otherOption1") Clear preferences and cache
button.button-small br
span.button-label-small Start the simple client a(href="/cli")
br button.button-small
a(href="/bios") span.button-label-small(data-i18n="otherOption2") Start the simple client
button.button-small br
span.button-label-small Start the repair tool a(href="/bios")
button.button-small
span.button-label-small(data-i18n="otherOption3") Start the repair tool

3
scripts/build-assets.mjs
View File

@ -60,7 +60,8 @@ async function buildBackendScript() {
'./packages/backend/src/server/web/boot.js', './packages/backend/src/server/web/boot.js',
'./packages/backend/src/server/web/boot.embed.js', './packages/backend/src/server/web/boot.embed.js',
'./packages/backend/src/server/web/bios.js', './packages/backend/src/server/web/bios.js',
'./packages/backend/src/server/web/cli.js' './packages/backend/src/server/web/cli.js',
'./packages/backend/src/server/web/error.js',
]) { ]) {
let source = await fs.readFile(file, { encoding: 'utf-8' }); let source = await fs.readFile(file, { encoding: 'utf-8' });
source = source.replaceAll('LANGS', JSON.stringify(Object.keys(locales))); source = source.replaceAll('LANGS', JSON.stringify(Object.keys(locales)));