fix(ui): add color mode watcher

2026-02-07 07:54:57 -05:00 · 2023-03-12 16:38:50 +11:00
parent f4b7f80d59
commit bbb95dbc5b
3 changed files with 19 additions and 6 deletions
--- a/invokeai/frontend/web/src/features/gallery/components/ImageMetaDataViewer/ImageMetadataViewer.tsx
+++ b/invokeai/frontend/web/src/features/gallery/components/ImageMetaDataViewer/ImageMetadataViewer.tsx
@@ -181,9 +181,11 @@ const ImageMetadataViewer = memo(
          overflow: 'scroll',
          maxHeight: APP_METADATA_HEIGHT,
          height: '100%',
-          zIndex: '10',
          backdropFilter: 'blur(10px)',
-          bg: 'blackAlpha.600',
+          bg: 'whiteAlpha.600',
+          _dark: {
+            bg: 'blackAlpha.600',
+          },
        }}
      >
        <Flex gap={1} direction="column" width="100%">
@@ -449,7 +451,8 @@ const ImageMetadataViewer = memo(
                    borderRadius: 'base',
                    overflowX: 'scroll',
                    wordBreak: 'break-all',
-                    bg: 'whiteAlpha.100',
+                    bg: 'whiteAlpha.200',
+                    _dark: { bg: 'blackAlpha.200' },
                  }}
                >
                  <pre>{metadataJSON}</pre>