From 7db0a7fad0fb3484c70b1c6ab4752cb05422ef6c Mon Sep 17 00:00:00 2001
From: Moritz Heckmann <moritz.heckmann@datavisyn.io>
Date: Thu, 28 Sep 2023 13:39:24 +0200
Subject: [PATCH] added subselector

---
 src/app/constants.tsx        |  2 --
 src/vis/hexbin/HexbinVis.tsx | 20 ++++++++------------
 src/vis/hexbin/Hexplot.tsx   | 16 ++++------------
 3 files changed, 12 insertions(+), 26 deletions(-)

diff --git a/src/app/constants.tsx b/src/app/constants.tsx
index f6fa5fef3..ec12b46df 100644
--- a/src/app/constants.tsx
+++ b/src/app/constants.tsx
@@ -1,8 +1,6 @@
 import { MantineProviderProps } from '@mantine/core';
 
 export const DEFAULT_MANTINE_PROVIDER_PROPS: Omit<MantineProviderProps, 'children'> = {
-  withNormalizeCSS: true,
-  withGlobalStyles: true,
   theme: {
     fontFamily: 'Roboto, sans-serif',
     headings: {
diff --git a/src/vis/hexbin/HexbinVis.tsx b/src/vis/hexbin/HexbinVis.tsx
index bad0ee1fe..cff911f5a 100644
--- a/src/vis/hexbin/HexbinVis.tsx
+++ b/src/vis/hexbin/HexbinVis.tsx
@@ -1,19 +1,15 @@
-import * as React from 'react';
-import uniqueId from 'lodash/uniqueId';
+import { Center, Group, SimpleGrid, Stack } from '@mantine/core';
 import merge from 'lodash/merge';
-import { useEffect, useMemo, useRef, useState } from 'react';
-import { ActionIcon, Center, Container, Group, SimpleGrid, Stack, Tooltip } from '@mantine/core';
-import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
-import { faGear } from '@fortawesome/free-solid-svg-icons/faGear';
-import { VisColumn, IVisConfig, IHexbinConfig, EScatterSelectSettings } from '../interfaces';
-import { InvalidCols } from '../general';
+import * as React from 'react';
+import { useMemo, useRef } from 'react';
 import { i18n } from '../../i18n';
-import { Hexplot } from './Hexplot';
-import { HexbinVisSidebar } from './HexbinVisSidebar';
+import { VisSidebarOpenButton } from '../VisSidebarOpenButton';
 import { VisSidebarWrapper } from '../VisSidebarWrapper';
+import { InvalidCols } from '../general';
+import { EScatterSelectSettings, IHexbinConfig, IVisConfig, VisColumn } from '../interfaces';
 import { BrushOptionButtons } from '../sidebar';
-import { useSyncedRef } from '../../hooks/useSyncedRef';
-import { VisSidebarOpenButton } from '../VisSidebarOpenButton';
+import { HexbinVisSidebar } from './HexbinVisSidebar';
+import { Hexplot } from './Hexplot';
 
 const defaultExtensions = {
   prePlot: null,
diff --git a/src/vis/hexbin/Hexplot.tsx b/src/vis/hexbin/Hexplot.tsx
index 5d69dde69..dc0e625d3 100644
--- a/src/vis/hexbin/Hexplot.tsx
+++ b/src/vis/hexbin/Hexplot.tsx
@@ -12,6 +12,9 @@ import { SingleHex } from './SingleHex';
 import { getHexData } from './utils';
 import { XAxis } from './XAxis';
 import { YAxis } from './YAxis';
+import classes from './Hexplot.module.css';
+
+console.log(classes);
 
 interface HexagonalBinProps {
   config: IHexbinConfig;
@@ -382,18 +385,7 @@ export function Hexplot({ config, columns, selectionCallback = () => null, selec
 
   return (
     <Box style={{ height: '100%', width: '100%', position: 'relative' }} ref={ref}>
-      <Container
-        fluid
-        pl={0}
-        pr={0}
-        style={{
-          height: height + margin.top + margin.bottom,
-          width: '100%',
-          '.overlay': {
-            cursor: 'default !important',
-          },
-        }}
-      >
+      <Container fluid pl={0} pr={0} className={`${classes.overlay} ${classes.hexplot}`} style={{ height: height + margin.top + margin.bottom }}>
         <svg id={id} width={width + margin.left + margin.right} height={height + margin.top + margin.bottom}>
           <defs>
             <clipPath id="clip">