fix: Tokenizer Input + Shellbar button improve specificity (#754)

SAP · Mar 3, 2020 · aed04cd · aed04cd
1 parent a6a49f7
commit aed04cd
Show file tree

Hide file tree

Showing 2 changed files with 14 additions and 19 deletions.
diff --git a/src/shellbar.scss b/src/shellbar.scss
@@ -99,26 +99,26 @@ $block: #{$fd-namespace}-shellbar;
     @include fd-icon-size("m", "before");
     @include fd-icon-size("m", "after");
 
-    border-color: transparent;
-    background: $fd-shellbar-background-color;
-    color: $fd-shellbar-color;
+    border-color: transparent !important;
+    background: $fd-shellbar-background-color !important;
+    color: $fd-shellbar-color !important;
 
     &:hover {
-      background: $fd-shell-hover-background;
+      background: $fd-shell-hover-background !important;
     }
 
     &:active {
-      background: $fd-shell-active-background;
+      background: $fd-shell-active-background !important;
     }
 
     &:hover,
     &:active {
-      color: $fd-shell-active-text-color;
+      color: $fd-shell-active-text-color !important;
     }
 
     @include fd-hover() {
       @include fd-disabled() {
-        background: $fd-shellbar-background-color;
+        background: $fd-shellbar-background-color !important;
       }
     }
 

diff --git a/src/tokenizer.scss b/src/tokenizer.scss
@@ -5,7 +5,6 @@
 $block: #{$fd-namespace}-tokenizer;
 
 .#{$block} {
-
   $fd-tokenizer-compact-spacing: 0.25rem;
   $fd-tokenizer-spacing: 0.3125rem;
 
@@ -37,10 +36,13 @@ $block: #{$fd-namespace}-tokenizer;
   }
 
   &__input {
-    width: 100%;
-    border: none;
-    min-width: 3rem;
-    padding: 0 $fd-tokenizer-spacing 0 0;
+    border: none !important;
+    min-width: 3rem !important;
+    padding: 0 $fd-tokenizer-spacing 0 0 !important;
+
+    &:last-child {
+      flex-basis: 100%;
+    }
 
     @include fd-focus() {
       outline: none;
@@ -75,11 +77,4 @@ $block: #{$fd-namespace}-tokenizer;
     overflow: visible;
     background-color: var(--sapField_ReadOnly_Background);
   }
-
-  /** To avoid overwriting from fd-input-group__input on multi-input component */
-  .#{$block}__input {
-    &:last-child {
-      flex-basis: 100%;
-    }
-  }
 }