[#181] add disabling of popovers on small screens, update todos and operation CSS

src/web/stylesheets/components/_operation.css

@@ -7,7 +7,6 @@
  */
 
 .operation {
-    cursor: grab;
     padding: 10px;
     list-style-type: none;
     position: relative;
@@ -18,6 +17,22 @@
     border-right: none;
 }
 
+@media only screen and (min-width: 768px){
+    .operation {
+        cursor: grab;
+    }
+}
+
+.op-icon {
+    float: right;
+    font-size: 18px;
+    cursor: pointer;
+}
+
+.op-icon.remove-icon {
+    color: #f44336;
+}
+
 .op-title {
     font-weight: var(--op-title-font-weight);
 }
@@ -229,13 +244,6 @@ input.toggle-string {
     word-break: break-all;
 }
 
-.op-icon {
-    float: right;
-    color: #f44336;
-    font-size: 18px;
-    cursor: pointer;
-}
-
 .recip-icons {
     position: absolute;
     top: 13px;
@@ -316,9 +324,3 @@ input.toggle-string {
     color: var(--disabled-font-colour) !important;
     background-color: var(--disabled-border-colour) !important;
 }
-
-
-
-
-
-

src/web/stylesheets/components/operations/_operations.css

@@ -18,6 +18,7 @@
     overflow: auto;
     z-index: 20; /* to dropdown on top of all the other elements */
     border-bottom: 1px solid var(--primary-border-colour);
+    background-color: var(--secondary-background-colour);
 }
 
 #close-operations-dropdown.hidden,