|
@@ -0,0 +1,46 @@
|
|
|
|
+/* eslint-disable import/no-anonymous-default-export */
|
|
|
|
+import React, { useEffect, useState } from "react";
|
|
|
|
+import Menu from "./component/Menu";
|
|
|
|
+import Footer from "./component/Footer";
|
|
|
|
+import "../index.css"
|
|
|
|
+
|
|
|
|
+const Layout = (props) => {
|
|
|
|
+ const { children, } = props;
|
|
|
|
+ const [width, setwidth] = useState();
|
|
|
|
+ useEffect(() => {
|
|
|
|
+ window.addEventListener("orientationchange", handleOrientationChange, true);
|
|
|
|
+ getWidth();
|
|
|
|
+ return () => {
|
|
|
|
+ window.removeEventListener("orientationchange", handleOrientationChange)
|
|
|
|
+ }
|
|
|
|
+ });
|
|
|
|
+ const handleOrientationChange = () => {
|
|
|
|
+ // const height = (document.documentElement.clientHeight - 30) * 1.695 - 29;
|
|
|
|
+ getWidth();
|
|
|
|
+ }
|
|
|
|
+ const getWidth = () => {
|
|
|
|
+ const width = document.documentElement.clientWidth;
|
|
|
|
+ setwidth(width);
|
|
|
|
+ }
|
|
|
|
+ return (
|
|
|
|
+ <Menu>
|
|
|
|
+ <div
|
|
|
|
+ style={{
|
|
|
|
+ position: "absolute",
|
|
|
|
+ top: -40,
|
|
|
|
+ background: "white",
|
|
|
|
+ minHeight: "100vh"
|
|
|
|
+ }}
|
|
|
|
+ >
|
|
|
|
+ <div className="mobile_main" style={{
|
|
|
|
+ width
|
|
|
|
+ }}>
|
|
|
|
+ {children}
|
|
|
|
+ </div>
|
|
|
|
+ <Footer style={{ marginTop: 10 }} />
|
|
|
|
+ </div>
|
|
|
|
+ </Menu>
|
|
|
|
+ );
|
|
|
|
+};
|
|
|
|
+
|
|
|
|
+export default Layout;
|