Utilizing the Material-UI style to define the class.
Now, I aim to adjust the height based on the browser's width.
Is there a way to dynamically calculate this within makeStyles() or implement a workaround?
This snippet below represents what I am trying to achieve.
const useStyles = makeStyles({
videoContainer:{
height: this.width / 16 * 9 // dynamically calculate height
}
}
const Info = (props) => {
const classes = useStyles();
const { ...rest } = props;
return (
<div class={classes.videoContainer}>
<video src={require("assets/180226.mp4")}
autoPlay muted loop>
</video>
</div>
);
}