feat(themes): 添加可编辑的站点外观和皮肤主题(#408)

web/src/components/layout/app-providers.tsx

@@ -7,6 +7,7 @@ import zhCN from "antd/locale/zh_CN";
 import { AuthSessionHydrator } from "@/components/auth/auth-session-hydrator";
 import { ClientRootInit } from "@/components/layout/client-root-init";
 import { getAntThemeConfig } from "@/lib/app-theme";
+import { applySkinTheme } from "@/lib/skin-themes";
 import { appQueryClient } from "@/lib/query-client";
 import { useThemeStore } from "@/stores/use-theme-store";
 import { applyAppearanceMetadata, useAppearanceStore } from "@/stores/use-appearance-store";
@@ -72,6 +73,7 @@ export function AppProviders({ children }: { children: ReactNode }) {
     useEffect(() => {
         document.documentElement.classList.toggle("dark", dark);
         document.documentElement.style.colorScheme = theme;
+        applySkinTheme(appearance.activeSkin, theme);
         applyAppearanceMetadata(appearance);
     }, [appearance, dark, theme]);
 
@@ -81,7 +83,7 @@ export function AppProviders({ children }: { children: ReactNode }) {
     const isolateDevRepro = import.meta.env.DEV && typeof window !== "undefined" && window.location.pathname === "/dev/director-repro";
 
     return (
-        <ConfigProvider locale={zhCN} theme={getAntThemeConfig(dark)}>
+        <ConfigProvider locale={zhCN} theme={getAntThemeConfig(dark, appearance.activeSkin)}>
             <App message={{ duration: 3, maxCount: 3 }} notification={{ duration: 4.5, maxCount: 3, placement: "topRight" }}>
                 <QueryClientProvider client={appQueryClient}>
                     {isolateDevRepro ? (

web/src/components/layout/site-compliance-footer.tsx

@@ -0,0 +1,22 @@
+import { ExternalLink } from "lucide-react";
+
+import { cn } from "@/lib/utils";
+import { useAppearanceStore } from "@/stores/use-appearance-store";
+
+const MIIT_FILING_URL = "https://beian.miit.gov.cn/";
+
+export function SiteComplianceFooter({ className, variant = "default" }: { className?: string; variant?: "default" | "auth" }) {
+    const appearance = useAppearanceStore((state) => state.appearance);
+
+    return (
+        <footer className={cn("site-compliance-footer", variant === "auth" && "is-auth", className)} aria-label="站点版权与备案信息">
+            <span>{appearance.footerCopyright}</span>
+            {appearance.icpFilingEnabled && appearance.icpFilingNumber ? (
+                <a href={MIIT_FILING_URL} target="_blank" rel="noopener noreferrer" aria-label={`${appearance.icpFilingNumber}，前往工业和信息化部备案管理系统查询`}>
+                    {appearance.icpFilingNumber}
+                    <ExternalLink aria-hidden="true" />
+                </a>
+            ) : null}
+        </footer>
+    );
+}