Browse Source

Change error graphic to hover-to-play (#10055)

Fix #6060
Eugen Rochko 3 months ago
parent
commit
caf1450292

+ 13
- 0
app/javascript/packs/error.js View File

@@ -0,0 +1,13 @@
1
+import ready from '../mastodon/ready';
2
+
3
+ready(() => {
4
+  const image = document.querySelector('img');
5
+
6
+  image.addEventListener('mouseenter', () => {
7
+    image.src = '/oops.gif';
8
+  });
9
+
10
+  image.addEventListener('mouseleave', () => {
11
+    image.src = '/oops.png';
12
+  });
13
+});

+ 8
- 6
app/javascript/styles/mastodon/basics.scss View File

@@ -100,12 +100,14 @@ body {
100 100
       vertical-align: middle;
101 101
       margin: 20px;
102 102
 
103
-      img {
104
-        display: block;
105
-        max-width: 470px;
106
-        width: 100%;
107
-        height: auto;
108
-        margin-top: -120px;
103
+      &__illustration {
104
+        img {
105
+          display: block;
106
+          max-width: 470px;
107
+          width: 100%;
108
+          height: auto;
109
+          margin-top: -120px;
110
+        }
109 111
       }
110 112
 
111 113
       h1 {

+ 5
- 2
app/views/layouts/error.html.haml View File

@@ -7,8 +7,11 @@
7 7
     %meta{ content: 'width=device-width,initial-scale=1', name: 'viewport' }/
8 8
     = stylesheet_pack_tag 'common', media: 'all'
9 9
     = stylesheet_pack_tag Setting.default_settings['theme'], media: 'all'
10
+    = javascript_pack_tag 'common', integrity: true, crossorigin: 'anonymous'
11
+    = javascript_pack_tag 'error', integrity: true, crossorigin: 'anonymous'
10 12
   %body.error
11 13
     .dialog
12
-      %img{ alt: Setting.default_settings['site_title'], src: '/oops.gif' }/
13
-      %div
14
+      .dialog__illustration
15
+        %img{ alt: Setting.default_settings['site_title'], src: '/oops.png' }/
16
+      .dialog__message
14 17
         %h1= yield :content

BIN
public/oops.png View File


Loading…
Cancel
Save