Cursors, Esc to cancel active tool (#946)

* basic drawing cursors

* Esc to cancel tool, I shortcut bug fix

* panel btns hover animation

* minor changes

* Linter fix

* update packages

* remove NYC coverage causing build errors
would be nice to find out a replacement or a fix

---------

Co-authored-by: JFH <20402845+jfhenon@users.noreply.github.com>

src/editor/components/seButton.js

@@ -3,9 +3,18 @@ import { t } from '../locale.js'
 const template = document.createElement('template')
 template.innerHTML = `
   <style>
+  @keyframes btnHover {
+    from {
+      background-color: var(--main-bg-color);
+    }
+
+    to {
+      background-color: var(--icon-bg-color-hover);
+    }
+  }
   :host(:hover) :not(.disabled)
   {
-    background-color: var(--icon-bg-color-hover);
+    animation: btnHover 0.2s forwards;
   }
   div
   {

src/editor/components/seFlyingButton.js

@@ -39,9 +39,17 @@ export class FlyingButton extends HTMLElement {
         :host {
           position:relative;
         }
-        .overall:hover *
-        {
-          background-color: var(--icon-bg-color-hover);
+        @keyframes btnHover {
+          from {
+            background-color: transparent;
+          }
+
+          to {
+            background-color: var(--icon-bg-color-hover);
+          }
+        }
+        .overall .menu-button:hover {
+          animation: btnHover 0.2s forwards;
         }
         img {
           border: none;

src/editor/components/seZoom.js

@@ -44,6 +44,23 @@ template.innerHTML = `
     margin-top: 2px;
     margin-bottom: 1px;
   }
+  #arrow-up, #arrow-down {
+    user-select: none;
+  }
+  @keyframes hover-arrows {
+    from {
+      background: transparent;
+      color: var(--icon-bg-color-hover);
+    }
+
+    to {
+      background: var(--icon-bg-color-hover);
+      color: var(--orange-color);
+    }
+  }
+  #arrow-up:hover, #arrow-down:hover {
+    animation: hover-arrows 0.2s forwards;
+  }
   #down{
     width:18px;
     height:23px;