bulma-prefers-dark

Bulma extension to add prefers-color-scheme dark support


Keywords
css, sass, flexbox, responsive, bulma, extensions, bulma.io, bulma-css, bulma-extension, dark-theme, prefers-color-scheme
License
MIT
Install
npm install bulma-prefers-dark@0.1.0-beta.1

Documentation

bulma-prefers-dark

Safari screenshot

A Bulma extension that adds support for the prefers-color-scheme: dark media query

npm npm

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.

Include it in your SaSS pipeline after you've included Bulma and you're good to go:

@import "../../node_modules/bulma/bulma.sass";
@import "../../bulma-prefers-dark/bulma-prefers-dark.sass";

Alternatively include it in your HTML via unpkg:

<link rel="stylesheet" type="text/css" href="https://unpkg.com/bulma-prefers-dark" />

Copyright & License

Code copyright 2019 James Loh. Code released under the MIT license.