Compass Placeholder Text Mixin

@mixin input-placeholder($color) {
&.placeholder {
color
: $color;
}
&:-moz-placeholder {
color
: $color;
}
&::-webkit-input-placeholder {
color
: $color;
}
}

Passos:

  1. Adicione o mixin .input-placeholder () de _placeholderText.scss à folha de estilo de sua bússola (ou faça referência a ele em uma instrução @import )
  2. Em sua folha de estilo, chame o mixinput-placeholder () em qualquer lugar que você queira estilizar o texto do placeholder.

    .inputCls {
    @include input-placeholder (#cccccc);
    }

Compilará para:

.inputCls.placeholder {
color
: #cccccc;
}
.inputCls:-moz-placeholder {
color
: #cccccc;
}
.inputCls::-webkit-input-placeholder {
color
: #cccccc;
}
Tagged