twifeur/pages/components/main.tsx
2024-05-24 02:04:48 +02:00

51 lines
1.6 KiB
TypeScript

/** @jsx jsx */
import { PropsWithChildren, jsx, Fragment } from "https://deno.land/x/hono@v4.3.10/middleware.ts"
import { _css } from "../../lib/utils.ts";
export default function Main({ children }: PropsWithChildren) {
return (
<Fragment>
<main style={_css({
width: "100vw",
display: "grid",
placeContent: "center",
})}>
<div style={_css({
width: "100vw",
maxWidth: "1000px",
backgroundColor: "#202020",
borderLeft: "1px solid #444",
borderRight: "1px solid #444",
boxShadow: "0px 0px 10px #0008",
paddingTop: "2rem"
})}>
<div style={_css({
minHeight: "100vh",
padding: "2rem"
})}>
{children}
</div>
</div>
</main>
<footer style={_css({
width: "100vw",
display: "grid",
placeContent: "center",
backgroundColor: "#202020",
borderTop: "1px solid #444",
boxShadow: "0px 0px 10px #0008",
position: "relative",
})}>
<div style={_css({
width: "100vw",
maxWidth: "900px",
display: "flex",
padding: "1rem"
})}>
Footer
</div>
</footer>
</Fragment>
)
}