Как исправить баг в анимации гамбургера?

Question

[MeMoJlor]

Доброго вечера! Сделал гамбургер, который меняет цвет на сайте в зависимости от фона. Но центральный span меняется с задержкой, что бросается в глаза. Меняется с задержкой, т.к у гамбургера есть анимация превращения в крестик. Вина в transition`ах. Как можно исправить сей баг?
Гамбургер

Answer 1

[Артем Рассадин]

У тебя в humTab transition-delay стоит. Убери 0s и все будет работать одновременно.

Comments

[MeMoJlor]

Тогда сломается анимация превращения

[Артем Рассадин]

Укажи это сразу же после стилей класса close и удали transition-delay для средней линии

.close:not(.humBlack):after, .close:not(.humBlack):before {
    background: #fff;
    width: 100%;
    transition-delay: 0s, 0.3s, 1.2s;
  }

[MeMoJlor]

Артем Рассадин, К сожалению не помогло тоже :(