CSS Quick-Tip: Custom Properties Fallback Values

Рет қаралды 1,031

Күн бұрын

A quick tip outlining how and why you can define fallback values for CSS Custom Properties, which can be useful when you're dealing with larger projects and design systems that contain many CSS Variables.
🔗 Links
Demo: codepen.io/ZoranJambor/pen/LY...
Why do we define Custom Properties on :root in CSS: • What exactly is :root ...
📖 Chapters
00:00 Why you need fallback values for Custom Properties
00:38 How to define fallback values for Custom Properties
01:10 How to define multiple fallback values for CSS Variables
Subscribe to CSS Weekly Newsletter:
💌 css-weekly.com/
Course Mastering Prettier & Stylelint
🔥 Learn everything about best linting tools while supporting CSS Weekly: masteringlinting.com/
🏷️ Use coupon code KZfaq15 to get an additional 15% off on the already discounted, pre-launch price.
Keep up-to-date with CSS Weekly:
👉 Twitter: / cssweekly
👉 Instagram: / cssweekly
👉 Facebook: / cssweekly
Keep up to date with what I'm up to:
🔗 Blog: zoranjambor.com
👉 Twitter: / zoranjambor
👉 LinkedIn: / zoranjambor
- Zoran Jambor
#css #csstips

Пікірлер: 8

@D7460N Жыл бұрын

Didn't know this! So cool. Thanks for posting!

@CSSWeekly Жыл бұрын

I’m thrilled to hear this! Thanks so much for watching and for your feedback! 🙏

@egorkloos Жыл бұрын

I particularly like the effect of placing a comma and no value, as it then resolves to nothing.

@CSSWeekly Жыл бұрын

Yes, indeed. I probably should have mentioned this. 🙂 But still, it seems like an anti-pattern. It looks wierd, like a mistake: cln.sh/kvsMnRHg 🙂

@ahmad-murery Жыл бұрын

It's not weird that my comment got deleted, YT has been doing this to me a lot recently. In short words, what I was saying is that I usually define a custom properties for my component (in its own css file) and then override them as needed from my main css file. anyway, thanks Zoran!

@CSSWeekly Жыл бұрын

Thanks for the comment and heads-up about KZfaq deleting your comments, Ahmad! I've pre-approved all your comments, so it should no longer happen on this channel. 🙂 Tha's an interesting approach, thanks for sharing! 🙏

@ahmad-murery Жыл бұрын

@@CSSWeekly That's very kind of you, Thanks Zoran!

@CSSWeekly Жыл бұрын

Thank you, Ahmad, for always sharing your perspective here! 🙂