system-appearance

1.0.2 • Public • Published

system-appearance

How to Install

npm install system-appearance --save

How to use it with vanila JavaScript

import systemAppearance from "system-appearance";

setColorScheme(darkModeListener, lightModeListener, hasNoSupport);

function lightModeListener() {
    console.log('light mode');
}

function darkModeListener() {
    console.log('dark mode');
}

function hasNoSupport() {
    console.log('You specified no preference for a color scheme or your browser does not support it.');
}

How to use it with vue.js

<template>
  <div>
    Appearance is {{ appearance }}
  </div>
</template>

<script>
import systemAppearance from "system-appearance";

export default {
  name: "Appearance",
  data() {
    return {
      appearance: null,
    }
  }
  mounted() {
    systemAppearance(this.dark, this.light, this.hasNoSupport);
  },
  methods: {
    darkModeListener() {
      this.appearance = 'dark';
    },

    lightModeListener() {
      this.appearance = 'light';
    },

    hasNoSupport() {
      this.appearance = null;
      console.log('You specified no preference for a color scheme or your browser does not support it.');
    }
  }
};
</script>

Readme

Keywords

none

Package Sidebar

Install

npm i system-appearance

Weekly Downloads

1

Version

1.0.2

License

MIT

Unpacked Size

2.44 kB

Total Files

3

Last publish

Collaborators

  • deepaksisodiya