Resizing now fixed when deleting is available

website/studerende-dk/src/views/Home.vue

@@ -206,13 +206,24 @@ export default {
     },
 
     resizeVertical(event, index){
+      if(index == 0 || this.deleting){
+        return;
+      }
+      const clickTarget = event.target;
+      if(clickTarget.className != "row"){
+        return;
+      }
+      
       if(event.offsetY > this.layout[index].height){
-        this.mouseDragPos.y = event.y;
-        this.verticalResizeObject.index = index; 
-        document.addEventListener("mousemove", this.resizeVerticalMouseMove, false);
-        document.addEventListener("mouseup", this.eventRemover, false);
-        document.getElementsByTagName("html")[0].classList.add("no-select");
+        console.log(":After event")
+      } else {
+        index--;
       }
+      this.mouseDragPos.y = event.y;
+      this.verticalResizeObject.index = index; 
+      document.addEventListener("mousemove", this.resizeVerticalMouseMove, false);
+      document.addEventListener("mouseup", this.eventRemover, false);
+      document.getElementsByTagName("html")[0].classList.add("no-select");
     },
 
     eventRemover(){
@@ -266,6 +277,7 @@ export default {
   .row {
     display: flex;
     padding-top: $gap;
+    position: relative;
 
     &:hover {
       .remove-block {
@@ -295,16 +307,31 @@ export default {
   }
 
   // Must be outside ".row" or else after affect children
-  .row::after{
-    content: " ";
-    background-color: rgba(0, 0, 0, 0);
-    position: absolute;
-    bottom: - $gap;
-    width: 100%;
-    height: $gap;
-    cursor: n-resize;
+  .row:not(:first-of-type){
+    &::before{
+      content: " ";
+      background-color: rgba(0, 0, 0, 0);
+      position: absolute;
+      top: 0;
+      width: 100%;
+      height: $gap;
+      cursor: n-resize;
+    }
   }
 
+  .row:last-of-type{
+    &::after{
+      content: " ";
+      background-color: rgba(0, 0, 0, 0);
+      position: absolute;
+      bottom: -$gap;
+      width: 100%;
+      height: $gap;
+      cursor: n-resize;
+    }
+  }
+    
+
   .col {
     flex-basis: 0; // a basis of 0px. very important!
     background-color: $light-green-theme-color;