diff options
| -rw-r--r-- | locales/en.yml | 2 | ||||
| -rw-r--r-- | src/web/app/common/tags/error.tag | 35 | ||||
| -rw-r--r-- | src/web/app/init.js | 8 |
3 files changed, 24 insertions, 21 deletions
diff --git a/locales/en.yml b/locales/en.yml index e15a7c9ae4..9cc5df317f 100644 --- a/locales/en.yml +++ b/locales/en.yml @@ -52,7 +52,7 @@ common: no-apps: "No apps" mk-error: - title: "Cannot connect to the server" + title: "Unable to connect to the server" description: "インターネット回線に問題があるか、サーバーがダウンまたはメンテナンスしている可能性があります。しばらくしてから再度お試しください。" thanks: "Thank you for using Misskey." diff --git a/src/web/app/common/tags/error.tag b/src/web/app/common/tags/error.tag index c7491d1c43..bbf7962320 100644 --- a/src/web/app/common/tags/error.tag +++ b/src/web/app/common/tags/error.tag @@ -1,36 +1,25 @@ <mk-error> - <!--i: i.fa.fa-times-circle--> <img src="/assets/error.jpg" alt=""/> <h1>%i18n:common.tags.mk-error.title%</h1> <p class="text">%i18n:common.tags.mk-error.description%</p> <p class="thanks">%i18n:common.tags.mk-error.thanks%</p> <style> :scope - position fixed - z-index 100000 - top 0 - left 0 + display block width 100% - height 100% + padding 32px 18px text-align center - background #f8f8f8 - - > i - display block - margin-top 64px - font-size 5em - color #6998a0 > img display block height 200px - margin 64px auto 0 auto + margin 0 auto pointer-events none user-select none > h1 display block - margin 32px auto 16px auto + margin 1.25em auto 0.65em auto font-size 1.5em color #555 @@ -43,13 +32,25 @@ > .thanks display block - margin 32px auto 0 auto - padding 32px 0 32px 0 + margin 2em auto 0 auto + padding 2em 0 0 0 max-width 600px font-size 0.9em font-style oblique color #aaa border-top solid 1px #eee + @media (max-width 500px) + padding 24px 18px + font-size 80% + + > img + height 150px + </style> + <script> + this.on('mount', () => { + document.documentElement.style.background = '#f8f8f8'; + }); + </script> </mk-error> diff --git a/src/web/app/init.js b/src/web/app/init.js index b442d36a15..825bbc77eb 100644 --- a/src/web/app/init.js +++ b/src/web/app/init.js @@ -9,6 +9,7 @@ import api from './common/scripts/api'; import signout from './common/scripts/signout'; import checkForUpdate from './common/scripts/check-for-update'; import Connection from './common/scripts/home-stream'; +import Progress from './common/scripts/loading'; import mixin from './common/mixins'; import generateDefaultUserdata from './common/scripts/generate-default-userdata'; import CONFIG from './common/scripts/config'; @@ -147,9 +148,10 @@ function fetchme(token, cb) { me.data ? done() : init(); }); }, () => { // When failure - // Display error screen - riot.mount(document.body.appendChild( - document.createElement('mk-error'))); + // Render the error screen + document.body.innerHTML = '<mk-error />'; + riot.mount('*'); + Progress.done(); }); function done() { |