From f82e20c0d41a2e8c59cad62eae1287b5ad736caa Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=EB=A5=98=ED=95=9C=EA=B2=BD?= Date: Sat, 13 Aug 2022 00:45:27 +0900 Subject: [PATCH] [@mantine/core] Button: Fix incorrect overlap between buttons in Button.Group for screens with low resolution (#1979) * [@mantine/core] ButtonGroup: Fix overlap between buttons * fix: add buttonBorderWidth * fix: Change border size based on dpi * fix: Change media query condition * [@mantine/core] Fix incorrect media query Co-authored-by: Vitaly Rtishchev --- .../src/Button/ButtonGroup/ButtonGroup.styles.ts | 7 +++++++ 1 file changed, 7 insertions(+) diff --git a/src/mantine-core/src/Button/ButtonGroup/ButtonGroup.styles.ts b/src/mantine-core/src/Button/ButtonGroup/ButtonGroup.styles.ts index a231352a570..1a8628b23d0 100644 --- a/src/mantine-core/src/Button/ButtonGroup/ButtonGroup.styles.ts +++ b/src/mantine-core/src/Button/ButtonGroup/ButtonGroup.styles.ts @@ -33,6 +33,13 @@ export default createStyles( [orientation === 'vertical' ? 'borderBottomWidth' : 'borderRightWidth']: buttonBorderWidth / 2, }, + + '& + [data-button]': { + [orientation === 'vertical' ? 'marginTop' : 'marginLeft']: -buttonBorderWidth, + '@media (min-resolution: 192dpi)': { + [orientation === 'vertical' ? 'marginTop' : 'marginLeft']: 0, + }, + }, }, }, })