Update disabled state for forms

5 files changed, 52 insertions, 11 deletions

diff --git a/src/base.less b/src/base.less
index 904cb5d..3c80b1c 100644
--- a/src/base.less
+++ b/src/base.less
@@ -40,14 +40,6 @@ a {
   outline: 0;
 }
 
-// Disabled state
-&[disabled],
-.disabled {
-  cursor: default;
-  opacity: .5;
-  pointer-events: none;
-}
-
 // Icons
 .btn,
 .toast,
diff --git a/src/buttons.less b/src/buttons.less
index 6ae9e5f..5e6fcb8 100644
--- a/src/buttons.less
+++ b/src/buttons.less
@@ -33,6 +33,13 @@
     border-color: darken(@dark-primary-color, 5%);
     color: @light-color;
   }
+  &[disabled],
+  &:disabled,
+  &.disabled {
+    cursor: default;
+    opacity: .5;
+    pointer-events: none;
+  }
 
   // Button Primary
   &.btn-primary {
diff --git a/src/calendars.less b/src/calendars.less
index 70542f4..7605ac5 100644
--- a/src/calendars.less
+++ b/src/calendars.less
@@ -49,7 +49,9 @@
       &.prev-month,
       &.next-month {
         .date-item {
+          cursor: default;
           opacity: .25;
+          pointer-events: none;
         }
       }
     }
diff --git a/src/forms.less b/src/forms.less
index f9dc328..3eafd65 100644
--- a/src/forms.less
+++ b/src/forms.less
@@ -24,9 +24,6 @@
   &:focus {
     border-color: @primary-color;
   }
-  &[disabled] {
-    background: @bg-color;
-  }
 
   // Input sizes
   &.input-sm {
@@ -93,6 +90,7 @@
   outline: 0;
   padding: .5rem .8rem;
   vertical-align: middle;
+
   &[multiple] {
     option {
       padding: .2rem .4rem;
@@ -361,6 +359,40 @@
   }
 }
 
+// Form disabled
+.form-select {
+  &:disabled,
+  &.disabled {
+    background-color: @dark-bg-color;
+    cursor: default;
+    opacity: .5;
+  }
+}
+
+input {
+  &:disabled,
+  &.disabled {
+    & {
+      background: @dark-bg-color;
+      cursor: default;
+      opacity: .5;
+    }
+    & + .form-icon {
+      background: @dark-bg-color;
+      border-color: @light-gray-color;
+      cursor: default;
+      opacity: .5;
+      pointer-events: none;
+    }
+  }
+}
+
+.form-switch {
+  input:disabled + .form-icon::after {
+    background: @light-bg-color;
+  }
+}
+
 // Form Horizontal
 .form-horizontal {
   padding: 1rem;
@@ -368,10 +400,12 @@
   .form-group {
     display: flex;
   }
+
   .form-label {
     padding: .8rem .4rem;
     margin-bottom: 0;
   }
+
   .form-checkbox,
   .form-radio,
   .form-switch {
diff --git a/src/pagination.less b/src/pagination.less
index cdd2f12..055c528 100644
--- a/src/pagination.less
+++ b/src/pagination.less
@@ -20,6 +20,12 @@
       &:hover {
         color: @primary-color;
       }
+      &[disabled],
+      &.disabled {
+        cursor: default;
+        opacity: .5;
+        pointer-events: none;
+      }
     }
 
     &.active {