Показать сообщение отдельно
  #1 (permalink)  
Старый 13.01.2017, 17:38
Отправить личное сообщение для Octane Посмотреть профиль Найти все сообщения от Octane  
Регистрация: 10.07.2008
Сообщений: 3,873

Sass @extend, автопрефиксер и псевдоклассы
Возьмем для примера псевдокласс :fullscreen.
.some {
    color: red;
}

.other:fullscreen {
    @extend .some;
}

Sass превращает это в:
.some, .other:fullscreen {
    color: red;
}

Далее PostCSS (Автопрефиксер) генерирует:
.some, .other:-webkit-full-screen {
    color: red;
}
.some, .other:-moz-full-screen {
    color: red;
}
.some, .other:-ms-fullscreen {
    color: red;
}
.some, .other:fullscreen {
    color: red;
}

Но вот проблема: если браузер ничего не знает о псевдоклассе, например любой Safari в iOS не понимает :fullscreen, то будут сфейлены все 4 блока, стили для .some не применятся.

Вопрос: как заставить PostCSS или Sass дополнительно генерировать отдельный блок .some?
Допустим код .some менять не могу (переделывать в mixin), это какой-то тулкит.

Последний раз редактировалось Octane, 13.01.2017 в 17:47.
Ответить с цитированием