Given the following React MUI V5 sample code, I am setting up a profile page where I have the details of a person to the left of the page that is represented with a label/value down the lefthand side of…
I'm using mui datagrid component in my react project and want to add filters of '>' and '<'. I couldn't figure out from the documentation. Is there a prop in DataGrid for this? P.S. I am new to material ui…
I have a simple page that has two parts: a label that displays 50% of the time after a page load, and a 'Roll' button that simulates the result of rolling a six sided die. Both of these parts use…
I would like to have the App bar at the top with 'hamburger' on the left, when the hamburger is clicked , Sidenav (drawer) should appear. I am using React Material and Next.js (App router). The app bar and the…
I'm using rollup to bundle a ui library (to use it in several main apps). but in bundled esm file I have these imports, which are not acceptable to webpack in main apps: import { ArrowDropDownCircleOutlined } from '@mui/icons-material/index'; import…
const pages = ['home', 'menu', 'reservation']; <Box sx={{ flexGrow: 1, display: { xs: 'none', md: 'flex' } }}> {pages.map((page) => ( <Link component={Link} to='/'>Home</Link> ))} </Box> I tried watching one or two videos on how to use Routing in MUI,…
I don't know why the Drawer component does not obey the styling rules I specified. I.e., its width it not 17rem, on the one hand, and, I don't know why it exceeds its parent component borders, on the other hand.…
I tried to change the font weight for the buttons within a navbar, but I don't know why does it go wrong every time. Firstly, I created a separate css file where I tried to set the font weight to…
default padding of mat-button's, i need to subscribe the default padding (16px) I've been trying to set the padding of a mat-button, but the component's style isn't changing. What can I do, I've already tried changing CSS properties, but none…
I am using react-hook-form with MUI components. To use the Select component, I have wrapped it in the Controller as it can't be registered directly. Everything is working but setValue. Here is the Code: const { register, control, handleSubmit, setValue,…