Hover and active classes only for desktop

src/components/GeneratePage.vue

@@ -383,27 +383,27 @@ button {
     }
   }
 
-  &:hover input {
+  @include desktop {
-    &#greenCheckbox ~ .border .checkmark {
+    &:hover input {
-      background-color: $green;
+      &#greenCheckbox ~ .border .checkmark {
+        background-color: $green;
+      }
+
+      &#redCheckbox ~ .border .checkmark {
+        background-color: $red;
+      }
+
+      &#yellowCheckbox ~ .border .checkmark {
+        background-color: $yellow;
+      }
+
+      &#blueCheckbox ~ .border .checkmark {
+        background-color: $blue;
+      }
     }
 
-    &#redCheckbox ~ .border .checkmark {
+    &:focus input,
-      background-color: $red;
+    &:active input {
-    }
-
-    &#yellowCheckbox ~ .border .checkmark {
-      background-color: $yellow;
-    }
-
-    &#blueCheckbox ~ .border .checkmark {
-      background-color: $blue;
-    }
-  }
-
-  &:focus input,
-  &:active input {
-    @include desktop {
       &#greenCheckbox ~ .border .checkmark {
         background-color: $dark-green;
       }