Mantine Modal not showing

Question

I created a React App using Vite and installed Mantine v6.0.0. When I call the following function to open a Mantine modal the view dims however the modal is not visible.

const openModal = () => modals.openConfirmModal({
    title: 'Please confirm your action',
    children: (
      <Text size="sm">
        This action is so important that you are required to confirm it with a modal. Please click
        one of these buttons to proceed.
      </Text>
    ),
    labels: { confirm: 'Confirm', cancel: 'Cancel' },
    onCancel: () => console.log('Cancel'),
    onConfirm: () => console.log('Confirmed'),
  });

Answer 1

Turns out that the vite react template imported some default styling (index.css) which prevented the modal from showing properly. As soon as I removed the css import which included the following css property the modal worked fine.

body {
  display: flex
}