Add data-darkreader-ignore attrs to prevent dark reader from messing …

…up the styles
thetarnav · Dec 17, 2024 · 0af688e · 0af688e
1 parent 2af318c
commit 0af688e
Show file tree

Hide file tree

Showing 3 changed files with 8 additions and 1 deletion.
diff --git a/.changeset/funny-emus-brush.md b/.changeset/funny-emus-brush.md
@@ -0,0 +1,6 @@
+---
+"@solid-devtools/debugger": patch
+"@solid-devtools/overlay": patch
+---
+
+Add data-darkreader-ignore attrs to prevent dark reader from messing up the styles
diff --git a/packages/debugger/src/locator/element-overlay.tsx b/packages/debugger/src/locator/element-overlay.tsx
@@ -15,7 +15,7 @@ export function createElementsOverlay(selected: Accessor<LocatorComponent[]>) {
     setTimeout(() => {
         runWithOwner(owner, () => (
             <Portal useShadow mount={document.documentElement}>
-                <div>{selected().map(useElementOverlay)}</div>
+                <div data-darkreader-ignore>{selected().map(useElementOverlay)}</div>
             </Portal>
         ))
     }, 1000)

diff --git a/packages/overlay/src/index.tsx b/packages/overlay/src/index.tsx
@@ -71,6 +71,7 @@ const Overlay: s.Component<OverlayOptions> = ({defaultOpen, alwaysOpen, noPaddin
     return (
         <web.Portal useShadow mount={document.documentElement}>
             <div
+                data-darkreader-ignore
                 class="overlay__container"
                 classList={{'no-padding': noPadding}}
                 data-open={isOpen()}