PLAT-102: set-up basic custom button styles for both HTML formats

[AndyEPhipps]

https://jira.comicrelief.com/browse/PLAT-102

Deployment instructions

• No manual actions required for deployment

[pvhee]

@AndyEPhipps I think this is exported not via phing config:export but manually, and thus contains uuid and all that crap :)

[AndyEPhipps]

@pvhee so should we be removing this UUID info when exporting manually, or should we only be using phing to export config?

[pvhee]

@AndyEPhipps best way is to use drush cde MODULE_NAME (see also docs in https://github.com/comicrelief/campaign/blob/develop/docs/development.md#managing-configuration) or if you want all modules together use phing config:export

If you really want to do it via the UI, you'll need to remove the UUID manually :)

[pvhee]

BTW, UUID is added because this is to support the migration of config from the same site but different environments. We are building platform to power many different sites, hence we can't have the UUID in there

[gusliedke]

Let's review the standards when we copy and paste code from old sites and keep in mind BEM and SMACSS for naming convention and file structure.

For instance can we change .btn-red to .btn--red / .btn-ghost--white to .btn--ghost-white if ghost white is a modifier.

Let's not use a variable file for every component.

I think the btn mixin is a bit over engineered e.i. .btn-#{nth($button, 1)}. What do you think? We can discuss it and I show you what I mean.

Let's not remove outline e.i. _outline: none; _ Not good for accessibility

Let's not include input buttons for now.

I think this is a good opportunity for us to review, simplify and clean up our code! :)

[peter-brady]

Agree with @gusliedke's last comment.

Also, I think in most cases, one _variables.scss file is enough. Everything could go in there, so long as it's well structured. There may be the odd merge conflict here and there but still, better I think. Same for _mixins.scss.

Also, variables in general were way overused in previous campaigns. IMO, if a value is used twice or more, it gets a variable. If not, it doesn't.

[pvhee]

@AndyEPhipps care to review this here so we can merge in this PR?

[AndyEPhipps]

Need to pick this up again to go over Gustavo's suggested improvements, balancing a few plates at the mo

[AndyEPhipps]

Simplified use of mixin, updated class names to user BEM approach properly, exported HTML formats, removed previous campaign-specific styles to keep it general for now.
PLUS! styleguide stuff.