Last active
April 1, 2024 11:30
-
-
Save adrianhajdin/d99aaa67124f0de7667fd3937715fb26 to your computer and use it in GitHub Desktop.
Memories Initial Styles
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
import { makeStyles } from '@material-ui/core/styles'; | |
export default makeStyles(() => ({ | |
appBar: { | |
borderRadius: 15, | |
margin: '30px 0', | |
display: 'flex', | |
flexDirection: 'row', | |
justifyContent: 'center', | |
alignItems: 'center', | |
}, | |
heading: { | |
color: 'rgba(0,183,255, 1)', | |
}, | |
image: { | |
marginLeft: '15px', | |
}, | |
})); |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
import { makeStyles } from '@material-ui/core/styles'; | |
export default makeStyles((theme) => ({ | |
root: { | |
'& .MuiTextField-root': { | |
margin: theme.spacing(1), | |
}, | |
}, | |
paper: { | |
padding: theme.spacing(2), | |
}, | |
form: { | |
display: 'flex', | |
flexWrap: 'wrap', | |
justifyContent: 'center', | |
}, | |
fileInput: { | |
width: '97%', | |
margin: '10px 0', | |
}, | |
buttonSubmit: { | |
marginBottom: 10, | |
}, | |
})); |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
import { makeStyles } from '@material-ui/core/styles'; | |
export default makeStyles({ | |
media: { | |
height: 0, | |
paddingTop: '56.25%', | |
backgroundColor: 'rgba(0, 0, 0, 0.5)', | |
backgroundBlendMode: 'darken', | |
}, | |
border: { | |
border: 'solid', | |
}, | |
fullHeightCard: { | |
height: '100%', | |
}, | |
card: { | |
display: 'flex', | |
flexDirection: 'column', | |
justifyContent: 'space-between', | |
borderRadius: '15px', | |
height: '100%', | |
position: 'relative', | |
}, | |
overlay: { | |
position: 'absolute', | |
top: '20px', | |
left: '20px', | |
color: 'white', | |
}, | |
overlay2: { | |
position: 'absolute', | |
top: '20px', | |
right: '20px', | |
color: 'white', | |
}, | |
grid: { | |
display: 'flex', | |
}, | |
details: { | |
display: 'flex', | |
justifyContent: 'space-between', | |
margin: '20px', | |
}, | |
title: { | |
padding: '0 16px', | |
}, | |
cardActions: { | |
padding: '0 16px 8px 16px', | |
display: 'flex', | |
justifyContent: 'space-between', | |
}, | |
}); |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
import { makeStyles } from '@material-ui/core/styles'; | |
export default makeStyles((theme) => ({ | |
mainContainer: { | |
display: 'flex', | |
alignItems: 'center', | |
}, | |
smMargin: { | |
margin: theme.spacing(1), | |
}, | |
actionDiv: { | |
textAlign: 'center', | |
}, | |
})); |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
new version of mui do not support this, you can use "sx"
they said you should use mui system (npm install @mui/system @emotion/react @emotion/styled), but it works with npm install @mui/material @emotion/react @emotion/styled for me