45 lines
918 B
JavaScript
45 lines
918 B
JavaScript
import { Backdrop, Fade, styled } from "@mui/material";
|
|
import StyledImage from "./StyledImage";
|
|
|
|
const LoadingImage = styled(StyledImage)({
|
|
"@keyframes load": {
|
|
"0%": {
|
|
// opacity: 0,
|
|
transform: "scale(1)",
|
|
},
|
|
"50%": {
|
|
// opacity: 1,
|
|
transform: "scale(2)",
|
|
},
|
|
"100%": {
|
|
// opacity: 0,
|
|
transform: "scale(1)",
|
|
},
|
|
},
|
|
animation: "load 2s infinite",
|
|
});
|
|
|
|
const LoadingHardPage = ({ children, loading }) => {
|
|
return (
|
|
<>
|
|
<Backdrop
|
|
sx={{ bgcolor: "#fff", zIndex: (theme) => theme.zIndex.drawer + 1 }}
|
|
open={loading}
|
|
>
|
|
<Fade in={true}>
|
|
<LoadingImage
|
|
src={"/images/loading.svg"}
|
|
alt="loading marhaba"
|
|
priority
|
|
width={100}
|
|
height={100}
|
|
/>
|
|
</Fade>
|
|
</Backdrop>
|
|
{children}
|
|
</>
|
|
);
|
|
};
|
|
|
|
export default LoadingHardPage;
|