github-markdown-css/readme.md

61 lines
1.5 KiB
Markdown
Raw Permalink Normal View History

# github-markdown-css
2014-05-08 02:02:46 +08:00
> The minimal amount of CSS to replicate the GitHub Markdown style
2014-11-27 23:20:18 +08:00
[<img src="https://cloud.githubusercontent.com/assets/170270/5219062/f22a978c-7685-11e4-8316-af25b6c89bc0.png" width="300">](http://sindresorhus.com/github-markdown-css)
2014-05-08 02:02:46 +08:00
## [Demo](http://sindresorhus.com/github-markdown-css)
## Install
2017-08-18 10:17:17 +08:00
Download [manually](https://raw.githubusercontent.com/sindresorhus/github-markdown-css/gh-pages/github-markdown.css), from [CDNJS](https://cdnjs.com/libraries/github-markdown-css), or with npm:
2014-05-08 02:02:46 +08:00
```
2017-10-15 14:55:26 +08:00
$ npm install github-markdown-css
2014-05-08 02:02:46 +08:00
```
## Usage
2017-06-15 18:43:33 +08:00
Import the `github-markdown.css` file and add a `markdown-body` class to the container of your rendered Markdown and set a width for it. GitHub uses `980px` width and `45px` padding, and `15px` padding for mobile.
2014-05-08 02:02:46 +08:00
```html
2017-06-15 18:43:33 +08:00
<meta name="viewport" content="width=device-width, initial-scale=1">
2014-05-08 02:02:46 +08:00
<link rel="stylesheet" href="github-markdown.css">
<style>
.markdown-body {
2015-12-07 02:56:04 +08:00
box-sizing: border-box;
2014-05-08 03:17:18 +08:00
min-width: 200px;
2015-12-07 02:56:04 +08:00
max-width: 980px;
2014-05-08 03:17:18 +08:00
margin: 0 auto;
2015-12-07 02:56:04 +08:00
padding: 45px;
2014-05-08 02:02:46 +08:00
}
2017-06-15 18:45:30 +08:00
2017-06-15 18:43:33 +08:00
@media (max-width: 767px) {
.markdown-body {
padding: 15px;
}
}
2014-05-08 02:02:46 +08:00
</style>
<article class="markdown-body">
<h1>Unicorns</h1>
<p>All the things</p>
</article>
2014-05-08 02:02:46 +08:00
```
## How
2014-05-08 02:02:46 +08:00
See [`generate-github-markdown-css`](https://github.com/sindresorhus/generate-github-markdown-css) for how it's generated and ability to generate your own.
2014-05-08 02:02:46 +08:00
## Dev
2014-05-08 02:02:46 +08:00
2016-01-23 20:15:24 +08:00
Run `npm run make` to update the CSS.
2014-05-08 02:02:46 +08:00
## License
2017-10-15 14:55:26 +08:00
MIT © [Sindre Sorhus](https://sindresorhus.com)