@wener/console
Version:
Base console UI toolkit
35 lines (34 loc) • 1.63 kB
JavaScript
"use client";
import React from "react";
import { DaisyTheme, DaisyThemeDemo, ThemeListSelector } from "../../../daisy/index.js";
import { SettingLayout } from "../../../web/index.js";
import { getPrefersColorSchema } from "../../../web/utils/index.js";
export const AppearanceSettingPage = () => {
const [{ theme }, update] = DaisyTheme.useThemeState();
const setTheme = (v) => {
update({
theme: v
});
};
return /*#__PURE__*/ React.createElement(SettingLayout, {
title: /*#__PURE__*/ React.createElement("div", {
className: "flex items-center gap-2"
}, /*#__PURE__*/ React.createElement("span", null, "\u4E3B\u9898\u8BBE\u7F6E"), /*#__PURE__*/ React.createElement("div", {
className: "form-control"
}, /*#__PURE__*/ React.createElement("label", {
className: "label cursor-pointer"
}, /*#__PURE__*/ React.createElement("span", {
className: "label-text"
}, "\u4F7F\u7528\u7CFB\u7EDF\u914D\u8272"), /*#__PURE__*/ React.createElement("input", {
type: "checkbox",
className: "toggle toggle-accent toggle-sm",
checked: theme === "system",
onChange: () => {
setTheme(theme === "system" ? getPrefersColorSchema() : "system");
}
}))))
}, /*#__PURE__*/ React.createElement(ThemeListSelector, null), /*#__PURE__*/ React.createElement("div", {
className: "divider"
}, "\u4E3B\u9898\u7EC4\u4EF6\u793A\u4F8B"), /*#__PURE__*/ React.createElement(DaisyThemeDemo, null));
};
export default AppearanceSettingPage;