@tutti-os/workbench-surface 0.0.12 → 0.0.13

package/dist/styles/workbench.css

@@ -1194,13 +1194,22 @@
 }
 
 .desktop-dock__separator {
+  --desktop-dock-separator-color: var(--line-1);
   flex: 0 0 auto;
   width: 1px;
   height: var(--desktop-dock-separator-length);
   margin: 0 4px var(--desktop-dock-separator-center-offset);
   align-self: flex-end;
   border-radius: 999px;
-  background: var(--line-1);
+  background: var(--desktop-dock-separator-color);
+}
+
+.desktop-dock__separator[data-wallpaper-tone="dark"] {
+  --desktop-dock-separator-color: rgb(255 255 255 / 15%);
+}
+
+.desktop-dock__separator[data-wallpaper-tone="light"] {
+  --desktop-dock-separator-color: rgb(0 0 0 / 12%);
 }
 
 .desktop-dock[data-dock-placement="left"] .desktop-dock__separator {
@@ -2336,6 +2345,8 @@ body[data-desktop-dock-minimized-stack-open="true"] .desktop-dock {
 }
 
 .workspace-launchpad-dock-icon {
+  --workspace-launchpad-dock-icon-bg: var(--transparency-block);
+  --workspace-launchpad-dock-icon-border: var(--line-1);
   box-sizing: border-box;
   display: grid;
   width: 44px;
@@ -2343,9 +2354,20 @@ body[data-desktop-dock-minimized-stack-open="true"] .desktop-dock {
   grid-template-columns: repeat(2, minmax(0, 1fr));
   gap: 2px;
   padding: 3px;
-  border: 1px solid var(--line-1);
+  border: 1px solid var(--workspace-launchpad-dock-icon-border);
   border-radius: 8px;
-  background: var(--transparency-block);
+  background: var(--workspace-launchpad-dock-icon-bg);
+}
+
+.desktop-dock__slot[data-wallpaper-tone="dark"] .workspace-launchpad-dock-icon {
+  --workspace-launchpad-dock-icon-bg: rgb(255 255 255 / 18%);
+  --workspace-launchpad-dock-icon-border: rgb(255 255 255 / 15%);
+}
+
+.desktop-dock__slot[data-wallpaper-tone="light"]
+  .workspace-launchpad-dock-icon {
+  --workspace-launchpad-dock-icon-bg: rgb(0 0 0 / 10%);
+  --workspace-launchpad-dock-icon-border: rgb(0 0 0 / 10%);
 }
 
 .workspace-launchpad-dock-icon__tile {

package/dist/styles/workbenchStyle.test.ts

@@ -164,12 +164,32 @@ test("dock overflow keeps scroll controls viewport-bound", () => {
   assert.match(css, /\.desktop-dock__slot\s*{[^}]*flex:\s*0 0 auto;/s);
   assert.match(
     css,
-    /\.desktop-dock__separator\s*{[^}]*flex:\s*0 0 auto;[^}]*margin:\s*0 4px var\(--desktop-dock-separator-center-offset\);[^}]*align-self:\s*flex-end;[^}]*background:\s*var\(--line-1\);/s
+    /\.desktop-dock__separator\s*{[^}]*--desktop-dock-separator-color:\s*var\(--line-1\);[^}]*flex:\s*0 0 auto;[^}]*margin:\s*0 4px var\(--desktop-dock-separator-center-offset\);[^}]*align-self:\s*flex-end;[^}]*background:\s*var\(--desktop-dock-separator-color\);/s
+  );
+  assert.match(
+    css,
+    /\.desktop-dock__separator\[data-wallpaper-tone="dark"\]\s*{[^}]*--desktop-dock-separator-color:\s*rgb\(255 255 255 \/ 15%\);/s
+  );
+  assert.match(
+    css,
+    /\.desktop-dock__separator\[data-wallpaper-tone="light"\]\s*{[^}]*--desktop-dock-separator-color:\s*rgb\(0 0 0 \/ 12%\);/s
   );
   assert.match(
     css,
     /\.desktop-dock\[data-dock-placement="left"\]\s+\.desktop-dock__separator\s*{[^}]*align-self:\s*flex-start;[^}]*margin:\s*4px 0 4px var\(--desktop-dock-separator-center-offset\);/s
   );
+  assert.match(
+    css,
+    /\.workspace-launchpad-dock-icon\s*{[^}]*--workspace-launchpad-dock-icon-bg:\s*var\(--transparency-block\);[^}]*--workspace-launchpad-dock-icon-border:\s*var\(--line-1\);[^}]*background:\s*var\(--workspace-launchpad-dock-icon-bg\);/s
+  );
+  assert.match(
+    css,
+    /\.desktop-dock__slot\[data-wallpaper-tone="dark"\]\s+\.workspace-launchpad-dock-icon\s*{[^}]*--workspace-launchpad-dock-icon-bg:\s*rgb\(255 255 255 \/ 18%\);[^}]*--workspace-launchpad-dock-icon-border:\s*rgb\(255 255 255 \/ 15%\);/s
+  );
+  assert.match(
+    css,
+    /\.desktop-dock__slot\[data-wallpaper-tone="light"\]\s+\.workspace-launchpad-dock-icon\s*{[^}]*--workspace-launchpad-dock-icon-bg:\s*rgb\(0 0 0 \/ 10%\);[^}]*--workspace-launchpad-dock-icon-border:\s*rgb\(0 0 0 \/ 10%\);/s
+  );
   assert.match(
     css,
     /\.desktop-dock\[data-scroll-overflow="true"\]:hover\s+\.desktop-dock__scroll-button:not\(:disabled\)/s

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@tutti-os/workbench-surface",
-  "version": "0.0.12",
+  "version": "0.0.13",
   "private": false,
   "type": "module",
   "types": "./dist/index.d.ts",
@@ -34,10 +34,10 @@
     "@tutti-os/config-tsconfig": "0.0.0"
   },
   "dependencies": {
-    "@tutti-os/ui-i18n-runtime": "0.0.12",
-    "@tutti-os/ui-react-hooks": "0.0.12",
-    "@tutti-os/workbench-snapshot": "0.0.12",
-    "@tutti-os/ui-system": "0.0.12"
+    "@tutti-os/ui-i18n-runtime": "0.0.13",
+    "@tutti-os/ui-react-hooks": "0.0.13",
+    "@tutti-os/workbench-snapshot": "0.0.13",
+    "@tutti-os/ui-system": "0.0.13"
   },
   "peerDependencies": {
     "react": "^19.1.0",