Add note key nudge function

- Notes must be clicked in order to engage the nudge function for that note
-- This status is indicated by a green border around the note
-- Clicking the note or another note will turn off nudging for that note
- Also prevent notes from being nudged outside of the image borders

app/javascript/src/styles/base/040_colors.css

@@ -117,6 +117,7 @@
   --note-box-background: transparent;
   --note-box-inner-border: 1px solid black;
   --unsaved-note-box-inner-border: 1px solid red;
+  --movable-note-box-inner-border: 1px solid green;
   --note-preview-border: 1px solid red;
   --note-preview-background: white;
   --note-highlight-color: blue;

app/javascript/src/styles/specific/notes.scss

@@ -99,7 +99,8 @@ div#note-container {
       &.hovering {
         border: var(--note-box-border);
 
-        &.editing {
+        &.editing,
+        &.movable {
           opacity: 1;
         }
 
@@ -112,10 +113,18 @@ div#note-container {
         }
       }
 
-      &.editing {
+      &.editing,
+      &.movable {
         opacity: 0.4;
       }
 
+      &.movable {
+        div.note-box-inner-border,
+        div.note-box-inner-border.unsaved {
+          border: var(--movable-note-box-inner-border);
+        }
+      }
+
       div.ui-resizable-handle {
         display: none;
       }
@@ -126,6 +135,10 @@ div#note-container {
         vertical-align: middle;
         border: 1px solid transparent;
       }
+
+      div.note-box-inner-border.unsaved {
+        border: var(--unsaved-note-box-inner-border);
+      }
     }
 
     &.note-box-highlighted {