added resize handlers and linted document decorations

1 files changed, 26 insertions, 23 deletions

diff --git a/src/client/views/DocumentDecorations.scss b/src/client/views/DocumentDecorations.scss
index 481b90249..135d6d001 100644
--- a/src/client/views/DocumentDecorations.scss
+++ b/src/client/views/DocumentDecorations.scss
@@ -1,4 +1,4 @@
-@import "global/globalCssVariables";
+@import 'global/globalCssVariables';
 
 $linkGap: 3px;
 
@@ -41,7 +41,7 @@ $linkGap: 3px;
         opacity: 1;
         transform: translate(10px, 10px);
         grid-row: 4;
-        grid-column: 3
+        grid-column: 3;
     }
 
     .documentDecorations-topLeftResizer,
@@ -60,8 +60,7 @@ $linkGap: 3px;
         }
     }
 
-    .documentDecorations-resizer-Dark
-    {
+    .documentDecorations-resizer-Dark {
         background: $light-gray;
         opacity: 0.2;
     }
@@ -69,7 +68,7 @@ $linkGap: 3px;
     .documentDecorations-topLeftResizer,
     .documentDecorations-leftResizer,
     .documentDecorations-bottomLeftResizer {
-        grid-column: 1
+        grid-column: 1;
     }
 
     .documentDecorations-topResizer,
@@ -108,7 +107,6 @@ $linkGap: 3px;
         right: -15;
     }
 
-
     .documentDecorations-topLeftResizer,
     .documentDecorations-bottomRightResizer {
         cursor: nwse-resize;
@@ -145,7 +143,7 @@ $linkGap: 3px;
     .documentDecorations-bottomRightResizer,
     .documentDecorations-topRightResizer,
     .documentDecorations-rightResizer {
-        grid-column: 3
+        grid-column: 3;
     }
 
     .documentDecorations-rotation,
@@ -215,20 +213,25 @@ $linkGap: 3px;
         border-bottom: 2px solid;
     }
 
-.documentDecorations-topRightResizer:hover,
-.documentDecorations-bottomLeftResizer:hover {
-    cursor: nesw-resize;
-    background: black;
-    opacity: 1;
-}
+    .documentDecorations-topRightResizer:hover,
+    .documentDecorations-bottomLeftResizer:hover {
+        cursor: nesw-resize;
+        background: black;
+        opacity: 1;
+    }
 
-.documentDecorations-topResizer,
-.documentDecorations-bottomResizer {
-    cursor: ns-resize;
-}
+    .documentDecorations-topResizer,
+    .documentDecorations-bottomResizer {
+        cursor: ns-resize;
+    }
 
-.documentDecorations-title-Dark,
-.documentDecorations-title {
+    .documentDecorations-leftResizer,
+    .documentDecorations-rightResizer {
+        cursor: ew-resize;
+    }
+
+    .documentDecorations-title-Dark,
+    .documentDecorations-title {
         opacity: 1;
         width: calc(100% - 8px); // = margin-left + margin-right
         grid-column: 2;
@@ -242,11 +245,11 @@ $linkGap: 3px;
         height: 20px;
         position: absolute;
         border-radius: 8px;
-        background: rgba(159,159,159,0.1);
+        background: rgba(159, 159, 159, 0.1);
 
-        .documentDecorations-titleSpan, 
-        .documentDecorations-titleSpan-Dark  {
-            width: 100% ;
+        .documentDecorations-titleSpan,
+        .documentDecorations-titleSpan-Dark {
+            width: 100%;
             border-radius: 8px;
             background: #ffffffa0;
             position: absolute;