Single Price Component using Grid, Flex, CSS Modules, and Solid JS

For this challenge, I utilized both Grid and Flexbox. I used Grid to create the whole container for the component and Flex for some of the individual items in the component.

I also utilized a CSS Reset for this challenge. A CSS Reset is a stylesheet that replaces some of the browser-injected styles and essentially "resets" your site's styles into a standard baseline. Basically just overriding some default values. I based my CSS Reset on the resets of Andy Bell and Josh Comeau.

Again, I used CSS Modules for this challenge. I think I've really grown to like them. They allow for fairly easy styling of components since you don't have to worry about namespace collision.

I also played around with :focus and :focus-visible to try to make the button a little bit more accessible by showing focus states. Obviously, I still have a long ways to go before I can call myself an accessibility expert. Though, after recently learning about the CPACC and WAS exams by the IAAP, I think I actually want to pursue a certification in accessibility.

Anyway, feel free to leave any comments and suggestions!