fix(platform:search-input): Fixing SCSS after fundamental-styles upgr…

…ade (#1658)
SAP · Dec 4, 2019 · a96199a · a96199a
1 parent 7317382
commit a96199a
Showing 1 changed file with 16 additions and 31 deletions.
diff --git a/libs/platform/src/lib/components/search-input/search-input.component.scss b/libs/platform/src/lib/components/search-input/search-input.component.scss
@@ -7,7 +7,8 @@
         border-bottom-right-radius: 0px;
 
         &:disabled {
-            opacity: 1.0;
+            color: #89919a;
+            border-color: #89919a;
         }
 
         &::after {
@@ -18,6 +19,11 @@
     }
 
     @supports(--css: variables) {
+        ::ng-deep button.fd-dropdown__control:disabled {
+            color: var(--fd-color-neutral-4, #89919a);
+            border-color: var(--fd-color-neutral-4, #89919a);
+        }
+
         ::ng-deep button.fd-dropdown__control::after {
             color: var(--fd-color-action-1, #0a6ed1);
         }
@@ -28,20 +34,13 @@
 
     ::ng-deep input[type="search"],
     ::ng-deep .fd-input {
-        border-width: 1px;
-        border-style: solid;
-        padding-right: 12px;
-        padding-left: 12px;
-        border-color: #89919a;
-        background: none;
+        margin-top: 0px;
     }
 
-    ::ng-deep [type=search]+.fd-input-group__addon {
-        border-width: 1px;
-        border-left-width: 0px;
-        border-style: solid;
-        border-color: #89919a;
-        width: auto;
+    ::ng-deep .fd-input--compact {
+        margin-top: 0px;
+        margin-bottom: 0px;
+        height: var(--fd-forms-height-compact, 28px);
     }
 
     ::ng-deep input:disabled {
@@ -52,15 +51,6 @@
         -webkit-appearance: searchfield-cancel-button;
     }
 
-    ::ng-deep .fd-input-group .fd-input-group__addon--button>* {
-        border-color: transparent;
-    }
-
-    ::ng-deep .fd-button--compact::before {
-        font-size: 14px;
-        line-height: 1.2;
-    }
-
     @supports(--css: variables) {
 
         ::ng-deep input[type="search"],
@@ -101,15 +91,6 @@
 
 ::ng-deep [dir="rtl"] .search-input {
 
-    & [type=search]+.fd-input-group__addon {
-        border-width: 1px;
-        border-left-width: 1px;
-        border-right-width: 0px;
-        border-style: solid;
-        border-color: #89919a;
-        width: auto;
-    }
-
     & .search-input__category-dropdown button {
         border-top-right-radius: 4px;
         border-bottom-right-radius: 4px;
@@ -165,6 +146,10 @@
     animation: sap-icon-spin 2s infinite linear;
 }
 
+.is-loading ::ng-deep .fd-button {
+    margin-left: 0;
+}
+
 .is-loading ::ng-deep .fd-input-group__addon:hover .fd-button:before {
     content: "\e03e";
     animation: none;