Skip to content

lotrekagency/vue-dark-mode-switcher

Folders and files

NameName
Last commit message
Last commit date

Latest commit

ย 

History

37 Commits
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 

Repository files navigation

๐ŸŽฌ Getting started

yarn add vue-dark-mode-switcher
npm install vue-dark-mode-switcher

๐Ÿ‘จโ€๐Ÿ’ป Usage

If you love emoticons you can use base version with ๐ŸŒžand ๐ŸŒœ

import DarkMode from "vue-dark-mode-switcher";
Vue.component('yourcomponentName', {
  components: {
    DarkMode
  }
}
template:{'
    ...
    <DarkMode></Darkmode>
    ...
'}

if you want to customize it

<DarkMode>
    <em slot="lightIcon"><b><em>light!</em></b></em>
    <em slot="darkIcon"><img src="..."/>></em>
</DarkMode>

๐Ÿ’… Styling!

You only have to create styles for .theme-dark class

.theme-dark{
    background: black;
    color: white;
}

the class is added to body element.

About

๐ŸŒ— Really simple dark mode switcher in Vue

Resources

License

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published