فهرست منبع

fix(desktop): terminal light mode

Adam 2 ماه پیش
والد
کامیت
d0789632b4
1فایلهای تغییر یافته به همراه14 افزوده شده و 5 حذف شده
  1. 14 5
      packages/desktop/src/components/terminal.tsx

+ 14 - 5
packages/desktop/src/components/terminal.tsx

@@ -1,8 +1,9 @@
 import { Ghostty, Terminal as Term, FitAddon } from "ghostty-web"
 import { Ghostty, Terminal as Term, FitAddon } from "ghostty-web"
-import { ComponentProps, onCleanup, onMount, splitProps } from "solid-js"
+import { ComponentProps, createEffect, onCleanup, onMount, splitProps } from "solid-js"
 import { useSDK } from "@/context/sdk"
 import { useSDK } from "@/context/sdk"
 import { SerializeAddon } from "@/addons/serialize"
 import { SerializeAddon } from "@/addons/serialize"
 import { LocalPTY } from "@/context/session"
 import { LocalPTY } from "@/context/session"
+import { usePrefersDark } from "@solid-primitives/media"
 
 
 export interface TerminalProps extends ComponentProps<"div"> {
 export interface TerminalProps extends ComponentProps<"div"> {
   pty: LocalPTY
   pty: LocalPTY
@@ -21,6 +22,7 @@ export const Terminal = (props: TerminalProps) => {
   let serializeAddon: SerializeAddon
   let serializeAddon: SerializeAddon
   let fitAddon: FitAddon
   let fitAddon: FitAddon
   let handleResize: () => void
   let handleResize: () => void
+  const prefersDark = usePrefersDark()
 
 
   onMount(async () => {
   onMount(async () => {
     ghostty = await Ghostty.load()
     ghostty = await Ghostty.load()
@@ -31,10 +33,17 @@ export const Terminal = (props: TerminalProps) => {
       fontSize: 14,
       fontSize: 14,
       fontFamily: "TX-02, monospace",
       fontFamily: "TX-02, monospace",
       allowTransparency: true,
       allowTransparency: true,
-      theme: {
-        background: "#191515",
-        foreground: "#d4d4d4",
-      },
+      theme: prefersDark()
+        ? {
+            background: "#191515",
+            foreground: "#d4d4d4",
+            cursor: "#d4d4d4",
+          }
+        : {
+            background: "#fcfcfc",
+            foreground: "#211e1e",
+            cursor: "#211e1e",
+          },
       scrollback: 10_000,
       scrollback: 10_000,
       ghostty,
       ghostty,
     })
     })