RK
Спасибо!
Size: a a a
2020 June 11
2020 June 14
И
Всем привет, а можете скинуть пример интернет-магазина, свёрстанного по канонам BEM? Интересно взглянуть на практику нейминга для блоков именно магазина
AB
Всем привет, а можете скинуть пример интернет-магазина, свёрстанного по канонам BEM? Интересно взглянуть на практику нейминга для блоков именно магазина
АН
Могу ли я изменять стили дочерних блоков? Спрашиваю, потому что это увеличивает специфичность правил и у меня нет опыта и понимания о том, на сколько важно не увеличивать специфичность. Например я хочу тень для кнопки в кастомном селекте. Я могу описать правило
.select__button > * {...}?Р
Могу ли я изменять стили дочерних блоков? Спрашиваю, потому что это увеличивает специфичность правил и у меня нет опыта и понимания о том, на сколько важно не увеличивать специфичность. Например я хочу тень для кнопки в кастомном селекте. Я могу описать правило
.select__button > * {...}?в чем проблема явно задать класс дочернему элементу и стилизовать без увеличения специфичности?
АН
в чем проблема явно задать класс дочернему элементу и стилизовать без увеличения специфичности?
Например, если нужно что-то необычное, а дочерний блок закрыт для модификации. Это не реальный случай, а просто размышление.
Лучше описывать такие состояния в самих блоках через модификаторы?
Лучше описывать такие состояния в самих блоках через модификаторы?
Р
Например, если нужно что-то необычное, а дочерний блок закрыт для модификации. Это не реальный случай, а просто размышление.
Лучше описывать такие состояния в самих блоках через модификаторы?
Лучше описывать такие состояния в самих блоках через модификаторы?
Если закрыт — конечно, это единственный способ.
Р
Например, если нужно что-то необычное, а дочерний блок закрыт для модификации. Это не реальный случай, а просто размышление.
Лучше описывать такие состояния в самих блоках через модификаторы?
Лучше описывать такие состояния в самих блоках через модификаторы?
АН
Я мог бы использовать
.select__button поддерживающую фокус, прямо в className кнопки, что бы создать микс, но не знаю как это лучше делать с реактом. Стоит складывать сгенерированное из пропсов className с входящим (из props.className)?АН
Если закрыт — конечно, это единственный способ.
Ладно, понял, можно просто примиксовать элемент с нужным поведением.
А к каким проблемам ведёт повышение специфичности css правил, кроме использования
А к каким проблемам ведёт повышение специфичности css правил, кроме использования
!important? Где об этом можно почитать?Р
Ладно, понял, можно просто примиксовать элемент с нужным поведением.
А к каким проблемам ведёт повышение специфичности css правил, кроме использования
А к каким проблемам ведёт повышение специфичности css правил, кроме использования
!important? Где об этом можно почитать?Уменьшение контроля. Хорошо, когда специфичность у всех равная и контролируется одинаково. Проще всего этого добиться, используя один класс (набор свойств) на тег.
АН
А как лучше переопределять css переменные, для установления цвета, например. Тоже через миксы?
АН
Если block2 может иметь color: blue, не лучше ли явно задать эту возможность: .block2_view_special {color: blue}, а не полагаться на вложенность, добавляя зависимость от другого Блока?
Вопрос о глобальных темах. Например мы захотели сделать цвет по умолчанию синим, что бы у всех глаза отвалились от красоты, и просто меняем какую-то глобальную переменную. Ну или переменную блока родителя, в зависимости от домена на который это должно распространяться
АН
Это о предоставлении API, для кастомизации
yW
Если у вас на проекте есть какая-то тема и она не статична, можно выносить её под селектор:
Тогда можно будет в рамках фичи (домена) повесить новый модификатор или микс, в котором переопределить необходимый набор переменных
.Theme_kind_a {
—color-1: #fff;
…
}Тогда можно будет в рамках фичи (домена) повесить новый модификатор или микс, в котором переопределить необходимый набор переменных
yW
Тут так же важно помнить о том, что все это дело не всегда хорошо работает с ie11 если у вас есть несколько вариаций тем
АН
Тут так же важно помнить о том, что все это дело не всегда хорошо работает с ie11 если у вас есть несколько вариаций тем
А как поступают в яндексе с ie11? Посмотрел недавно Вадима Макеева, он делал какой-то пример с css переменными и как я понял, назначил дефолтный цвет явно и перебил его функцией var. Что бы в IE было хоть что-нибудь, а в современных браузерах красиво. Вы поступаете так же?
yW
Тут все зависит от проекта, если на проекте используется одна тема, то переменные раскрываются без проблем, если две темы, то тут чуть сложнее, для этого я написал postcss-плагин (https://github.com/yarastqt/postcss-theme-fold), который обрабатывает такие кейсы.
