Support ultrawide layout with equal columns and taiji branding.

Use 50/50 mode workspace columns, widen content to 1920px on fish screens, replace header logo with taiji icon, and add full-page taiji backdrop. Co-authored-by: Cursor <cursoragent@cursor.com>
2026-06-10 23:50:19 +08:00
parent f22e3f4d16
commit 04c77dbf77
18 changed files with 120 additions and 31 deletions
@@ -0,0 +1,53 @@
+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） */
+export const TaijiIcon = React.memo(function TaijiIcon({
+  className,
+}: {
+  className?: string;
+}) {
+  return (
+    <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)}
+      aria-hidden
+    >
+      <circle cx="32" cy="32" r="30" className={YANG} />
+      <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}
+      />
+      <circle cx="32" cy="17" r="5" className={YANG} />
+      <circle cx="32" cy="47" r="5" className={YIN} />
+    </svg>
+  );
+});
+
+/** 背景用水印版太极 */
+export function TaijiWatermark({
+  className,
+}: {
+  className?: string;
+}) {
+  return (
+    <svg
+      viewBox="0 0 200 200"
+      xmlns="http://www.w3.org/2000/svg"
+      className={className}
+      aria-hidden
+    >
+      <circle cx="100" cy="100" r="98" className={`${YANG} opacity-[0.35]`} />
+      <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]`}
+      />
+      <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`} />
+    </svg>
+  );
+}