Questions tagged [makestyles]
61 questions
6
votes
1 answer
Gradient border on MUI component
I did not manage to find the equivalent of border-image-source css
My goal is to render a border gradient on a button component
seserize
- 99
- 3
- 8
4
votes
3 answers
Cannot read property 'up' of undefined, material ui, theme.breakpoints
i'm struggling with the export of makeStyles.
below is my code and configuration
import SearchField from "../SearchField";
import { TextField, Select, useMediaQuery, Grid, Button, Box, Fade } from '@material-ui/core';
import React, {useState,…
gregg1234
- 51
- 1
- 3
4
votes
0 answers
Attribute selector in material UI makeStyles
I'm working on a react project and I want to apply CSS based on the position attribute of material UI's Popper element. However, I couldn't find any example which used attribute selector for material UI. I tried the following approach, but it didn't…
Utkarsh Chugh
- 51
- 1
- 5
3
votes
0 answers
How to write a normal css in to material UI makeStyles when overriding a css for npm package
I am currently working on SunEditor-React NPM package. Some of the designs are making my template un-aligned. So I am planning to override the css and only use the needed css.
Currently in my project I am using Material UI makeStyles to style my…
Deepika
- 737
- 7
- 23
2
votes
1 answer
Overriding input class in TextField using makeStyles
When trying to override the padding property in TextField input using MakeStyles, a new class is created called .makeStyles-input which is priorotized under MuiOutlinedInput-root class.
How do I inject a property into the input class (not depending…
Amitai Fensterheim
- 722
- 7
- 22
2
votes
0 answers
How to pass parameter to makeStyles in @fluentui/react-components
I am trying Fluent UI React V9, and try to pass the color style from function component to makeStyles.
Here is my codesandbox:
import { Button, ButtonProps, makeStyles } from "@fluentui/react-components";
import * as React from 'react';
const…
Edward
- 28,296
- 11
- 76
- 121
2
votes
0 answers
Error with MakeStyles when rebuilding a react app
I am migrating my react front that was previously rendered along rails with react-rails to a separate react application build from scratch, when adding a component that makes use of makeStyles I get the following error:
makeStyles.js:156 Uncaught…
Gotey
- 449
- 4
- 15
- 41
2
votes
2 answers
React makeStyle is not working properly and causes other components to disappear
I looked at a tutorial and wrote exact same code in my App.js to create styled button using makeStyles but it didn't work.
whenever I'm using makeStyles it causes other components to disappear. I tried to use it standalone without any other…
muller
- 41
- 8
2
votes
1 answer
makeStyles with TypeScript - pass props to make styles explanation
I'm using Material-UI makeStyles function with TypeScript
I found the solution here on how to do that and it is working:
export interface StyleProps {
md?: any;
}
const useStyles = makeStyles({
button: {
width: ({ md })…
Kareem Abdelwahed
- 186
- 4
- 21
2
votes
1 answer
Material UI makeStyles not changing the css properties of all elements
I've copied this exact chunk of code from the documentation after installing npm install @mui/styles:
import * as React from 'react';
import { makeStyles } from '@mui/styles';
import Button from '@mui/material/Button';
const useStyles =…
Samuel Lawrence
- 253
- 2
- 12
2
votes
1 answer
Material-ui makeStyles with both before and after
I'm working on a project which requires the following CSS code.
.hexagon, .hexagon::before, .hexagon::after {
width: 67px;
height: 116px;
border-radius: 18%/5%;
}
Is there a way to implement the above style using Material-UI makeStyles…
DiWeera98
- 45
- 3
- 10
2
votes
2 answers
Change disabled Material UI checkbox color or background color
The disabled unchecked checkbox look a bit too subtle and I would like to have them have a grey background and for the cursor to be of type not-allowed.
Unfortunately I cannot figure out how to apply these styles on the checkbox using the…
theJuls
- 6,788
- 14
- 73
- 160
2
votes
1 answer
How to pass prop as a className using makeStyles
At first I am new to react. I am trying to make a website using react. I have a functional component with an image and a text content which are in 6 column grids. I need to swap the six columns wherever i needs. I have 2 classes right and left in…
Jane Doe
- 21
- 3
2
votes
0 answers
Theme & Props in makeStyles with TS
Found lots of similar questions but nothing that quite answers this. How do you pass both theme and props to the Material UI makeStyles hook but access them from the outermost closure without TS exploding? Something like this:
type StyleProps = {
…
Jose
- 4,880
- 8
- 27
- 49
2
votes
1 answer
Material-UI makeStyles cannot read property 'down' of undefined
I am working on a personal website using Material-UI and to make it responsive I wanted to hide an image on smaller screens but when I try to use [theme.breakpoints.down('md')], it keeps giving me the error:
TypeError: Cannot read property 'down'…
Himanshu
- 136
- 3
- 11