[IMP] website editor: the snippet overlay fadeout on keypress and fadein on mousemove

addons/website/static/src/css/snippets.css

@@ -427,6 +427,13 @@
 .oe_overlay.block-n-bottom .n:before {
   content: "" !important;
 }
+.oe_overlay.o_keypress {
+  opacity: 0;
+  -webkit-transition: 0.8s;
+  -moz-transition: 0.8s;
+  -o-transition: 0.8s;
+  -transition: 0.8s;
+}
 
 .s-resize-important, .s-resize-important * {
   cursor: s-resize !important;

addons/website/static/src/css/snippets.sass

@@ -332,6 +332,13 @@
     &.block-n-bottom .n:before
         content: "\f062" !important
 
+    &.o_keypress
+        opacity: 0
+        -webkit-transition: .8s
+        -moz-transition: .8s
+        -o-transition: .8s
+        -transition: .8s
+
 
 .s-resize-important, .s-resize-important *
     cursor: s-resize !important

addons/website/static/src/js/website.snippets.editor.js

@@ -140,6 +140,17 @@
                     self.cover_target(self.$active_snipped_id.data("snippet-editor").$overlay, self.$active_snipped_id);
                 }
             });
+
+            $(document).on('keydown', function () {
+                if (self.$active_snipped_id && self.$active_snipped_id.data("snippet-editor")) {
+                    self.$active_snipped_id.data("snippet-editor").$overlay.addClass('o_keypress');
+                }
+            });
+            $(document).on('mousemove', function () {
+                if (self.$active_snipped_id && self.$active_snipped_id.data("snippet-editor")) {
+                    self.$active_snipped_id.data("snippet-editor").$overlay.removeClass('o_keypress');
+                }
+            });
         },
 
         show_blocks: function () {