From 3f3e5c4fcd62b7fb45ff5016ca1db8c161a5f55d Mon Sep 17 00:00:00 2001
From: Vitaly Rtishchev <rtivital@gmail.com>
Date: Sat, 27 Aug 2022 17:56:10 +0300
Subject: [PATCH] [@mantine/prism] Fix copy icon interfering with code (#2171)

---
 src/mantine-prism/src/Prism/Prism.story.tsx | 8 ++++++++
 src/mantine-prism/src/Prism/Prism.styles.ts | 4 ++++
 2 files changed, 12 insertions(+)

diff --git a/src/mantine-prism/src/Prism/Prism.story.tsx b/src/mantine-prism/src/Prism/Prism.story.tsx
index df008422029..db640872af2 100644
--- a/src/mantine-prism/src/Prism/Prism.story.tsx
+++ b/src/mantine-prism/src/Prism/Prism.story.tsx
@@ -46,3 +46,11 @@ export const WithTabs = () => (
     </Prism.Tabs>
   </div>
 );
+
+export const LargeLine = () => (
+  <Prism language="javascript" withLineNumbers>
+    Line that is so large that it will cause overflow Lorem ipsum dolor sit amet consectetur, Line
+    that is so large that it will cause overflow Lorem ipsum dolor sit amet consectetur, Line that
+    is so large that it will cause overflow Lorem ipsum dolor sit amet consectetur,
+  </Prism>
+);
diff --git a/src/mantine-prism/src/Prism/Prism.styles.ts b/src/mantine-prism/src/Prism/Prism.styles.ts
index 7845c54148e..f4fd285bbd6 100644
--- a/src/mantine-prism/src/Prism/Prism.styles.ts
+++ b/src/mantine-prism/src/Prism/Prism.styles.ts
@@ -34,6 +34,10 @@ export default createStyles(
       right: theme.dir === 'ltr' ? theme.spacing.xs : 'unset',
       left: theme.dir === 'rtl' ? theme.spacing.xs : 'unset',
       zIndex: 2,
+
+      '&, &:hover': {
+        backgroundColor: theme.colorScheme === 'dark' ? theme.colors.dark[8] : theme.colors.gray[0],
+      },
     },
 
     line: {