New Sass architecture and translation system

Taking care of #13. Everything seems to work according to what we talked about in the relevant issue. 

## Generating `css` folder

I updated the [general structure](https://github.com/HugoGiraudel/a11y.css). There are now 2 folders, `css` and `sass`. The CSS folder is generated from:

```sh
sass --update sass:css
```

## New Sass architecture

Structure should basically look like this:

```
css/
    - a11y-fr.css
    - a11y-en.css # Not fully okay yet since we still need translations

sass/
    - a11y/ # Contains a partial file including all other partials
        - _a11y.scss

    - base/ # Contains a single file, with the `html` rule
        - _base.scss

    - messages/ # Contains `content` directives as before
        - _advice.scss
        - _error.scss
        - _warning.scss

    - selectors/ # Contains placeholder extending as before
        - _advice.scss
        - _error.scss
        - _obsolete.scss
        - _self-closing.scss
        - _warning.scss

    - utils/ # Contains configuration, functions, mixins and placeholders
        - _all.scss
        - _functions.scss
        - _mixins.scss
        - _placeholders.scss
        - _variables.scss

    - a11y-en.scss
    - a11y-fr.scss
```

As you can see, everything is partial except `a11y-en.scss` and `a11y-fr.scss` at root level of `sass` folder. These files only contain this (only thing changing is parameter of `set-locale`):

```scss
@import "utils/all";
@include set-locale("fr");
@import "a11y/a11y";
```

## New configuration system

Also, I moved every tiny bit of configuration regarding each theme (`advice`, `error`...) in a Sass map (in `utils/_variables.scss`), like so:

```scss
/// Theme map
/// @type Map
/// @prop {Map} theme
/// @prop {String} theme.icon  - Theme icon
/// @prop {Color} theme.color  - Theme color
/// @prop {Number} theme.index - Theme z-index
$themes: (
  'error': (
    'icon': \2620\00A0,
    'color': crimson,
    'index': ($max-z-index)
  ),
  'warning': (
    'icon': \2622\00A0,
    'color': gold,
    'index': ($max-z-index - 1)
  ),
  'obsolete': (
    'icon': \271D\00A0,
    'color': gray,
    'index': ($max-z-index - 2)
  ),
  'advice': (
    'icon': \2665\00A0,
    'color': forestgreen,
    'index': ($max-z-index - 3)
  ),
);
```

It's much easier this way to retrieve configuration for each message type, as well as making the code both elegant and ordered. Especially since I added this tiny function to fetch conf in this map (in `utils/_functions.scss`):

```scss
/// Configuration helper
/// @param {String} $theme
/// @param {String} $key
/// @require $themes
/// @return {*}
@function theme-conf($theme, $key) {
  @return map-deep-get($themes, $theme, $key);
}
```

So you only have to go like:

```scss
$color: theme-conf('error', 'color');
```

## To Do

* Should we use `en` and `fr` or `en-EN` and `fr-FR` (which would be lower-cased for checking)?
* English translations (maybe @pierrechoffe would be interested?)

---

I think it's a good start. Please feel free to ask me to update anything in this PR that would be okay yet.