Styling a react component - Hemantsaraf08/rollingstones GitHub Wiki

3 ways to style (Remember styles are camelCased here)

1. Inline styling: in html/jsx tags use style key word and put styles in double curly braces Ex.: style={{backgroundColor: white}}
2. Creating a css file and save it as 'filename.module.css' later importing it as style from 'filename.module.css' and using className={style.'className from file'}
3. Styling Material UI comp using classes;

1. import { makeStyles } from '@material-ui/core/styles';
2. define useStyles: const useStyles=makeStyles(()=>({})) with styles applied to required classNames
3. Inside the functional comp initialize useStyles: const classes = useStyles();
4. consume styles using className={classes.'classname as per useStyles'}