diff options
| author | Eugen Rochko <eugen@zeonfederated.com> | 2019-02-15 23:33:25 +0100 |
|---|---|---|
| committer | GitHub <noreply@github.com> | 2019-02-15 23:33:25 +0100 |
| commit | 80388a3ffe654f5aec0dc94ce9976b4e9fe257ae (patch) | |
| tree | 4c9dc7e634b590224c1e2d26a191e3751486a5e0 /app | |
| parent | 71e28ba39993d6eb3c5966e20214214c9d81b173 (diff) | |
Change error graphic to hover-to-play (#10055)
Fix #6060
Diffstat (limited to 'app')
| -rw-r--r-- | app/javascript/packs/error.js | 13 | ||||
| -rw-r--r-- | app/javascript/styles/mastodon/basics.scss | 14 | ||||
| -rw-r--r-- | app/views/layouts/error.html.haml | 7 |
3 files changed, 26 insertions, 8 deletions
diff --git a/app/javascript/packs/error.js b/app/javascript/packs/error.js new file mode 100644 index 000000000..685c89065 --- /dev/null +++ b/app/javascript/packs/error.js @@ -0,0 +1,13 @@ +import ready from '../mastodon/ready'; + +ready(() => { + const image = document.querySelector('img'); + + image.addEventListener('mouseenter', () => { + image.src = '/oops.gif'; + }); + + image.addEventListener('mouseleave', () => { + image.src = '/oops.png'; + }); +}); diff --git a/app/javascript/styles/mastodon/basics.scss b/app/javascript/styles/mastodon/basics.scss index 746def625..4411ca0b4 100644 --- a/app/javascript/styles/mastodon/basics.scss +++ b/app/javascript/styles/mastodon/basics.scss @@ -100,12 +100,14 @@ body { vertical-align: middle; margin: 20px; - img { - display: block; - max-width: 470px; - width: 100%; - height: auto; - margin-top: -120px; + &__illustration { + img { + display: block; + max-width: 470px; + width: 100%; + height: auto; + margin-top: -120px; + } } h1 { diff --git a/app/views/layouts/error.html.haml b/app/views/layouts/error.html.haml index 37359b89b..25c85abf9 100644 --- a/app/views/layouts/error.html.haml +++ b/app/views/layouts/error.html.haml @@ -7,8 +7,11 @@ %meta{ content: 'width=device-width,initial-scale=1', name: 'viewport' }/ = stylesheet_pack_tag 'common', media: 'all' = stylesheet_pack_tag Setting.default_settings['theme'], media: 'all' + = javascript_pack_tag 'common', integrity: true, crossorigin: 'anonymous' + = javascript_pack_tag 'error', integrity: true, crossorigin: 'anonymous' %body.error .dialog - %img{ alt: Setting.default_settings['site_title'], src: '/oops.gif' }/ - %div + .dialog__illustration + %img{ alt: Setting.default_settings['site_title'], src: '/oops.png' }/ + .dialog__message %h1= yield :content |