feat :just remove theme switch
This commit is contained in:
+1
-43
@@ -78,49 +78,7 @@
|
||||
--radius-4xl: calc(var(--radius) * 2.6);
|
||||
}
|
||||
|
||||
:root {
|
||||
color-scheme: light;
|
||||
--background: oklch(0.985 0.004 88);
|
||||
--foreground: oklch(0.22 0.018 275);
|
||||
--card: oklch(1 0 0);
|
||||
--card-foreground: var(--foreground);
|
||||
--popover: oklch(1 0 0);
|
||||
--popover-foreground: var(--foreground);
|
||||
--primary: oklch(0.51 0.105 78);
|
||||
--primary-foreground: oklch(0.99 0.005 88);
|
||||
--secondary: oklch(0.94 0.01 274);
|
||||
--secondary-foreground: var(--foreground);
|
||||
--muted: oklch(0.955 0.008 274);
|
||||
--muted-foreground: oklch(0.48 0.02 274);
|
||||
--accent: oklch(0.93 0.015 275);
|
||||
--accent-foreground: var(--foreground);
|
||||
--destructive: oklch(0.54 0.2 25);
|
||||
--success: oklch(0.46 0.12 155);
|
||||
--warning: oklch(0.51 0.105 78);
|
||||
--info: oklch(0.47 0.11 235);
|
||||
--tier-gold: oklch(0.51 0.105 78);
|
||||
--tier-silver: oklch(0.48 0.02 260);
|
||||
--tier-copper: oklch(0.49 0.1 55);
|
||||
--border: oklch(0.22 0.018 275 / 15%);
|
||||
--input: oklch(0.22 0.018 275 / 22%);
|
||||
--ring: var(--primary);
|
||||
--chart-1: oklch(0.51 0.105 78);
|
||||
--chart-2: oklch(0.5 0.15 255);
|
||||
--chart-3: oklch(0.46 0.12 155);
|
||||
--chart-4: oklch(0.5 0.16 325);
|
||||
--chart-5: oklch(0.47 0.1 210);
|
||||
--chart-6: oklch(0.54 0.17 25);
|
||||
--radius: 0.625rem;
|
||||
--sidebar: oklch(0.965 0.008 274);
|
||||
--sidebar-foreground: var(--foreground);
|
||||
--sidebar-primary: var(--primary);
|
||||
--sidebar-primary-foreground: var(--primary-foreground);
|
||||
--sidebar-accent: var(--accent);
|
||||
--sidebar-accent-foreground: var(--foreground);
|
||||
--sidebar-border: var(--border);
|
||||
--sidebar-ring: var(--ring);
|
||||
}
|
||||
|
||||
:root,
|
||||
.dark {
|
||||
color-scheme: dark;
|
||||
--background: oklch(0.13 0.012 275);
|
||||
|
||||
+13
-17
@@ -3,7 +3,6 @@ import { Anuphan, Geist_Mono } from "next/font/google";
|
||||
|
||||
import { DeploymentUpdateNotifier } from "@/components/deployment-update-notifier";
|
||||
import { PageProgress } from "@/components/page-progress";
|
||||
import { ThemeProvider } from "@/components/theme-provider";
|
||||
import { Toaster } from "@/components/ui/sonner";
|
||||
import { NotificationProvider } from "@/components/notifications/notification-bell";
|
||||
import { SitePushPrompt } from "@/components/notifications/site-push-prompt";
|
||||
@@ -45,24 +44,21 @@ export default function RootLayout({ children }: LayoutProps<"/">) {
|
||||
return (
|
||||
<html
|
||||
lang="th"
|
||||
className={`${anuphan.variable} ${geistMono.variable} h-full antialiased`}
|
||||
suppressHydrationWarning
|
||||
className={`dark ${anuphan.variable} ${geistMono.variable} h-full antialiased`}
|
||||
>
|
||||
<body className="flex min-h-full flex-col">
|
||||
<ThemeProvider>
|
||||
<PageProgress />
|
||||
<NotificationProvider>
|
||||
{children}
|
||||
<SitePushPrompt configured={Boolean(process.env.WEB_PUSH_PUBLIC_KEY && process.env.WEB_PUSH_PRIVATE_KEY && process.env.WEB_PUSH_SUBJECT)} />
|
||||
</NotificationProvider>
|
||||
<DeploymentUpdateNotifier deploymentId={deploymentId} />
|
||||
<Toaster
|
||||
richColors
|
||||
closeButton
|
||||
position="bottom-right"
|
||||
toastOptions={{ className: anuphan.className }}
|
||||
/>
|
||||
</ThemeProvider>
|
||||
<PageProgress />
|
||||
<NotificationProvider>
|
||||
{children}
|
||||
<SitePushPrompt configured={Boolean(process.env.WEB_PUSH_PUBLIC_KEY && process.env.WEB_PUSH_PRIVATE_KEY && process.env.WEB_PUSH_SUBJECT)} />
|
||||
</NotificationProvider>
|
||||
<DeploymentUpdateNotifier deploymentId={deploymentId} />
|
||||
<Toaster
|
||||
richColors
|
||||
closeButton
|
||||
position="bottom-right"
|
||||
toastOptions={{ className: anuphan.className }}
|
||||
/>
|
||||
</body>
|
||||
</html>
|
||||
);
|
||||
|
||||
@@ -36,7 +36,6 @@
|
||||
"lucide-react": "^1.35.0",
|
||||
"modern-screenshot": "^4.7.0",
|
||||
"next": "^16.4.0",
|
||||
"next-themes": "^0.4.6",
|
||||
"postgres": "^3.4.9",
|
||||
"qrcode": "^1.5.4",
|
||||
"radix-ui": "^1.6.7",
|
||||
@@ -1544,8 +1543,6 @@
|
||||
|
||||
"next": ["[email protected]", "", { "dependencies": { "@next/env": "16.4.0", "@swc/helpers": "0.5.23", "baseline-browser-mapping": "^2.9.19", "caniuse-lite": "^1.0.30001579", "postcss": "8.5.23", "styled-jsx": "5.1.6" }, "optionalDependencies": { "@next/swc-darwin-arm64": "16.4.0", "@next/swc-darwin-x64": "16.4.0", "@next/swc-linux-arm64-gnu": "16.4.0", "@next/swc-linux-arm64-musl": "16.4.0", "@next/swc-linux-x64-gnu": "16.4.0", "@next/swc-linux-x64-musl": "16.4.0", "@next/swc-win32-arm64-msvc": "16.4.0", "@next/swc-win32-x64-msvc": "16.4.0", "sharp": "^0.35.4" }, "peerDependencies": { "@opentelemetry/api": "^1.1.0", "@playwright/test": "^1.51.1", "babel-plugin-react-compiler": "*", "react": "^18.2.0 || 19.0.0-rc-de68d2f4-20241204 || ^19.0.0", "react-dom": "^18.2.0 || 19.0.0-rc-de68d2f4-20241204 || ^19.0.0", "sass": "^1.3.0" }, "optionalPeers": ["@opentelemetry/api", "@playwright/test", "babel-plugin-react-compiler", "sass"], "bin": { "next": "dist/bin/next" } }, "sha512-N2C+9q89Z/oLrsepSRS4jRMtwmUZAoZuAHU0e9T6+sAB5DdhADmrnOW+zjYijlrYFmVfmQhGVGy9eMFoB7UgKg=="],
|
||||
|
||||
"next-themes": ["[email protected]", "", { "peerDependencies": { "react": "^16.8 || ^17 || ^18 || ^19 || ^19.0.0-rc", "react-dom": "^16.8 || ^17 || ^18 || ^19 || ^19.0.0-rc" } }, "sha512-pZvgD5L0IEvX5/9GWyHMf3m8BKiVQwsCMHfoFosXtXBMnaS0ZnIJ9ST4b4NqLVKDEm8QBxoNNGNaBv2JNF6XNA=="],
|
||||
|
||||
"node-exports-info": ["[email protected]", "", { "dependencies": { "array.prototype.flatmap": "^1.3.3", "es-errors": "^1.3.0", "object.entries": "^1.1.9", "semver": "^6.3.1" } }, "sha512-kXs9Go0cah0qHVV2v389IXQLdLCeE1xfFtjOAF+iobu0OIoG1pje8At2vMHyaPMiPMnG/LWP50twML21eMcAag=="],
|
||||
|
||||
"node-releases": ["[email protected]", "", {}, "sha512-YHs7BmmcsdAI5Ozuf8JZo6PT0mv2GIWC9vMfvUC3dp65M8hn7Ux8CPL+2oBI7juNuj9d0ndhTcznq2ODBps9cQ=="],
|
||||
|
||||
@@ -279,7 +279,7 @@ function OverviewPoster({
|
||||
<DndContext sensors={posterSensors} onDragEnd={handlePosterDragEnd}>
|
||||
<div
|
||||
ref={posterRef}
|
||||
className="dark relative isolate aspect-square size-full overflow-hidden bg-black text-white @container"
|
||||
className="relative isolate aspect-square size-full overflow-hidden bg-black text-white @container"
|
||||
style={{ fontFamily: '"Genshin Overview", sans-serif' }}
|
||||
>
|
||||
{composition.backgroundUrl ? (
|
||||
|
||||
@@ -4,7 +4,6 @@ import Link from "next/link";
|
||||
import Image from "@/components/ui/resilient-image";
|
||||
import { PublicAccountMenu } from "@/components/public/public-account-menu";
|
||||
import { NotificationBell } from "@/components/notifications/notification-bell";
|
||||
import { ThemeSwitcher } from "@/components/theme-switcher";
|
||||
|
||||
export function HeaderShell({ homeHref, homeLabel, children }: {
|
||||
homeHref: string;
|
||||
@@ -23,7 +22,6 @@ export function HeaderShell({ homeHref, homeLabel, children }: {
|
||||
<span className="hidden lg:inline">ไกด์เกนชินไม่ใช่เกมมือถือ</span>
|
||||
</Link>
|
||||
{children}
|
||||
<ThemeSwitcher />
|
||||
<NotificationBell />
|
||||
<PublicAccountMenu />
|
||||
</div>
|
||||
|
||||
@@ -35,7 +35,7 @@ export function ConstellationImage({
|
||||
const footer = group.note;
|
||||
|
||||
return (
|
||||
<div className="dark relative isolate size-375 overflow-hidden bg-[#070b20] font-heading text-white">
|
||||
<div className="relative isolate size-375 overflow-hidden bg-[#070b20] font-heading text-white">
|
||||
<GuideExportBranding backgroundUrl={background} variant="constellation" />
|
||||
|
||||
<div className="absolute inset-x-20 top-7 z-10 flex items-start justify-center gap-5">
|
||||
|
||||
@@ -496,7 +496,7 @@ export function GuideImageExport({
|
||||
<div
|
||||
ref={previewRef}
|
||||
data-export-language={language}
|
||||
className={cn("dark bg-background p-10 text-foreground", captureClassName)}
|
||||
className={cn("bg-background p-10 text-foreground", captureClassName)}
|
||||
style={{ width, height }}
|
||||
>
|
||||
<style>{'[data-export-language="th"] [data-export-lang="en"],[data-export-language="en"] [data-export-lang="th"]{display:none!important}'}</style>
|
||||
@@ -516,7 +516,7 @@ export function GuideImageExport({
|
||||
ref={captureRef}
|
||||
data-export-language={language}
|
||||
className={cn(
|
||||
"dark bg-background p-10 text-foreground",
|
||||
"bg-background p-10 text-foreground",
|
||||
captureClassName,
|
||||
)}
|
||||
style={{ width, height }}
|
||||
|
||||
@@ -121,7 +121,7 @@ export function MaterialPoster({
|
||||
|
||||
return (
|
||||
<div
|
||||
className={cn("dark @container relative aspect-4/5 w-full select-none overflow-hidden bg-black text-white", interactive && characterArtUrl && "cursor-move", className)}
|
||||
className={cn("@container relative aspect-4/5 w-full select-none overflow-hidden bg-black text-white", interactive && characterArtUrl && "cursor-move", className)}
|
||||
style={{ backgroundImage: background }}
|
||||
onPointerDown={handlePointerDown}
|
||||
onPointerMove={handlePointerMove}
|
||||
|
||||
@@ -64,7 +64,7 @@ export function WeaponComparisonImage({
|
||||
const maximum = Math.max(100, ...values);
|
||||
|
||||
return (
|
||||
<div className="dark relative isolate w-300 overflow-hidden bg-[#070b20] px-14 pt-10 pb-12 font-heading text-white">
|
||||
<div className="relative isolate w-300 overflow-hidden bg-[#070b20] px-14 pt-10 pb-12 font-heading text-white">
|
||||
<GuideExportBranding backgroundUrl={guide.character.splashImageUrl ?? guide.coverUrl} />
|
||||
<header className="relative z-10 flex flex-col items-center px-48 text-center drop-shadow-[0_4px_3px_rgba(0,0,0,0.9)]">
|
||||
<h2 className="max-w-full text-5xl leading-tight font-bold text-balance">
|
||||
|
||||
@@ -12,7 +12,7 @@ export function RichTextContent({
|
||||
|
||||
return (
|
||||
<div
|
||||
className={cn("prose prose-sm dark:prose-invert max-w-none leading-snug [&>p]:m-0", className)}
|
||||
className={cn("prose prose-sm prose-invert max-w-none leading-snug [&>p]:m-0", className)}
|
||||
dangerouslySetInnerHTML={{ __html: sanitizeRichTextHtml(html) }}
|
||||
/>
|
||||
);
|
||||
|
||||
@@ -213,7 +213,7 @@ export function RichTextEditor({
|
||||
onUpdate: ({ editor: currentEditor }) => onChange(normalizedEditorHtml(currentEditor)),
|
||||
editorProps: {
|
||||
attributes: {
|
||||
class: "prose prose-sm dark:prose-invert min-h-28 max-w-none px-3 py-2 leading-snug outline-none [&_.is-editor-empty:first-child]:before:pointer-events-none [&_.is-editor-empty:first-child]:before:float-left [&_.is-editor-empty:first-child]:before:h-0 [&_.is-editor-empty:first-child]:before:text-muted-foreground [&_.is-editor-empty:first-child]:before:content-[attr(data-placeholder)] [&>p]:m-0",
|
||||
class: "prose prose-sm prose-invert min-h-28 max-w-none px-3 py-2 leading-snug outline-none [&_.is-editor-empty:first-child]:before:pointer-events-none [&_.is-editor-empty:first-child]:before:float-left [&_.is-editor-empty:first-child]:before:h-0 [&_.is-editor-empty:first-child]:before:text-muted-foreground [&_.is-editor-empty:first-child]:before:content-[attr(data-placeholder)] [&>p]:m-0",
|
||||
},
|
||||
},
|
||||
});
|
||||
|
||||
@@ -1,12 +0,0 @@
|
||||
"use client";
|
||||
|
||||
import { ThemeProvider as NextThemesProvider } from "next-themes";
|
||||
import type { ReactNode } from "react";
|
||||
|
||||
export function ThemeProvider({ children }: { children: ReactNode }) {
|
||||
return (
|
||||
<NextThemesProvider attribute="class" defaultTheme="system" enableSystem disableTransitionOnChange>
|
||||
{children}
|
||||
</NextThemesProvider>
|
||||
);
|
||||
}
|
||||
@@ -1,31 +0,0 @@
|
||||
"use client";
|
||||
|
||||
import { MoonIcon, SunIcon, SunMoonIcon } from "lucide-react";
|
||||
import { useTheme } from "next-themes";
|
||||
import { useSyncExternalStore } from "react";
|
||||
|
||||
import { Button } from "@/components/ui/button";
|
||||
|
||||
const subscribe = () => () => {};
|
||||
const clientSnapshot = () => true;
|
||||
const serverSnapshot = () => false;
|
||||
|
||||
export function ThemeSwitcher() {
|
||||
const { resolvedTheme, setTheme } = useTheme();
|
||||
const mounted = useSyncExternalStore(subscribe, clientSnapshot, serverSnapshot);
|
||||
const isDark = resolvedTheme === "dark";
|
||||
const label = mounted ? (isDark ? "เปลี่ยนเป็นโหมดสว่าง" : "เปลี่ยนเป็นโหมดมืด") : "เปลี่ยนธีม";
|
||||
|
||||
return (
|
||||
<Button
|
||||
variant="ghost"
|
||||
size="icon"
|
||||
aria-label={label}
|
||||
title={label}
|
||||
disabled={!mounted}
|
||||
onClick={() => setTheme(isDark ? "light" : "dark")}
|
||||
>
|
||||
{!mounted ? <SunMoonIcon /> : isDark ? <SunIcon /> : <MoonIcon />}
|
||||
</Button>
|
||||
);
|
||||
}
|
||||
@@ -1,14 +1,12 @@
|
||||
"use client"
|
||||
|
||||
import { Toaster as Sonner, type ToasterProps } from "sonner"
|
||||
import { useTheme } from "next-themes"
|
||||
import { CircleCheckIcon, InfoIcon, TriangleAlertIcon, OctagonXIcon, Loader2Icon } from "lucide-react"
|
||||
|
||||
const Toaster = ({ ...props }: ToasterProps) => {
|
||||
const { resolvedTheme } = useTheme()
|
||||
return (
|
||||
<Sonner
|
||||
theme={resolvedTheme === "dark" ? "dark" : "light"}
|
||||
theme="dark"
|
||||
className="toaster group"
|
||||
icons={{
|
||||
success: (
|
||||
|
||||
@@ -52,7 +52,6 @@
|
||||
"lucide-react": "^1.35.0",
|
||||
"modern-screenshot": "^4.7.0",
|
||||
"next": "^16.4.0",
|
||||
"next-themes": "^0.4.6",
|
||||
"postgres": "^3.4.9",
|
||||
"qrcode": "^1.5.4",
|
||||
"radix-ui": "^1.6.7",
|
||||
|
||||
Reference in New Issue
Block a user