Merge pull request #237 from beNative/codex/add-left-border-with-padding-on-snippet-containers-x0p358

Use theme background color directly for snippet highlights

Author: beNative

components/FolderOverview.tsx

@@ -367,7 +367,7 @@ const FolderOverview: React.FC<FolderOverviewProps> = ({
                                                                             borderLeftWidth: '3px',
                                                                             borderLeftStyle: 'solid',
                                                                             borderLeftColor: 'rgb(var(--color-accent) / 0.45)',
-                                                                            background: 'color-mix(in srgb, rgb(var(--color-background)) 82%, rgb(var(--color-text-main)) 18%)',
+                                                                            background: 'rgb(var(--color-background))',
                                                                             borderRadius: '4px',
                                                                         }}
                                                                     >

components/PromptTreeItem.tsx

@@ -356,8 +356,7 @@ const DocumentTreeItem: React.FC<DocumentTreeItemProps> = (props) => {
   const snippetAccentWidth = 3;
   const snippetMarginLeft = Math.max(snippetPaddingLeft - snippetAccentPadding, 0);
   const snippetAccentColor = 'rgb(var(--color-accent) / 0.45)';
-  const snippetBackgroundColor =
-    'color-mix(in srgb, rgb(var(--color-background)) 82%, rgb(var(--color-text-main)) 18%)';
+  const snippetBackgroundColor = 'rgb(var(--color-background))';
 
   return (
     <li