mirror of
				https://github.com/taigrr/homer
				synced 2025-01-18 04:53:12 -08:00 
			
		
		
		
	
		
			
				
	
	
		
			35 lines
		
	
	
		
			726 B
		
	
	
	
		
			Vue
		
	
	
	
	
	
			
		
		
	
	
			35 lines
		
	
	
		
			726 B
		
	
	
	
		
			Vue
		
	
	
	
	
	
| <template>
 | |
|   <a
 | |
|     v-on:click="toggleTheme()"
 | |
|     aria-label="Toggle dark mode"
 | |
|     class="navbar-item is-inline-block-mobile"
 | |
|   >
 | |
|     <i class="fas fa-adjust"></i>
 | |
|   </a>
 | |
| </template>
 | |
| 
 | |
| <script>
 | |
| export default {
 | |
|   name: "Darkmode",
 | |
|   data: function () {
 | |
|     return {
 | |
|       isDark: null,
 | |
|     };
 | |
|   },
 | |
|   created: function () {
 | |
|     this.isDark =
 | |
|       "overrideDark" in localStorage
 | |
|         ? JSON.parse(localStorage.overrideDark)
 | |
|         : matchMedia("(prefers-color-scheme: dark)").matches;
 | |
|     this.$emit("updated", this.isDark);
 | |
|   },
 | |
|   methods: {
 | |
|     toggleTheme: function () {
 | |
|       this.isDark = !this.isDark;
 | |
|       localStorage.overrideDark = this.isDark;
 | |
|       this.$emit("updated", this.isDark);
 | |
|     },
 | |
|   },
 | |
| };
 | |
| </script>
 |