Adds error example, and fixes classes

[kbardi]

Adds a workaround to pass styles to a different component. The main concept of css modules is that each component with their styles are independent, so the only way we have to change it is sending a prop to the component. The great idea behind it is that you know when you make changes outside the component, you never have impact in other places where you use the component...this is awesome, but the thing is sometimes it is not easy to change some styles...for that reason we need a property, and for that reason in every component in blueprint we have a prop called elementClassName or containerClassName, where we allow to edit styles in the component.

[camposcristian]

@lulen11 @kbardi how would this work with https://nextjs.org/blog/next-9-3#built-in-sass-support-for-global-stylesheets ?

[kbardi]

https://nextjs.org/blog/next-9-3#built-in-sass-support-for-global-stylesheets

Hey @camposcristianeze , we are using sass, but with css modules (which basically makes each module/component isolated, with no styles dependencies from other place, it cannot be overwritten from a different place). So it works with it...

If you are trying to say how would this work without css modules...the thing is you can override styles from everywhere, so you can change a component styles from a different component which is not related...the problem with that is:

1. You always need to load the full css of the project, you cannot split it in different files and load them only when you need.
2. You can create a css class with some styles, and maybe the name is exactly the same as other class you are using in a different place, so you could break styles in a different place of your website and you won't know that until someone find the error.

[mischacolley]

@lulen11 good for you to be across this

[rin]

@kbardi Hey Kevin! What's keeping this from being merged, do you need another review? Should I help nag someone? :D