Reviewed-on: #270 Reviewed-by: Adam Bem <bema@noreply.example.com> Co-authored-by: widlam <mikolaj.widla@gmail.com> Co-committed-by: widlam <mikolaj.widla@gmail.com>
		
			
				
	
	
		
			44 lines
		
	
	
		
			1.0 KiB
		
	
	
	
		
			Vue
		
	
	
	
	
	
			
		
		
	
	
			44 lines
		
	
	
		
			1.0 KiB
		
	
	
	
		
			Vue
		
	
	
	
	
	
| <script setup lang="ts">
 | |
| import { RouterView } from 'vue-router';
 | |
| import SidebarComponent from '@components/sidebar/SidebarComponent.vue';
 | |
| import {onMounted, provide, ref } from 'vue';
 | |
| 
 | |
| 
 | |
| onMounted( ()=> { 
 | |
|   switch( localStorage.theme ) {
 | |
|     case "dark":{
 | |
|       document.documentElement.classList.add('dark');
 | |
|       break;
 | |
|     }
 | |
|     case "light":{
 | |
|       document.documentElement.classList.remove('dark');
 | |
|     }} 
 | |
|     theme.value = localStorage.theme; 
 | |
| })
 | |
| 
 | |
|   const theme = ref( getTheme() );
 | |
|   provide('theme', theme );
 | |
| 
 | |
|   function setTheme(newTheme : string){
 | |
|     theme.value = newTheme;
 | |
|   }
 | |
| 
 | |
|   function getTheme(){
 | |
|     return localStorage.theme;
 | |
|   }
 | |
|   
 | |
| 
 | |
| </script>
 | |
| 
 | |
| <template>
 | |
|   <div id="layout" class="font-sans flex h-screen bg-gradient-to-br from-sky-200 to-indigo-200 dark:from-sky-950 dark:to-indigo-950">
 | |
|     <SidebarComponent @theme:changed="setTheme" />
 | |
|     <div class="relative p-4 w-full m-4 ml-0 bg-blue-50 dark:bg-gray-700 rounded-2xl overflow-hidden shadow-lg">
 | |
|       <RouterView></RouterView>
 | |
|     </div>
 | |
|   </div>
 | |
|   
 | |
| </template>
 | |
| 
 | |
| <style scoped></style>
 |