Dynamic CSS with Custom Properties (aka CSS Variables) Colors Exercise
Transcript from the "Colors Exercise" Lesson
>> So there's an exercise here, we have this repeated structure of items. This is a supposed migraine log. Migraine sufferers use applications to track their migraines. And there's an intensity meter on each of those items that allows people to set the intensity of their migraines if they want.
[00:00:22] So the third item doesn't have an intensity at all, the others do. And this was output by some kind of templating system, which also sets a custom property for the intensity so that we can use it in our CSS. So what we want to do is we want to change the main color of each migraine to be more red for more intense migraines and more yellow for less intense migraines and to be grey or actually blue, let's say blue, something completely unrelated.
[00:00:55] For migraines I don't have an intensity at all so that it's not confusing.