Redefining CSS Variables in Different Scopes
The solution is pretty simple.
In the .square--pink
class, we redefine the --color
variable to the deeppink
color:
Transcript
0:00 The solution is pretty simple here. All I had to do is in the square--pink class, redefine the --color variable, and assign it the color of deeppink, and now the square is pink. Pretty straightforward, right? This CSS variable scoping is a foundational piece of our theming strategy, so I need to make sure that you're comfortable with it.