Как оформить атрибут-заполнитель данных в scss?

#css #html #scss-lint

#css #HTML #scss-lint

Вопрос:

Я пытаюсь стилизовать заполнитель данных в SCSS.Честно говоря, я хочу изменить цвет заполнителя данных с существующего цвета на темно-серый.Однако мне не удалось выполнить это.

Прилагается мой код HTML5.

 <optic-select-input id="placeholder" class = "dataplaceholder" data- 
 placeholder="Choose or type subject..."  title = "Type your subject"ng- 
 model="newMessage.Subject" data-maxlength="50"  spellcheck="true">
  

Прилагается мой код SCSS.

     .dataplaceholder{
       @include placeholder(#A9A9A9,"");
         }


@mixin placeholder($color, $size:"") {
  amp;:-data-placeholder{
  color:$color !important;
  @if $size != "" {
  font-size: $size;
   }
   } 
   }
  

Любая помощь будет высоко оценена.

Комментарии:

1. @NirjharVermani Это заполнитель данных, а не заполнитель!!

Ответ №1:

Добавьте квадратные скобки типа [заполнитель данных].

 @mixin placeholder($color, $size:"") {
  amp;[data-placeholder] {
     color:$color !important;

    @if $size != "" {
      font-size: $size;
     }
  } 
}

.dataplaceholder{
  @include placeholder(#A9A9A9,"");
}
  

Комментарии:

1. @mohanbabu Уверен, что это так. Посмотрите здесь: jsfiddle.net/fcm2jvjv Посмотрите также на иерархию. Микшины должны быть определены до их использования. Я также отредактировал его в своем сообщении.

2. @Fantasteri это optic-select-input , а не обычный ввод

3. @mohanbabu «optic-select-input» не является допустимым тегом HTML5. В любом случае, код, который я предоставил, будет правильно отображаться для атрибута-заполнителя данных.