Put ruler marks in front; prevent dragging while in ruler mode

macrovision.css

@@ -296,6 +296,8 @@ select.menu-item {
     width: 100%;
     height: 100%;
     background: #00000000;
+    z-index: 1001;
+    pointer-events: none;
 }
 
 #display {

macrovision.js

@@ -559,6 +559,7 @@ function drawRulers() {
         ctx.moveTo(start.x, start.y);
         ctx.lineTo(end.x, end.y);
         ctx.lineWidth = 5;
+        ctx.strokeStyle = "#f2f";
         ctx.stroke();
         const center = { x: (start.x + end.x) / 2, y: (start.y + end.y) / 2 };
         ctx.fillStyle = "#eeeeee";
@@ -1455,6 +1456,9 @@ function testClick(event) {
     // oh my god I can't believe I'm doing this
 
     const target = event.target;
+    if (rulerMode) {
+        return;
+    }
 
     // Get click coordinates