docsify-darklight-theme
Version:
Enables dark and light mode for docsify sites with switch
80 lines (60 loc) • 5.25 kB
Markdown
<p align="center">
<a href="https://docsify-darklight-theme.boopathikumar.me">
<img src="https://cdn.jsdelivr.net/npm/docsify-darklight-theme@latest/icons/docsify-darklight-theme-logo.png" style="width: 160px;height: 100px;" alt="jsdeliver">
</a>
</p>
<p align="center">
<b>docsify-darklight-theme</b>
</p>
<p align="center" >
<a target="_blank" href="https://docsify-darklight-theme.boopathikumar.me/"> Docs | Preview</a>
</p>
<p align="center">
<a href="https://www.jsdelivr.com/package/npm/docsify-darklight-theme">
<img src="https://data.jsdelivr.com/v1/package/npm/docsify-darklight-theme/badge?style=rounded" alt="jsdeliver">
</a>
<a href="https://badge.fury.io/js/docsify-darklight-theme">
<img src="https://badge.fury.io/js/docsify-darklight-theme.svg" alt="npm-version">
</a>
<a href="https://badge.fury.io/js/docsify-darklight-theme">
<img src="https://img.shields.io/badge/dynamic/json?url=https://api.npmjs.org/downloads/point/2020-01-01:2050-01-01/docsify-darklight-theme&label=npm%20downloads&query=$.downloads&color=informational" alt="npm-downloads">
</a>
<a href="https://badge.fury.io/gh/boopathikumar018%2Fdocsify-darklight-theme">
<img src="https://badge.fury.io/gh/boopathikumar018%2Fdocsify-darklight-theme.svg" alt="GitHub version" height="20">
</a>
<a href="https://opensource.org/licenses/MIT">
<img src="https://img.shields.io/badge/License-MIT-yellow.svg" alt="licenses" height="20">
</a>
</p>
<p align="center"> Dark and Light theme with switch for your docsify site</p>
<p align="center">
<a href="https://github.com/boopathikumar018/docsify-darklight-theme"> Give us a ⭐️ on Github to support our plugin!</a>
</p>
<p align="center" >
<a target="_blank" href="https://docsify-darklight-theme.boopathikumar.me/#/installation"> view starter template installation guide</a>
</p>
# What it is
**docsify-darklight-theme** is a simple and highly customizable theme for the documentation websites generated using [docsify.js](https://docsify.js.org/) ( also with [docsify-themeable](https://jhildenbiddle.github.io/docsify-themeable/#/) ). Using this theme, documents will have a theme switcher to switch between <svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 24 24" fill="#ffffff" stroke="#34495e" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-moon"><path d="M21 12.79A9 9 0 1 1 11.21 3 7 7 0 0 0 21 12.79z"></path></svg> `dark-mode` and <svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 24 24" fill="#ffffff" stroke="#34495e" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-sun"><circle cx="12" cy="12" r="5"></circle><line x1="12" y1="1" x2="12" y2="3"></line><line x1="12" y1="21" x2="12" y2="23"></line><line x1="4.22" y1="4.22" x2="5.64" y2="5.64"></line><line x1="18.36" y1="18.36" x2="19.78" y2="19.78"></line><line x1="1" y1="12" x2="3" y2="12"></line><line x1="21" y1="12" x2="23" y2="12"></line><line x1="4.22" y1="19.78" x2="5.64" y2="18.36"></line><line x1="18.36" y1="5.64" x2="19.78" y2="4.22"></line></svg> `light-mode` .
See the [Quick start](https://docsify-darklight-theme.boopathikumar.me/#/installation) guide for more details.
# Features
- Default [theme mode detection](https://docsify-darklight-theme.boopathikumar.me/#/configuration?id=default-browser-theme-detection) in supported browser versions.
- Theme Switcher.
- Switcher support for [docsify-themeable](https://jhildenbiddle.github.io/docsify-themeable/#/). View [setup guide](https://docsify-darklight-theme.boopathikumar.me/#/docsifyThemeable) here.
- Themes are customizable based on your color preferences.
- Option for other plugins to support (Dark/Light) mode. View [setup guide](https://docsify-darklight-theme.boopathikumar.me/#/themeSupport) here.
- Preferences can be modified directly in `window.$docsify` [configuration object](https://docsify-darklight-theme.boopathikumar.me/#/configuration).
- Using [configuration object](https://docsify-darklight-theme.boopathikumar.me/#/configuration)toogle icons can be configured based on your preference.
- Default theme(Dark/Light) can be configured based on your needs.
- Themes are remembered and retrieved from local storage.
- Redesigned search box.
# Maintainers
[@boopathikumar](//boopathikumar.me) [@eswarijayakumar](https://github.com/eswarijayakumar) [@kumaravel](//kumaravel.me)
# Release notes
View the [Change log](https://docsify-darklight-theme.boopathikumar.me/#/changelog) to know the details of each versions.
# Support
- Create a [GitHub issue](https://github.com/boopathikumar018/docsify-darklight-theme/issues) for bug reports, feature requests, or questions
- Follow [@docsify-darklight-theme](https://twitter.com/docsifyDrkLtThm) for announcements and release updates.
- Add a ⭐️ [star on GitHub](https://github.com/boopathikumar018/docsify-darklight-theme) to support the plugin!
# License
This project is licensed under the terms of the [MIT](https://github.com/boopathikumar018/docsify-darklight-theme/blob/master/LICENSE) license.
© [Boopathi Kumar](https://boopathikumar.me)