Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/jloh/bulma-prefers-dark
Bulma prefers dark theme
https://github.com/jloh/bulma-prefers-dark
bulma bulma-css bulma-extension dark-theme prefers-color-scheme
Last synced: 3 months ago
JSON representation
Bulma prefers dark theme
- Host: GitHub
- URL: https://github.com/jloh/bulma-prefers-dark
- Owner: jloh
- License: mit
- Archived: true
- Created: 2019-03-30T11:20:05.000Z (almost 6 years ago)
- Default Branch: master
- Last Pushed: 2024-03-29T04:52:03.000Z (10 months ago)
- Last Synced: 2024-05-01T13:09:14.435Z (9 months ago)
- Topics: bulma, bulma-css, bulma-extension, dark-theme, prefers-color-scheme
- Language: CSS
- Homepage:
- Size: 718 KB
- Stars: 206
- Watchers: 6
- Forks: 25
- Open Issues: 34
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
# bulma-prefers-dark
> Bulma now supports dark mdoe out of the box, this repo is no longer maintained
> See the docs https://bulma.io/documentation/features/dark-mode/
A Bulma extension that adds support for the `prefers-color-scheme: dark` media query
[](https://www.npmjs.com/package/bulma-prefers-dark)
[](https://www.npmjs.com/package/bulma-prefers-dark)
## Installation
```
npm install bulma-prefers-dark
... Or ...
yarn add bulma-prefers-dark
```
## Usage
This extension works as-is in combination with Bulma by adding an alternative dark theme via the `@media (prefers-color-scheme: dark)` [media query](https://caniuse.com/#search=prefers-color-scheme).
Include it in your SaSS pipeline after you've included Bulma and you're good to go:
```scss
@import "../../node_modules/bulma/bulma.sass";
@import "../../bulma-prefers-dark/bulma-prefers-dark.sass";
```
Alternatively include it in your HTML via unpkg:
```html
```
## Copyright & License
Code copyright 2019 James Loh. Code released under the [MIT license](LICENSE).