Если вход сфокусирован, то как изменить свойства другого класса в Sass?

Question

Я пытаюсь изменить цвет одного класса одновременно, когда ввод сфокусирован, но ничего не меняется

Код:

<div className="wrapper">
  <div className="icon"></div>
  <input />
</div>

Sass selector:

.wrapper {
  input:focus & + .icon {
    color: black;
  }
}

Sass ничего не меняет, но работает css.

Вот пример: http://jsfiddle.net/Tyriar/Y83q6/2/

Кто-нибудь знает, что я должен изменить?

Answer 1

Вам нужно 2 вещи:

1. Удалить & из этого кода input:focus & + .icon;
2. Переместить <div className="icon"></div> под вход.«+» объединяет две последовательности простых селекторов, имеющих одного и того же родителя, а вторая должна НЕМЕДЛЕННО следовать после первой.