Make Gists human-readable

Currently, CodePan stores Gists in a way that is not very readable. CodePan-generated Gists would be much better to share if they were readable by humans without viewing through CodePan.

I suggest the following:
* Store all CodePan config like opened pans in a file like `codepan.json`
* Store pan contents in separate files like `index.html`, `index.js`, `index.css`
* Infer pan and transformer from file extension like this:

Filename | Pan | Transformer
--- | --- | ---
`*.html` | HTML | HTML
`*.scss` | CSS | SCSS
`*.ts` | JS | TypeScript

This can be overwritten in the CodePan config like so:

__`codepan.json`__
```json
{
"files": {
"index.js": {
"transformer": "babel"
},
"test.txt": {
"pan": "html",
"transformer": "markdown"
}
}
```

Alternatively, a pragma comment could be added at the top of files:

__`index.js`__
```js
// @codepan { transformer: 'babel' }
```

__`test.txt`__
```md

```

* If, by these rules, multiple files should be displayed in the same tab, only use the alphabetically first one for the sake of simplicity

* Preserve line breaks and spacing

Following these rules, [this](https://gist.github.com/jgierer12/0c27e3507504e835b83d989a40a5a494) Gist would be formatted like [this](https://gist.github.com/jgierer12/ca0f1001fa2a0920f892fa754e600653) instead.

By using sensible defaults for `codepan.json`, this would potentially also have the side effect of being able to open *any* Gist even if it wasn't created in CodePan!