fix(select): added color for placeholder (#UIM-194) (#314)

positive-js · Oct 23, 2019 · ec4a91d · ec4a91d
1 parent 8a59154
commit ec4a91d
Show file tree

Hide file tree

Showing 4 changed files with 9 additions and 5 deletions.
diff --git a/packages/mosaic-dev/select/module.ts b/packages/mosaic-dev/select/module.ts
@@ -21,7 +21,7 @@ import { OPTIONS } from './options';
     encapsulation: ViewEncapsulation.None
 })
 export class DemoComponent implements OnInit {
-    singleSelected = 'Normal';
+    singleSelected = '';
     multipleSelected = ['Normal', 'Hovered', 'Selected', 'Selected1'];
 
     singleSelectedWithSearch = 'Moscow';

diff --git a/packages/mosaic-dev/select/template.html b/packages/mosaic-dev/select/template.html
@@ -73,7 +73,7 @@
 <div class="dev-container">
 
     <mc-form-field>
-        <mc-select [(value)]="singleSelected">
+        <mc-select [(value)]="singleSelected" [placeholder]="'placeholder'">
             <mc-option value="Disabled" disabled>Disabled</mc-option>
             <mc-option value="Normal">Normal</mc-option>
             <mc-option value="Hovered">Hovered</mc-option>

diff --git a/packages/mosaic/input/_input-theme.scss b/packages/mosaic/input/_input-theme.scss
@@ -8,15 +8,15 @@
         color: map-get($foreground, text);;
 
         &::placeholder {
-            color: map-get($foreground, disabled-text);;
+            color: map-get($foreground, disabled-text);
         }
 
         &::-ms-input-placeholder {
-            color: map-get($foreground, disabled-text);;
+            color: map-get($foreground, disabled-text);
         }
 
         &::-webkit-input-placeholder {
-            color: map-get($foreground, disabled-text);;
+            color: map-get($foreground, disabled-text);
         }
     }
 }

diff --git a/packages/mosaic/select/_select-theme.scss b/packages/mosaic/select/_select-theme.scss
@@ -25,6 +25,10 @@
         }
     }
 
+    .mc-select__placeholder {
+        color: map-get($foreground, disabled-text);
+    }
+
     .mc-select__panel {
         border: {
             color: mc-color($second);