Merge branch 'TMS-1164' into stage

Author: eebbi

assets/styles/layouts/_image-carousel.scss

@@ -20,31 +20,26 @@
         }
     }
 
-        .slick-arrow {
-            width: 2.5rem;
-            height: 2.5rem;
-        }
+    .slick-arrow {
+        width: 2.5rem;
+        height: 2.5rem;
+    }
 
-        .slick-prev {
-            left: 0.5rem;
-            padding: 0 !important;
-        }
+    .slick-prev {
+        left: 0.5rem;
+        padding: 0 !important;
+    }
 
-        .slick-next {
-            right: 0.5rem;
-            padding: 0 !important;
-        }
+    .slick-next {
+        right: 0.5rem;
+        padding: 0 !important;
+    }
 
 
     &__modal-control {
 
         &.slick-arrow {
-            background-color: transparent;
             border: none;
-
-            .icon {
-                fill: $white;
-            }
         }
     }
 

assets/styles/ui-components/_forms.scss

@@ -53,7 +53,7 @@ select {
 
     button[type="submit"] {
 
-        &:after { 
+        &:after {
             mask: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg"><path d="M2.13436 0L0.365646 1.76877L6.09688 7.5L0.365646 13.2312L2.13436 15L9.63436 7.5L2.13436 0Z"/></svg>');
             mask-size: cover;
             mask-repeat: no-repeat;
@@ -78,7 +78,7 @@ select {
 
 .gfield_checkbox {
 
-    label {      
+    label {
         &::before {
             margin-top: 0.25rem;
         }
@@ -103,10 +103,8 @@ select {
 .gform_delete_file {
 
     &:hover,
-    &:focus {
-        border-color: $black !important;
-        background-color: $white !important;
-        color: $black !important;
+    &:focus,
+    &:active {
         outline: 0.15rem dotted $black !important;
         outline-offset: 0.25rem !important;
     }

assets/styles/ui-components/_image-gallery.scss

@@ -5,6 +5,7 @@
 
         &:hover {
             outline: none !important;
+            border-color: $white !important;
         }
 
         &:focus {

assets/styles/ui-components/_modal.scss

@@ -28,9 +28,6 @@
     }
 
     .slick-arrow {
-        .icon {
-            fill: $white !important; // sass-lint:disable-line no-important
-        }
         &:hover {
             background-color: $white;
             .icon {