IABTechLab / cmp

15 stars 19 forks source link

Styles refactoring #195

Open shackijj opened 5 years ago

shackijj commented 5 years ago

This issue relates to #164 and PR194.

I think that the styles in this project should be refactored for three reasons:

Firstly, not all CSS classes are prefixed. This could lead to bugs when these styles conflict with a website's styles.

Secondly, some styles are applied using a style attribute and others using classes. This makes development and debugging much more difficult.

Thirdly, React components are tightly coupled by their styles. So, for changing the appearance of a component, we have to modify the styles of another component.

Overall, we need to figure out how to write styles for CMP considering all these problems. I see two possible ways inline styles and BEM methodology.

@samtingleff @rusel1989 what do you think about it?

rusel1989 commented 5 years ago

@shackijj Well in our custom cmp @ CPEX, we are currently using mixed approach. For components or their parts which are not themable we still use less (we have added cmp__ prefix), for themable stuff we use inline styles. Also there are rules with higher weight than the rules inside cmp stylesheets on some sites where we run cmp. So from this point of view the inline styles might make sense.

Changes mentioned above will be part of one of the future PRs i am preparing.