diff options
-rw-r--r-- | src/pages/FeedPage/FeedPage.tsx | 14 | ||||
-rw-r--r-- | src/pages/Page.tsx | 4 | ||||
-rw-r--r-- | src/pages/ProfilePage/ProfilePage.tsx | 13 |
3 files changed, 23 insertions, 8 deletions
diff --git a/src/pages/FeedPage/FeedPage.tsx b/src/pages/FeedPage/FeedPage.tsx index b591141..8149c8c 100644 --- a/src/pages/FeedPage/FeedPage.tsx +++ b/src/pages/FeedPage/FeedPage.tsx @@ -1,5 +1,6 @@ import React, { useState, useEffect } from 'react'; import { Poll } from 'which-types'; +import { makeStyles } from '@material-ui/core/styles'; import Feed from '../../components/Feed/Feed'; import { get } from '../../requests'; @@ -7,9 +8,17 @@ import PollSubmission from './PollSubmission'; import { useAuth } from '../../hooks/useAuth'; +const useStyles = makeStyles(theme => ({ + root: { + width: theme.spacing(75), + margin: '0 auto' + } +})); + const FeedPage: React.FC = () => { const [polls, setPolls] = useState<Poll[]>([]); const { isAuthenticated } = useAuth(); + const classes = useStyles(); useEffect(() => { get('/feed').then(response => { @@ -23,12 +32,11 @@ const FeedPage: React.FC = () => { setPolls(polls); }; - return ( - <> + <div className={classes.root}> {isAuthenticated() && <PollSubmission addPoll={addPoll} />} <Feed polls={polls} /> - </> + </div> ); }; diff --git a/src/pages/Page.tsx b/src/pages/Page.tsx index 2a09228..24487f3 100644 --- a/src/pages/Page.tsx +++ b/src/pages/Page.tsx @@ -10,9 +10,7 @@ import { useNavigate } from '../hooks/useNavigate'; const useStyles = makeStyles(theme => ({ root: { - width: theme.spacing(75), - marginTop: theme.spacing(15), - margin: '0 auto' + margin: theme.spacing(15, 5, 5, 8) } })); diff --git a/src/pages/ProfilePage/ProfilePage.tsx b/src/pages/ProfilePage/ProfilePage.tsx index b7106bb..4710ae8 100644 --- a/src/pages/ProfilePage/ProfilePage.tsx +++ b/src/pages/ProfilePage/ProfilePage.tsx @@ -1,5 +1,6 @@ import React, { useState, useEffect } from 'react'; import { User, Poll } from 'which-types'; +import { makeStyles } from '@material-ui/core/styles'; import ProfileInfo from './ProfileInfo'; import Feed from '../../components/Feed/Feed'; @@ -8,12 +9,20 @@ import { useAuth } from '../../hooks/useAuth'; import { useNavigate } from '../../hooks/useNavigate'; +const useStyles = makeStyles(theme => ({ + root: { + width: theme.spacing(75), + margin: '0 auto' + } +})); + const ProfilePage: React.FC = () => { const [userInfo, setUserInfo] = useState<User>(); const [polls, setPolls] = useState<Poll[]>([]); const [totalVotes, setTotalVotes] = useState<number>(0); const { page, navigate } = useNavigate(); const { user } = useAuth(); + const classes = useStyles(); useEffect(() => { const id = page?.id || user?._id; @@ -35,7 +44,7 @@ const ProfilePage: React.FC = () => { }, [navigate, page, user]); return ( - <> + <div className={classes.root}> <ProfileInfo userInfo={userInfo} setUserInfo={setUserInfo} @@ -43,7 +52,7 @@ const ProfilePage: React.FC = () => { totalVotes={totalVotes} /> <Feed polls={[...polls]} /> - </> + </div> ); }; |