diff --git a/assets/style/_global.scss b/assets/style/_global.scss
index 2044e62..15f8037 100644
--- a/assets/style/_global.scss
+++ b/assets/style/_global.scss
@@ -11,11 +11,13 @@ html{
 .light{
     background-color: $light-sidenav-bg;
     color: $light-sidenav-color;
+    transition: background-color .3s linear;
 }
 
 .dark{
     background-color: $dark-sidenav-bg;
     color: $dark-sidenav-color;
+    transition: background-color .3s linear;
 }
 
 
diff --git a/layouts/default.vue b/layouts/default.vue
index 714ccaa..4eaa8d2 100644
--- a/layouts/default.vue
+++ b/layouts/default.vue
@@ -16,6 +16,7 @@
   </div>
 </template>
 <script>
+// https://theme.nicetheme.xyz/lighthouse/sample-page
 // https://www.runoob.com/bootstrap4/bootstrap4-tutorial.html
 export default {
   components: {},
diff --git a/theme.config.js b/theme.config.js
new file mode 100644
index 0000000..be1218e
--- /dev/null
+++ b/theme.config.js
@@ -0,0 +1,8 @@
+module.exports = {
+    'light':{
+
+    },
+    'dark':{
+        
+    }
+}
\ No newline at end of file