Hello there, i want to share how to write an attribute with simple responsive using mantine.

simple responsive attribute component support breakpoint property (xs, sm, md, lg, xl), using simple responsive attribute component is by creating an object.

here's the example:

<Text fz={{ base: 32, lg: 48 }} weight={600}> Lorem ipsum dolor </Text>

Following the above there is an attribute called fz that represent font size, each of the breakpoint property active when the width of the viewport is met, property base is use when another property breakpoints (xs, sm, md, lg, xl) are not met.

Now, you can easily set responsive component in mantine.