Mantine UI
How to customize button padding in Mantine UI Button component. Mantine UI core button padding customization code. styles={{ root: { padding: 5, margin: 0,...
Read more »
Align Left the contents in a button like icon, button text in mantine UI. Customizing Mantine button styles styles={{ inner: { justifyContent: 'flex-start' }...
Read more »
Notify data update with notification - Mantine UI loader and then success or failure message notification with icons. Mantine Notification Loader icon and success...
Read more »
How to give custom css for mobile devices using mantine UI, React JS app example. import { useMediaQuery } from '@mantine/hooks'; function SelectLang({ languages,...
Read more »
Search Box made with mantine ui code, Search Box and Share Button <Group> <Input icon={<IconSearch size={16} />} variant="filled" placeholder="Search responses" radius="xl" size="sm" styles={(theme) =>...
Read more »
Loading icon in Mantine ui with react js const loaderStyle: React.CSSProperties = { position: 'fixed' as 'fixed', left: '50%', top: '50%', transform: 'translate(-50%, -50%)',...
Read more »
Display error notifications with icon, title, and error message in your React JS App using Mantine ui notifications. Sample Mantine UI error notification code...
Read more »
Mantine Ui notification with success check mark import { IconCheck } from "@tabler/icons-react"; import { notifications } from "@mantine/notifications"; notifications.show({ id: 'load-data', color: 'teal',...
Read more »
Fix or solution for not working of onBlur and onChange in Mantine UI forms. How to trigger onBlur, onChange in mantine UI for field...
Read more »
How to use theme colors in mantine UI for styling in css, custom styles borderColor: theme.colors.yellow[6], Full Example import { createStyles } from '@mantine/core';...
Read more »