JSFiddle - React, Tailwind, and code Playground

by Girisha Chennura

HTML

<input type="text" placeholder="placeholder"/>

SCSS

// Placeholder text
// -------------------------
@mixin placeholder($color: $placeholderText) {
  &:-moz-placeholder {
    color: $color;
    font-weight: normal;
  }
  &:-ms-input-placeholder {
    color: $color;
    font-weight: normal;
  }
  &::-webkit-input-placeholder {
    color: $color;
    font-weight: normal;
  }
}

body{
    margin: 50px 0 0 50px;
}
input {
    font-weight:bold;
    font-size:18px;
    @include placeholder(#999);
}