quickabdest/components/Home.js

78 lines
2 KiB
JavaScript
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

import {
CssBaseline,
Dialog,
DialogContent,
DialogTitle,
Grid,
Paper as MuiPaper,
Typography,
} from "@mui/material";
import NavMenu from "./Menu.js";
import { useRoutes } from "react-router-dom/dist";
import { routes } from "../routes";
import React from "react";
import styled from "@emotion/styled";
import { spacing } from "@mui/system";
import "./pages/Texts.css";
import { useDetectAdBlock } from "adblock-detect-react";
import BlockIcon from "@mui/icons-material/Block";
// import Social from "./Social";
const Paper = styled(MuiPaper)(spacing);
const AppContent = styled.div`
flex: 1;
display: flex;
flex-direction: column;
max-width: 100%;
`;
const MainContent = styled(Paper)`
flex: 1;
background: ${(props) => props.theme.palette.background.default};
margin: 20px 20px;
@media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {
flex: none;
}
.MuiPaper-root .MuiPaper-root {
box-shadow: none;
}
`;
export default function Home() {
const content = useRoutes(routes);
const adBlockDetected = useDetectAdBlock();
return (
<React.Fragment>
<CssBaseline />
<AppContent>
<NavMenu />
{/* <Social /> */}
<Grid
item
sx={{
marginLeft: { xs: 0, lg: 45 },
marginRight: { xs: 0, lg: 45 },
overflow: "hidden",
}}>
<Dialog open={adBlockDetected}>
<DialogTitle align="center">
<Typography variant="h1">
<BlockIcon color="error" />
Reklam Engelleyici Tespit Edildi!
<BlockIcon color="error" />
</Typography>
</DialogTitle>
<DialogContent>
<Typography variant="h4" align="center">
Lütfen reklam engelleyicinizi kapatıp sayfayı yenileyin.
</Typography>
</DialogContent>
</Dialog>
<MainContent>{content}</MainContent>
</Grid>
</AppContent>
</React.Fragment>
);
}