feat: auto system theme

This commit is contained in:
2026-05-16 11:53:38 +07:00
parent b00d9111a9
commit ff6afe5391
4 changed files with 25 additions and 10 deletions
+2 -2
View File
@@ -4,7 +4,7 @@ import React from "react";
import { useParams } from "next/navigation";
import { MousePointer2, Hand, ScanFace, Type, ImagePlus } from "lucide-react";
import { useEditorStore } from "../../../store/editor-store";
import { useUiStore } from "../../../store/ui-store";
import { useUiStore, isDarkTheme } from "../../../store/ui-store";
import { CanvasSizeModal } from "../../../components/canvas-size-modal";
import { EditorCanvasStage } from "../../../components/editor/editor-canvas-stage";
import { EditorHeader } from "../../../components/editor/editor-header";
@@ -148,7 +148,7 @@ export default function EditorPage() {
t,
});
const isDark = theme === "dark";
const isDark = isDarkTheme(theme);
const { width: cw, height: ch } = project.canvas;
const handleSave = React.useCallback(async () => {
+2 -2
View File
@@ -6,7 +6,7 @@ import { addLayer, createLayer, createProject, parseProjectFile, setCanvasSize }
import type { Project } from "@pien-studio/types";
import { deleteProject, duplicateProject, loadProjects, upsertProject } from "@pien-studio/storage";
import { useEditorStore } from "../store/editor-store";
import { useUiStore } from "../store/ui-store";
import { useUiStore, isDarkTheme } from "../store/ui-store";
import { accentButtonClass, cx, mutedSurfaceClass, subtleButtonClass, surfaceClass } from "../lib/theme";
import { UiPreferences } from "../components/ui-preferences";
import { useAssetCleanupJob } from "../hooks/use-asset-cleanup-job";
@@ -23,7 +23,7 @@ export default function HomePage() {
const [projectPendingDelete, setProjectPendingDelete] = React.useState<Project | null>(null);
const projectInputRef = React.useRef<HTMLInputElement | null>(null);
const imageInputRef = React.useRef<HTMLInputElement | null>(null);
const isDark = theme === "dark";
const isDark = isDarkTheme(theme);
const refreshProjects = React.useCallback(async () => {
setProjects(await loadProjects());