From dd9586fb7c0cd695ba38faed4c9972f2ff30482a Mon Sep 17 00:00:00 2001
From: Gogades <gogades@gmail.com>
Date: Wed, 21 Oct 2026 18:08:18 -0400
Subject: [PATCH] Boolean intersection and Show common part icon fixes for dark
 and graphite themes

---
 apps/web/src/components/LayerlingEditor.tsx | 6 +++---
 apps/web/src/components/icons.tsx           | 9 ++++++++-
 docs/CHANGELOG.md                           | 2 ++
 3 files changed, 13 insertions(+), 4 deletions(-)

diff --git a/apps/web/src/components/LayerlingEditor.tsx b/apps/web/src/components/LayerlingEditor.tsx
index 0ffe2c78d..add5bcd4d 100644
--- a/apps/web/src/components/LayerlingEditor.tsx
+++ b/apps/web/src/components/LayerlingEditor.tsx
@@ -2,7 +2,7 @@
 
 import { GuideHelpLink } from "@/components/GuideHelpLink";
 import { ShapeMenuPanel } from "@/components/workplane/ShapeMenuPanel";
-import { AlertTriangle, ArrowDownToLine, ArrowUpFromLine, Blend, Check, CircleHelp, Percent, Circle as CircleIcon, CloudUpload, Download, Eye, EyeOff, FilePlus2, FolderOpen, Hexagon as HexagonIcon, Info, ListTree, Pencil, Pentagon as PentagonIcon, Rotate3d, Route as RouteIcon, Search, Square as SquareIcon, Star as StarIcon, Triangle as TriangleIcon, X } from "lucide-react";
+import { AlertTriangle, ArrowDownToLine, ArrowUpFromLine, Check, CircleHelp, Percent, Circle as CircleIcon, CloudUpload, Download, Eye, EyeOff, FilePlus2, FolderOpen, Hexagon as HexagonIcon, Info, ListTree, Pencil, Pentagon as PentagonIcon, Rotate3d, Route as RouteIcon, Search, Square as SquareIcon, Star as StarIcon, Triangle as TriangleIcon, X } from "lucide-react";
 import { ObjectListPanel } from "@/components/workplane/ObjectListPanel";
 import { useCallback, useEffect, useLayoutEffect, useMemo, useRef, useState, type CSSProperties } from "react";
 import { useWheelField } from "@/lib/useWheelField";
@@ -71,7 +71,7 @@ import {
   ToolbarHideSelectedIcon,
   ToolbarHomeIcon,
   ToolbarImportIcon,
-  ToolbarIntersectionIcon,
+  ToolbarIntersectionIcon, ToolbarIntersectPreviewIcon,
   ToolbarKeyboardIcon,
   ToolbarFilletIcon,
   ToolbarHistoryIcon,
@@ -13812,7 +13812,7 @@ function SecondaryToolbar({
     { id: "bundle", label: t("editor.tool.bundle"), icon: ToolbarBundleIcon, action: onBundle, enabled: canGroup },
     { id: "ungroup", label: t("editor.tool.ungroup"), icon: ToolbarUngroupIcon, action: onUngroup, enabled: canUngroup },
     { id: "intersect", label: t("editor.tool.intersect"), icon: ToolbarIntersectionIcon, action: onIntersect, enabled: canIntersect || intersectPreviewActive },
-    { id: "intersect-preview", label: t("editor.tool.intersectPreview"), icon: Blend, action: onIntersectPreview, enabled: canIntersect || intersectPreviewActive, active: intersectPreviewActive },
+    { id: "intersect-preview", label: t("editor.tool.intersectPreview"), icon: ToolbarIntersectPreviewIcon, action: onIntersectPreview, enabled: canIntersect || intersectPreviewActive, active: intersectPreviewActive },
   ];
   const modifyTools = [
     { id: "mirror", label: t("editor.tool.mirror"), icon: ToolbarMirrorIcon, action: onMirror, enabled: canModifySelection, active: mirrorMode },
diff --git a/apps/web/src/components/icons.tsx b/apps/web/src/components/icons.tsx
index b77934ebf..09c3e749c 100644
--- a/apps/web/src/components/icons.tsx
+++ b/apps/web/src/components/icons.tsx
@@ -1,3 +1,4 @@
+import { Blend } from "lucide-react";
 import type { CSSProperties, SVGProps } from "react";
 
 type IconProps = SVGProps<SVGSVGElement>;
@@ -83,7 +84,7 @@ export function ToolbarCaretDownIcon(props: IconProps) {
 
 export function ToolbarIntersectionIcon(props: IconProps) {
   return (
-    <svg viewBox="0 0 48 48" aria-hidden="true" {...props}>
+    <svg viewBox="0 0 48 48" aria-hidden="true" className="toolbar-vector-art-icon" {...props}>
       <circle cx="19" cy="24" r="13" fill="none" stroke="currentColor" strokeWidth="2.4" />
       <circle cx="29" cy="24" r="13" fill="none" stroke="currentColor" strokeWidth="2.4" strokeDasharray="4 3" />
       <path d="M24 11.99A13 13 0 0 1 24 36.01A13 13 0 0 1 24 11.99Z" fill="currentColor" opacity="0.82" />
@@ -91,6 +92,12 @@ export function ToolbarIntersectionIcon(props: IconProps) {
   );
 }
 
+// The class gives it the same disabled dimming as the rest of the ribbon; the
+// bare theme colour alone left it looking live on the dark grounds.
+export function ToolbarIntersectPreviewIcon({ className, ...props }: IconProps) {
+  return <Blend className={["toolbar-vector-art-icon", className].filter(Boolean).join(" ")} {...props} />;
+}
+
 export function ToolbarAlignIcon(props: IconProps) {
   return <ToolbarSpriteIcon rect={{ x: 97.3, y: 46.7, width: 29.1, height: 32.5 }} {...props} />;
 }
diff --git a/docs/CHANGELOG.md b/docs/CHANGELOG.md
index 1c4d8b241..dc01b58ed 100644
--- a/docs/CHANGELOG.md
+++ b/docs/CHANGELOG.md
@@ -6,6 +6,8 @@ code still carries it - so a lower number further down is older, not newer.
 
 ## Unreleased
 
+- **Boolean Intersection and Show common part grey out on the dark grounds:** With fewer than two parts selected the two buttons were disabled but looked live in the dark and graphite themes.
+
 ## 1.99.0
 
 - **Rounded box radii to 0.01 mm (#705):** `normalizeCornerFillet` and `normalizeTopBottomFillet` rounded to a tenth of a millimetre, so a corner fillet of 0.25 mm came back as 0.3 mm. They round to a hundredth now, and the fields (the shape's properties and the defaults in the workspace settings) step by 0.05. The CAD solid reads the same functions, so it follows. Unit test in `roundedBoxGeometry.test.ts` (0.25 stays 0.25, 7.336 becomes 7.34). Reported by @Algotz on GitHub.