CSS псевдокласс :has()

Алоха товарищи! Сегодня будет небольшой пост про один из новых псевдоклассов CSS.

Что он делает: позволяет создать CSS селектор для элемента в зависимости от того есть ли у него тот или иной дочерний элемент.

Примеры:

// Выбираем элемент section который содержит h2
section:has(h2) {
background: lightgray;
}

// Выбираем img только в том случае если его родительский элемент содержит h2
section:has(h2) img {
border: 5px solid lime;
}

Собственно вот интересная такая штука.

❗ Но как это часто случается есть нюанс. Согласно ресурсу caniuse этот псевдокласс на данный момент не поддерживает Firefox, но учитывая что месяца 3 назад его еще не поддерживал хром то думаю это вопрос недолгого времени.

#shortread

Добавление ESlint в Angular приложение

Используя последнюю версию Angular создадим приложение. Затем добавим ESLint, который позволит анализировать JS для поиска проблем.

👉 @sWebDev