docsify/docs/themes.md
Johannes Rappen 73a38c3878 chore: update german docs, fix links (#560)
* updated german links
* fixed links where `QingWei-Li` should've been `docsifyjs`
  * naturally excluded donate links and links to private projects like `vuep` unrelated to docsify

---

See commit for details. If you have a question, just ask.
2018-07-01 13:48:44 +08:00

61 lines
1.8 KiB
Markdown

# Themes
There are currently three themes available. Copy [Vue](//vuejs.org) and [buble](//buble.surge.sh) website custom theme and [@liril-net](https://github.com/liril-net) contribution to the theme of the black style.
```html
<link rel="stylesheet" href="//unpkg.com/docsify/themes/vue.css">
<link rel="stylesheet" href="//unpkg.com/docsify/themes/buble.css">
<link rel="stylesheet" href="//unpkg.com/docsify/themes/dark.css">
<link rel="stylesheet" href="//unpkg.com/docsify/themes/pure.css">
```
!> Compressed files are available in `/lib/themes/`.
```html
<!-- compressed -->
<link rel="stylesheet" href="//unpkg.com/docsify/lib/themes/vue.css">
<link rel="stylesheet" href="//unpkg.com/docsify/lib/themes/buble.css">
<link rel="stylesheet" href="//unpkg.com/docsify/lib/themes/dark.css">
<link rel="stylesheet" href="//unpkg.com/docsify/lib/themes/pure.css">
```
If you have any ideas or would like to develop a new theme, you are welcome to submit a [pull request](https://github.com/docsifyjs/docsify/pulls).
#### Click to preview
<div class="demo-theme-preview">
<a data-theme="vue">vue.css</a>
<a data-theme="buble">buble.css</a>
<a data-theme="dark">dark.css</a>
<a data-theme="pure">pure.css</a>
</div>
<style>
.demo-theme-preview a {
padding-right: 10px;
}
.demo-theme-preview a:hover {
cursor: pointer;
text-decoration: underline;
}
</style>
<script>
var preview = Docsify.dom.find('.demo-theme-preview');
var themes = Docsify.dom.findAll('[rel="stylesheet"]');
preview.onclick = function (e) {
var title = e.target.getAttribute('data-theme')
themes.forEach(function (theme) {
theme.disabled = theme.title !== title
});
};
</script>
## Other themes
- [docsify-themeable](https://jhildenbiddle.github.io/docsify-themeable/#/) A delightfully simple theme system for docsify.