From f311499ca21fcafb16136b2910e4498f70d6ce41 Mon Sep 17 00:00:00 2001
From: moris <xinshisheng126@gmail.com>
Date: Mon, 16 Dec 2024 00:18:57 +0900
Subject: [PATCH] =?UTF-8?q?add:=20=E8=83=8C=E6=99=AF=E8=89=B2=E3=82=92tran?=
 =?UTF-8?q?sition=E3=81=95=E3=81=9B=E3=82=8B?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/app.css                              | 9 +++++++++
 src/routes/(DefaultStyle)/+layout.svelte | 3 ++-
 2 files changed, 11 insertions(+), 1 deletion(-)

diff --git a/src/app.css b/src/app.css
index 306b0eb..f1ce365 100644
--- a/src/app.css
+++ b/src/app.css
@@ -1,3 +1,12 @@
+@property --theme-color {
+    syntax: "<color>";
+    inherits: true;
+}
+@property --back-color {
+    syntax: "<color>";
+    inherits: true;
+}
+
 /* theme color */
 body, body.light {
     --color-scheme: light;
diff --git a/src/routes/(DefaultStyle)/+layout.svelte b/src/routes/(DefaultStyle)/+layout.svelte
index 8bfa6b2..d36c022 100644
--- a/src/routes/(DefaultStyle)/+layout.svelte
+++ b/src/routes/(DefaultStyle)/+layout.svelte
@@ -51,6 +51,7 @@
         display: flex;
         flex-direction: column;
         background-color: var(--back-color);
+        transition: background-color 1s;
         min-height: 100vh;
     }
 
@@ -76,7 +77,7 @@
         & header {
             background-color: var(--theme-color);
             height: 100%;
-            transition: height .4s, transform .4s;
+            transition: height .4s, transform .4s background-color 1s;
             &.hide {
                 height: 40px;
                 @media(width<1000px) {