Refactor New Dashboard's common CSS styles

[jesusbotella]

Currently, our CSS styles are split into two folders of the repository: CSS in .vue files within components and common styles for the application which are located in /assets/stylesheets/new-dashboard.

Given that our New Dashboard project is a self-contained project within cartodb JavaScript assets, it makes sense to move those separated styles to the New Dashboard folder and have them located all together.

Leveraging that change, we can set up a proper CSS scaffolding following any of the architectures that make sense for us (like 7-1 CSS architecture). Separating styles by concerns, instead of them being unorganized.

As an extra ball, it could be great if we could use BEM for all those common styles which are not scoped and may require a bit of effort when naming them to avoid classes collision.

To summarize:

1. As a first step, we need to move the styles from /assets/stylesheets/new-dashboard to lib/assets/javascripts/new-dashboard/styles folder.
2. Setup a CSS scaffolding to create a good CSS separation.
3. Rewrite the CSS classes naming to be BEM compliant.

[VictorVelarde]

IMO it would be nice to split our work for this issue in at least two PRs:

• a shorter one, related to the movement and review of current styles (its result could be just the folder change and some internal notes on it). --> Relocate styles to the New Dashboard folder

• another one on the bigger reorganization, using ITCSS (or alike) and BEM. This can have two parts:

  • a little proposal description (that could be discussed here)
  • an implementation in a different PR, having a clear list of affected components