dekun/zhimingge
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Narrow desktop layout margins and fix taiji icon in light mode.

Browse Source 
Cap content width at 1152px with side margins on ultrawide screens, add stroke to taiji logo for light backgrounds, and shrink backdrop watermark.

Co-authored-by: Cursor <cursoragent@cursor.com>
This commit is contained in:
dekun
2026-06-11 00:04:10 +08:00
parent 04c77dbf77
commit 18dd2e3501
5 changed files with 47 additions and 26 deletions
Download Patch File Download Diff File Expand all files Collapse all files
components/svg/taiji.tsx
+26 -13
View File
@@ -1,10 +1,7 @@
import React from "react";
import { cn } from "@/lib/utils";
const YANG = "fill-stone-100 dark:fill-stone-200";
const YIN = "fill-stone-800 dark:fill-stone-900";
/** 太极阴阳鱼图标（页眉 Logo） */
/** 太极阴阳鱼图标（页眉 Logo）— 亮色模式描边保证阴阳分界可见 */
export const TaijiIcon = React.memo(function TaijiIcon({
className,
}: {
@@ -14,16 +11,21 @@ export const TaijiIcon = React.memo(function TaijiIcon({
<svg
viewBox="0 0 64 64"
xmlns="http://www.w3.org/2000/svg"
className={cn("h-7 w-7 shrink-0 drop-shadow-sm", className)}
className={cn("h-7 w-7 shrink-0", className)}
aria-hidden
>
<circle cx="32" cy="32" r="30" className={YANG} />
<circle
cx="32"
cy="32"
r="30"
className="fill-white stroke-stone-600 stroke-[1.5] dark:fill-stone-200 dark:stroke-stone-400"
/>
<path
d="M32 2a30 30 0 0 1 0 60 15 15 0 0 1 0-30 15 15 0 0 0 0-30z"
className={YIN}
className="fill-stone-800 dark:fill-stone-900"
/>
<circle cx="32" cy="17" r="5" className={YANG} />
<circle cx="32" cy="47" r="5" className={YIN} />
<circle cx="32" cy="17" r="5" className="fill-white dark:fill-stone-200" />
<circle cx="32" cy="47" r="5" className="fill-stone-800 dark:fill-stone-900" />
</svg>
);
});
@@ -41,13 +43,24 @@ export function TaijiWatermark({
className={className}
aria-hidden
>
<circle cx="100" cy="100" r="98" className={`${YANG} opacity-[0.35]`} />
<circle
cx="100"
cy="100"
r="98"
className="fill-none stroke-stone-400/30 stroke-[0.75] dark:stroke-stone-500/25"
/>
<circle
cx="100"
cy="100"
r="98"
className="fill-white/40 dark:fill-stone-200/10"
/>
<path
d="M100 2a98 98 0 0 1 0 196 49 49 0 0 1 0-98 49 49 0 0 0 0-98z"
className={`${YIN} opacity-[0.08] dark:opacity-[0.12]`}
className="fill-stone-600/10 dark:fill-stone-300/12"
/>
<circle cx="100" cy="51" r="10" className={`${YANG} opacity-50`} />
<circle cx="100" cy="149" r="10" className={`${YIN} opacity-20 dark:opacity-30`} />
<circle cx="100" cy="51" r="10" className="fill-white/60 dark:fill-stone-200/20" />
<circle cx="100" cy="149" r="10" className="fill-stone-600/15 dark:fill-stone-300/20" />
</svg>
);
}