CB-5640 makes disabled design according to the figma

dbeaver · Oct 9, 2024 · 258c104 · 258c104
1 parent 6373be0
commit 258c104
Show file tree

Hide file tree

Showing 2 changed files with 4 additions and 12 deletions.
diff --git a/webapp/packages/core-blocks/src/FormControls/InputField/InputField.module.css b/webapp/packages/core-blocks/src/FormControls/InputField/InputField.module.css
@@ -50,7 +50,6 @@
 .input[disabled] + .iconContainer,
 .input[aria-disabled='true'] + .iconContainer {
   cursor: auto;
-  opacity: 0.8;
 }
 .input:not(:only-child) {
   padding-right: 32px !important;

diff --git a/webapp/packages/core-theming/src/styles/_form-controls.scss b/webapp/packages/core-theming/src/styles/_form-controls.scss
@@ -73,26 +73,19 @@
       @include mdc-theme-prop(border-color, primary, false);
     }
 
-    &:not([data-select='true'])[readonly] {
+    &:not([data-select='true'])[readonly],
+    &:not([data-select='true'])[disabled] {
       @include mdc-theme-prop(color, input-color-readonly, false);
       @include mdc-theme-prop(border-color, input-border-readonly, false);
       @include mdc-theme-prop(background-color, input-background-readonly, false);
       opacity: 1;
+      cursor: text;
+      pointer-events: all;
       &:-internal-autofill-selected,
       &:-internal-autofill-previewed {
         box-shadow: 0 0 0 50px $input-background-readonly inset;
       }
     }
-    &[disabled] {
-      @include mdc-theme-prop(color, input-color-disabled, false);
-      @include mdc-theme-prop(border-color, input-border-disabled, false);
-      @include mdc-theme-prop(background-color, input-background-disabled, false);
-      opacity: 1;
-      &:-internal-autofill-selected,
-      &:-internal-autofill-previewed {
-        box-shadow: 0 0 0 50px $input-background-disabled inset;
-      }
-    }
     &[data-embedded='true'] {
       &[disabled],
       &:not([data-select='true'])[readonly] {