mirror of
https://github.com/Qortal/qapp-core.git
synced 2025-06-19 11:11:20 +00:00
44 lines
956 B
TypeScript
44 lines
956 B
TypeScript
import { styled } from "@mui/system";
|
|
import { Box } from "@mui/material";
|
|
|
|
export const VideoContainer = styled(Box)(({ theme }) => ({
|
|
position: "relative",
|
|
display: "flex",
|
|
flexDirection: "column",
|
|
alignItems: "center",
|
|
justifyContent: "center",
|
|
width: "100%",
|
|
height: "100%",
|
|
margin: 0,
|
|
padding: 0,
|
|
borderRadius: '12px',
|
|
overflow: 'hidden',
|
|
"&:focus": { outline: "none" },
|
|
}));
|
|
|
|
export const VideoElement = styled("video")(({ theme }) => ({
|
|
position: 'absolute',
|
|
top: 0,
|
|
bottom: 0,
|
|
right: 0,
|
|
left: 0,
|
|
background: "rgb(33, 33, 33)",
|
|
"&:focus": { outline: "none" },
|
|
"&::-webkit-media-controls": {
|
|
display:"none !important"
|
|
},
|
|
"&:fullscreen": {
|
|
paddingBottom: '50px'
|
|
}
|
|
}));
|
|
//1075 x 604
|
|
export const ControlsContainer = styled(Box)`
|
|
width: 100%;
|
|
position: absolute;
|
|
bottom: 0;
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: space-between;
|
|
background-image: linear-gradient(0deg,#000,#0000);
|
|
`;
|