From 47ba4253eb2cc37307f4244b8f74cff7e2469037 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Rafael=20L=C3=A1szl=C3=B3?= <rlacko99@gmail.com>
Date: Wed, 27 Jan 2021 19:55:54 +0100
Subject: [PATCH] fix footer position
---
src/pages/Page.tsx | 34 ++++++++++++++++------------------
1 file changed, 16 insertions(+), 18 deletions(-)
diff --git a/src/pages/Page.tsx b/src/pages/Page.tsx
index d2204f6..9e48806 100644
--- a/src/pages/Page.tsx
+++ b/src/pages/Page.tsx
@@ -1,30 +1,28 @@
+import { Box, makeStyles } from '@material-ui/core';
import React from 'react';
-import styled from 'styled-components';
import Footer from '../components/Footer';
import Header from '../components/Header';
-const Container = styled.div(
- (props) => `
- height: 100%;
- display: flex;
- flex-direction: column;
- justify-content: space-between;
-
- background-color: ${props.theme.palette.background.default};
-`,
-);
-
-const MainContent = styled.div`
- height: 100%;
-`;
+const useStyles = makeStyles((theme) => ({
+ root: {
+ display: 'flex',
+ flexDirection: 'column',
+ minHeight: '100vh',
+ background: theme.palette.background.default,
+ },
+}));
const Page: React.FC = ({ children }) => {
+ const classes = useStyles();
+
return (
- <Container>
+ <Box className={classes.root}>
<Header />
- <MainContent>{children}</MainContent>
+ <Box flexGrow={1} flexShrink={0} flexBasis="auto">
+ {children}
+ </Box>
<Footer />
- </Container>
+ </Box>
);
};
--
GitLab