Questions tagged [makestyles]
61 questions
1
vote
2 answers
How to override CSS classes made with makeStyles
Note, I'm using MUI 4.12.3. In file A I have this (simplified) besides a functional component. Inside the functional component's return statement I also apply it to a JSX element (not shown). This works well.
const useStyles = makeStyles((t) => ({
…
saner
- 399
- 4
- 13
1
vote
0 answers
Add separations in circular progress material ui
I'm working with a step form that shows that increments 25% with each step crossed. I want to have four separators in between. How can I achieve that
Salman Abbas
- 41
- 6
1
vote
1 answer
property x does not exist on type '(props?: any) => ClassNameMap<"x">'
I have to create the styles based on a param, for that i have done as below.
const useStyles = (isLayoutReadOnly = false) =>
makeStyles((theme: Theme) => {
return {
x: {
margin: theme.spacing(0, 0, 1, 0),
marginLeft:…
Sin
- 1,836
- 2
- 17
- 24
1
vote
1 answer
passing default theme in material UI5
can somebody explain how pass in the defauklt theme in Material UI5
in Material UI6 i use to do it like this
const useStyles = makeStyles((theme) => ({
home: {
display: "flex",
paddingTop: "8rem",
width: "100vw",
height:…
user18095537
1
vote
2 answers
Changing Button Background Color Conditionally in Material UI
i got a button that the its background color suppose to change base on state condition , green color for correct , and red for incorrect , so i just made three different css classes , all have similar attributes except the background color , classes…
user18095537
1
vote
0 answers
makeStyles animations do not work with React and Material UI
I want to animate this text to make it look like it's orbiting the globe. I am using React along with Material UI's makeStyles for the task. However, it doesn't seem to work.
I used two different approaches; as you can see in the code. One is…
Amrovic
- 344
- 5
- 13
1
vote
1 answer
How to disable ripple effect on primary action in react material lists
I was trying to have two action buttons on the left and right end of the list component.
on click of secondary action (right side delete icon) the ripple is limited to the only icon.
on click of primary action(left delete icon) the ripple effect…
Vikas Acharya
- 3,550
- 4
- 19
- 52
1
vote
1 answer
How to make different styles using makeStyles in React JS Material-UI?
I am beginner to React JS and Material UI.
I am trying to make different styles of buttons. For example if the button attribute name= submit,ok,cancel,confirm,alert, those each button's styles should be differ from one another
App.JS
import…
Liam neesan
- 2,282
- 6
- 33
- 72
1
vote
0 answers
MUI makeStyles isn't working on the Card component
I have this component called Product which is based off this example. Here is my component:
Product.tsx:
import useStyles from './useStyles'
const Product: React.FC = () => {
const classes = useStyles();
return (
theProCoder
- 390
- 6
- 21
1
vote
0 answers
Property 'transitions' does not exist on type 'DefaultTheme'
Could you please help me with Material ui with React? Below is my issue
If I do import makeStyles from '@material-ui/core/styles', On loading the application it throws a warning saying...
makeStyles needs to be imported from…
Praveen Kumar
- 11
- 1
1
vote
0 answers
Material-UI makeStyles not implementing the css styles to material ui components
Currently I am trying to make the customize the style of my element among other things but we can start here. I can not seem to use makeStyles properly, not sure if its because there are nested components or what. The line which is not working…
Bratislav Petkovic
- 31
- 4
1
vote
1 answer
Use MaterialUI pseudo-classes selectors with makeStyles
According to the docs, material UI provides certain pseudo-classes when the component is in a certain state, such as selected
I have tried to make use of this pseudo-class
const styles = makeStyles({
tab: {
textTransform: "lowercase",
…
Chris A
- 863
- 1
- 10
- 31
1
vote
1 answer
Selecting second child div while hovering on first child div in makeStyles Material UI
I have a parent div and two child divs, I want to apply CSS to the second child div when I hover on the first child div. This is the structure of the render method.
shishir
- 41
- 4
1
vote
1 answer
Nesting CSS selectors in material-ui?
I can't figure out how to do the simplest thing in CSS using makeStyles from material-ui.
Imagine this super simple example:
Post
Something else…
Wordpressor
- 7,173
- 23
- 69
- 108
1
vote
1 answer
React - Material-UI - Typescript: makeStyles hook gives Invalid Hook Call inside a function component
I really don't understand what am I doing wrong.
I am using the makeStyles hook as described inside the (javascript) documentation, and I am getting this Invalid Hook Call. I am using TypeScript 4.1.2, React 17.0.1 and React Types 17.0.0.
Here is…
Andrei Nechita
- 73
- 7