Important: This documentation covers Yarn 1 (Classic).
For Yarn 2+ docs and migration guide, see yarnpkg.com.

Package detail

@vue-a11y/dark-mode

vue-a11y167MIT1.1.1TypeScript support: included

A component that helps you implement "dark-mode" in your Vue app

vue, component, a11y, accessibility, dark-mode, light, sensitivity, visual, impairments, vue-a11y, vuepress, vue.js

readme

@vue-a11y/dark-mode

A component that helps to implement dark mode and other color modes in your Vue application.

Introduction

Give users more options and control over which color mode they feel most comfortable with.

Dark mode or any other color mode are excellent alternatives for the user of your application to have the best experience in certain circumstances or by default.

@vue-a11y/dark-mode is very flexible, in addition to dark-mode, you can pass through props any color mode you want, for example, sepia, dark-blue, reading, and as many more options.

Articles that served as inspiration:

Contributing

  • From typos in documentation to coding new features;
  • Check the open issues or open a new issue to start a discussion around your feature idea or the bug you found;
  • Fork repository, make changes and send a pull request;

Follow us on Twitter @vue_a11y

Thank you

changelog

Changelog

All notable changes to this project will be documented in this file. See standard-version for commit guidelines.

1.1.1 (2020-07-23)

Bug Fixes

  • Removing title to avoid redundancy on screen readers (8878fbd)

1.1.0 (2020-06-23)

Features

  • Modify color mode when the defaultMode prop changes (5604170)

1.0.1 (2020-06-11)

Bug Fixes

  • Use selector in favicon prop (68626a7)

1.0.0 (2020-06-10)

Features

  • 'change-mode' event when chosen a new color mode (8fa7193)
  • Adds SSR support (18a1e61)
  • Allow to import the component individually (526d0f9)
  • Support to custom storage (4aaf1fb)
  • Toggle favicon by prefer-color-scheme (987a555)

Bug Fixes

  • If system set colorMode preference in storage to use in SSR (22e99cc)
  • Set type in package.json (9fb4aa7)
  • docs: Path to how to CDN (9b24257)
  • styles: Add webkit and moz prefix to appearance button (7b02fd1)

0.2.0 (2020-05-18)

Features

  • Custom color-mode className (30a43b5)

0.1.3 (2020-05-08)

Bug Fixes

  • Update rollup plugins and build for production (d540257)

0.1.2 (2020-05-08)

Features

  • customize aria-label and aria-live through props (706b823)
  • index.d.ts with definitions to install function (4bcc6b7)

Bug Fixes

  • import terser module (9bd904d)
  • remove export component in index.js (7380c6e)
  • Toggle class in listener prefer-color-scheme: dark (5177f4b)
  • Update color mode on the listener only if chosenMode is system (d3b4153)

0.1.1 (2020-05-08)

Features

  • customize aria-label and aria-live through props (706b823)

Bug Fixes

  • remove export component in index.js (7380c6e)
  • Toggle class in listener prefer-color-scheme: dark (5177f4b)
  • Update color mode on the listener only if chosenMode is system (d3b4153)