Refactor CSS files

[greyhillman]

Problem

While developing, I was often going to multiple SASS files in order to change the CSS of one component.

Also, there's probably a couple places where code that's meant to be doing the same thing is repeated. Those should be consolidated.

Alternative solution

The SASS files should be structured as components. Each React component could have a SASS/CSS/style file for it that's responsible for styling things inside the component. Things that could be styled by the using component should be kept out.

For example, margins should be set on the using component while padding should be done by the used component.

Benefits compared to current solution

• When changing the styling of a component, only 1 file should be changed.
• Less duplication of code

Costs compared to current solution

• potentially more files