release v0.1.1 with background fix

Author: starsstreaming

README.md

@@ -73,9 +73,9 @@ beautiCode 可以让你：
 > 不是逃离工作，而是给漫长的工作过程，留一点属于自己的空间。
 <img width="1920" height="1240" alt="QQ20260729-212506-HD" src="https://github.com/user-attachments/assets/ca0ef07f-2aec-46b0-b996-1db9913efa6d" />
 
-### v0.1 安装包
+### v0.1.1 安装包
 
-想直接使用 beautiCode，可以下载 [Windows 安装包](https://github.com/starsstreaming/beautiCode/releases/tag/v0.1)。
+想直接使用 beautiCode，可以下载 [Windows 安装包](https://github.com/starsstreaming/beautiCode/releases/tag/v0.1.1)。
 安装包自带运行时，不需要另外安装 Node.js 或 npm；使用前请先安装 Codex Desktop。
 
 
@@ -163,7 +163,7 @@ Ctrl + Shift + Space
 运行：
 
 ```text
-beautiCode-Setup-0.1.0-win-x64.exe
+beautiCode-Setup-0.1.1-win-x64.exe
 ```
 
 安装包自带 Node.js 运行时。使用者不需要安装 Node.js、npm，也不需要保留

installer/windows/beauticode.iss

@@ -4,7 +4,7 @@
 #define MyAppPublisher "beautiCode"
 
 #ifndef MyAppVersion
-  #define MyAppVersion "0.1.0"
+  #define MyAppVersion "0.1.1"
 #endif
 
 #ifndef StageDir

package-lock.json

@@ -1,6 +1,6 @@
 {
   "name": "beauticode",
-  "version": "0.1.0",
+  "version": "0.1.1",
   "private": true,
   "type": "module",
   "description": "Local image/video backgrounds for supported coding hosts. Unofficial.",

package.json

@@ -372,23 +372,23 @@
           '[data-testid*="conversation"]',
           '[data-testid*="thread"]',
           '[data-testid*="turn"]',
-          'main.main-surface [data-message-id]',
+          'body > #root main [data-message-id]',
         ].join(", "),
       );
       if (thread && isVisibleEl(thread)) return true;
 
       // Open task header: folder glyph + title in the main app header
       // (matches the project task chrome in Codex Desktop).
       const header = document.querySelector(
-        "main.main-surface header.app-header-tint, main.main-surface header",
+        "body > #root main header.app-header-tint, body > #root main header",
       );
       if (header && isVisibleEl(header)) {
         const headerText = (header.textContent || "").replace(/\s+/g, " ").trim();
         // Home header is short / generic; task headers carry the task title.
         if (headerText.length >= 2 && !/^(codex|chatgpt|home|首页)?$/i.test(headerText)) {
           // Require composer or main role so empty shells do not false-dim.
           const workSurface = document.querySelector(
-            "main.main-surface .composer-surface-chrome, main.main-surface [role='main'], main.main-surface .thread-scroll-container",
+            "body > #root main .composer-surface-chrome, body > #root main [role='main'], body > #root main .thread-scroll-container",
           );
           if (workSurface && isVisibleEl(workSurface)) return true;
         }

packages/adapter-codex/src/renderer/background-runtime.js

@@ -197,7 +197,7 @@ html[data-bc-active="true"][data-bc-media="video-pending"]
    - Video keeps playing under both columns.
    Implementation: do NOT retouch #beauticode-bg-stage::before or media
    filters on working — those are full-window and would shift the left.
-   Dim only via main.main-surface wash. */
+   Dim only via the primary main surface wash. */
 
 /* ---- Left sidebar: translucent so art shows ---- */
 html[data-bc-active="true"] aside.app-shell-left-panel {
@@ -221,8 +221,9 @@ html[data-bc-active="true"] aside.app-shell-left-panel nav {
 }
 
 /* ---- Main surface ---- */
-html[data-bc-active="true"] main.main-surface {
+html[data-bc-active="true"] body > #root main {
   position: relative !important;
+  background-color: transparent !important;
   background: linear-gradient(
     90deg,
     var(--bc-main-edge),
@@ -236,43 +237,43 @@ html[data-bc-active="true"] main.main-surface {
 
 /* Task page: ONLY the right column. Stage veil + left aside stay as home
    so home ↔ project transition is seamless on the sidebar. */
-html[data-bc-active="true"][data-bc-working="true"] main.main-surface {
+html[data-bc-active="true"][data-bc-working="true"] body > #root main {
   /* Tiny step darker — keep translucent so thread text stays readable. */
   background: var(--bc-working-main) !important;
   transition: background 240ms ease;
 }
 
 /* No secondary art painted on main — stage owns the picture. */
-html[data-bc-active="true"] main.main-surface::before,
-html[data-bc-active="true"] main.main-surface::after {
+html[data-bc-active="true"] body > #root main::before,
+html[data-bc-active="true"] body > #root main::after {
   content: none !important;
   background-image: none !important;
   background: transparent !important;
 }
 
-html[data-bc-active="true"] main.main-surface > header.app-header-tint {
+html[data-bc-active="true"] body > #root main > header.app-header-tint {
   background: transparent !important;
   border-bottom: 0 !important;
   box-shadow: none !important;
   backdrop-filter: none !important;
 }
 
 /* Main content frame / scroll fades that paint opaque tokens. */
-html[data-bc-active="true"] main.main-surface .app-shell-main-content-frame,
-html[data-bc-active="true"] main.main-surface .app-shell-main-content-top-fade {
+html[data-bc-active="true"] body > #root main .app-shell-main-content-frame,
+html[data-bc-active="true"] body > #root main .app-shell-main-content-top-fade {
   background: transparent !important;
   background-image: none !important;
 }
 
-html[data-bc-active="true"] main.main-surface
+html[data-bc-active="true"] body > #root main
   .thread-scroll-container
   .bg-gradient-to-t.from-token-main-surface-primary {
   background-image: none !important;
   background: transparent !important;
 }
 
 /* Home hero card chrome — keep interactive, drop solid fill. */
-html[data-bc-active="true"] main.main-surface
+html[data-bc-active="true"] body > #root main
   [role="main"]:has([data-testid="home-icon"])
   > div:first-child
   > div:first-child
@@ -284,7 +285,7 @@ html[data-bc-active="true"] main.main-surface
   box-shadow: none !important;
 }
 
-html[data-bc-active="true"] main.main-surface
+html[data-bc-active="true"] body > #root main
   [role="main"]:has([data-testid="home-icon"])
   > div:first-child
   > div:first-child
@@ -293,7 +294,7 @@ html[data-bc-active="true"] main.main-surface
 }
 
 /* role=main region itself */
-html[data-bc-active="true"] main.main-surface [role="main"] {
+html[data-bc-active="true"] body > #root main [role="main"] {
   background: transparent !important;
 }
 

packages/adapter-codex/src/renderer/background.css

@@ -725,6 +725,13 @@ test("fish mode CSS and runtime expose data-bc-fish helpers", async () => {
   assert.match(runtime, /applyMutePreference/);
   assert.match(css, /data-bc-tone/);
   assert.match(css, /prefers-color-scheme: light/);
+  // Codex's main-surface class is CSS-module hashed and changes between builds.
+  assert.match(css, /body > #root main/);
+  assert.match(
+    css,
+    /body > #root main \{\s*position:\s*relative !important;\s*background-color:\s*transparent !important;/,
+  );
+  assert.doesNotMatch(css, /main\.main-surface/);
   assert.match(runtime, /setBackgroundTone/);
   assert.match(runtime, /data-bc-tone/);
   assert.match(runtime, /getPlaybackPosition/);