Questions tagged [makestyles]
61 questions
0
votes
0 answers
Issue with withStyles after upgrading to new react version
i have been given the task to upgrade my package.json file and make changes in accordance to that to my working react application....when i changed ....i had issues material-ui...and specially with withStyles and makeStyles....and had to install…
sruthi_ys
- 15
- 5
0
votes
0 answers
Css not loading in production build of next.js
My next.js app has root folders app, components, and public along with other files like package.json, package-lock.json, store.js,etc.
app folder has another folder named dashboard which represents a new route /dashboard and some files layout.jsx,…
Abdul Hanan Asif
- 67
- 1
- 1
- 9
0
votes
1 answer
React.JS / Next.JS @material-ui/core/styles bumps into `ERR_UNSUPPORTED_DIR_IMPORT`
import { makeStyles } from '@material-ui/core/styles' hits the following error:
- info Collecting page data ..Error [ERR_UNSUPPORTED_DIR_IMPORT]: Directory import '/usr/src/sellerportal/node_modules/@material-ui/core/styles' is not supported…
Kok How Teh
- 3,298
- 6
- 47
- 85
0
votes
0 answers
makeStyles of MUI not loading after reload in nextjs application
when i start the development server all the styles are properly loaded but gone after reload. I'm using nextJs and this problem is due to SSR of nextJs. I know but can't configure properly and need help. I added _document.js, created emotioncache…
Mohammed faiz Khan
- 29
- 1
- 4
0
votes
0 answers
How to change the color of the Header buttons on FullClaendar using makeStyles on material-ui?
I am new in react and frontend styling. I have FullCalendar component and I need to change the buttons colour and icon.
const classes = useStyles();
return (
Psth
- 250
- 1
- 2
- 11
0
votes
0 answers
Dynamically update css from theme color with makeStyles
Say i have this style for a material ui LinearProgress bar, to apply our own styling to it.
The backgroundColor of MuiLinearProgress-barColorPrimary (filled color of a progress bar) can sometimes be too dark for the text.color thus making the text…
Jeremy
- 1,170
- 9
- 26
0
votes
1 answer
Is there a way to combine these 3 attributes into 1 line of code?
i am using import { makeStyles } from '@mui/styles'
This is my theme typography config
enter image description here
This is file, i want to combine these 3 attributes into 1 line of code.enter image description here
Sorry that my English is not…
Dungnv
- 3
- 2
0
votes
0 answers
jss local rule reference problem in makestyles of material ui
There's a code sandbox here: https://codesandbox.io/s/material-demo-forked-e9ikdu
I would like to style this in a way when the input is focused, the color of the search icon also changes. but my code seems to have problems and i don't have any idea…
0
votes
1 answer
Style only injected when save React/Material UI App.js in debugger
In the following you will see that my makeStyles style is not being picked up properly. I'm trying to figure out why. I've reduced the code to not much more than the App component, and a simple Experiment component rendered from within the App.
One…
David Sargrad
- 121
- 1
- 9
0
votes
1 answer
Change the default position of options in MUI
I am using MUI for UI.
I have some options, given in image below:
It is perfect till now. But I want to move options container to more bottom. (Currently it is set as top: 64px which is default).
I want to set it as top : 100px. After setting, it…
Abhishek kamal
- 432
- 1
- 5
- 13
0
votes
1 answer
MUI - styles by makeStyles are damaged after update MUI and React versions
Using MUI Dropdown inside components library.
running the library inside Storybook it works fine.
consume the component in a different React project, the design is damaged.
Dropdown label has top: 60px, it shouldn't, Menu Item on hover have wrong…
Itay Tur
- 683
- 1
- 15
- 40
0
votes
1 answer
React Button with mui not changing colors correctly
I have code that looks similar to the following
import { Button ) from '@mui/material';
import { makestyles } from '@mui/styles';
const useStyles = makeStyles ({
button: {
cursor: "pointer",
margin: "10px auto 20px auto",
…
user18158184
0
votes
1 answer
makeStyles function is not working in Material UI
Not sure whats going on with the button , whn i apply a class frim makeStyle function it does not apply , but when i apply it diesrly to the button with the styles props it works perfectly , am i doing anything wrong? , note: below is all the…
user18095537
0
votes
1 answer
Writing makeStyle in Material UI
I need to write the following CSS value as a string in a makeStyles function in Material UI, how can it be done?
background: linear-gradient(rgba(0, 0, 0, 0.1), rgba(0, 0, 0, 0.8)),
url(../assets/pexels-pixabay-41949.jpg),
i tried it this way…
user18095537
0
votes
0 answers
How can I use a variable value for class name when using makeStyles?
In my React app, I have a component which takes in some data. Depending on the value of that data, I want to show the component with a different coloured background.
The styles are defined as:
const useStyles = makeStyles((theme) => ({
class1: {
…
Sharon
- 3,471
- 13
- 60
- 93