Improve color variables and class namings

1 files changed, 4 insertions, 5 deletions

diff --git a/src/forms.less b/src/forms.less
index 6e5a83d..d6a2e5c 100644
--- a/src/forms.less
+++ b/src/forms.less
@@ -66,7 +66,7 @@
   }
 
   // Input types
-  &[type=file] {
+  &[type="file"] {
     height: auto;
   }
 }
@@ -105,7 +105,7 @@
     }
   }
   &:not([multiple]) {
-    background: @bg-color-light url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 4 5'%3E%3Cpath fill='%23666' d='M2 0L0 2h4zm0 5L0 3h4z'/%3E%3C/svg%3E") no-repeat right .75rem center / .8rem 1rem;
+    background: @bg-color-light url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 4 5'%3E%3Cpath fill='%23667189' d='M2 0L0 2h4zm0 5L0 3h4z'/%3E%3C/svg%3E") no-repeat right .75rem center / .8rem 1rem;
     height: 3.2rem;
     padding-right: 2.4rem;
   }
@@ -210,7 +210,7 @@
     &:checked + .form-icon {
       &::before {
         background-clip: padding-box;
-        border: .2rem solid @gray-color-lighter;
+        border: .2rem solid @light-color;
         border-left-width: 0;
         border-top-width: 0;
         content: "";
@@ -298,7 +298,7 @@
     }
     &:active + .form-icon {
       &::before {
-        background: @bg-color-dark;
+        background: @bg-color;
       }
     }
   }
@@ -371,7 +371,6 @@ input {
   &.disabled {
     & + .form-icon {
       background: @bg-color-dark;
-      border-color: @gray-color-light;
       cursor: not-allowed;
       opacity: .5;
     }