Follow
RT jhey 🔨🐻✨
This week's @CodePen challenge is all about CSS :has() 😎
But you'll also notice this demo has a pure CSS timer 👀 That's using CSS "@ property" which is currently only in Chromium but there's intent for webkit 🙌
p.s Cheat code for this game is "cmd + opt + C" (DevTools 😅)
jhey 🔨🐻✨: CSS Tip! ✨
Use CSS :has() on the :root to check for a condition on the page 🧐
For example, this pure CSS Minesweeper game 🤯
:root:has([id*="bomb"]:checked) body {
--show-fail: 1;
}
If a bomb gets :checked, game over! 😭
@CodePen link below! 👇
