Would like to be able to set portrait and landscape views on the styles object for tablets in Material UI
const styles = theme => ({
root: {
padding: theme.spacing.unit,
[theme.breakpoints.up('md')]: {
backgroundColor: theme.palette.secondary.main
}
}
}
how can i add breakpoints for portrait view and landscape view similar to the traditional media query:
@media screen and (orientation: landscape) {
body {
flex-direction: row;
}
}
@media screen and (orientation: portrait) {
body {
flex-direction: column;
}
}
Just set something like that:
const styles = theme => ({
root: {
padding: theme.spacing.unit,
[`${theme.breakpoints.up('md')} and (orientation: portrait)`]: {
flexDirection: 'column'
}
}
}
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With