From 69b3ad4d2d6c7a23dee6d7724be89a3ea213f5a3 Mon Sep 17 00:00:00 2001 From: Zhou Fang Date: Thu, 9 Dec 2021 16:23:10 -0500 Subject: [PATCH 1/2] Added the footer --- src/main/www/src/components/Portal/Portal.tsx | 58 +++++++++++++++++-- 1 file changed, 54 insertions(+), 4 deletions(-) diff --git a/src/main/www/src/components/Portal/Portal.tsx b/src/main/www/src/components/Portal/Portal.tsx index 1ce15583..577b7ccd 100644 --- a/src/main/www/src/components/Portal/Portal.tsx +++ b/src/main/www/src/components/Portal/Portal.tsx @@ -4,7 +4,7 @@ import { Switch, Route, Redirect } from 'react-router-dom'; import { CircularProgress, Theme } from '@material-ui/core'; import { makeStyles, createStyles } from '@material-ui/core/styles'; import LeftNavBar from './NavBar/LeftNavBar'; -import { LOGIN_FROM_KEY, mainContentBGColor, PERMISSIONS_BASED_ON_ROLES } from '../../Constants/Constants'; +import { iconGray, LOGIN_FROM_KEY, mainContentBGColor, PERMISSIONS_BASED_ON_ROLES } from '../../Constants/Constants'; import Dashboard from './Dashboard/Dashboard'; import AppTopBar from './NavBar/AppTopBar'; import OrgProfile from './OrgProfile/OrgProfiles'; @@ -20,15 +20,16 @@ const useStyles = makeStyles((theme: Theme) => display: 'flex', }, content: { + position: 'relative', flexGrow: 1, - padding: theme.spacing(2.5, 1.5), + padding: theme.spacing(2.5, 1.5, 13.5), backgroundColor: mainContentBGColor, [theme.breakpoints.up('sm')]: { - padding: theme.spacing(2.5), + padding: theme.spacing(2.5, 2.5, 8.5), }, [theme.breakpoints.up('md')]: { marginLeft: theme.spacing(28), - padding: theme.spacing(6.5), + padding: theme.spacing(6.5, 6.5, 11.5), marginTop: theme.spacing(6.5), }, }, @@ -38,6 +39,40 @@ const useStyles = makeStyles((theme: Theme) => justifyContent: 'center', alignItems: 'center', }, + footer: { + position: 'absolute', + fontSize: 12, + color: iconGray, + bottom: 10, + left: 15, + right: 15, + display: 'flex', + flexDirection: 'column', + alignItems: 'center', + [theme.breakpoints.up('sm')]: { + flexDirection: 'row', + alignItems: 'stretch', + justifyContent: 'space-between', + left: 25, + right: 25, + }, + [theme.breakpoints.up('md')]: { + left: 65, + right: 65, + }, + }, + footerLinkContainer: { + display: 'flex', + justifyContent: 'space-between', + marginLeft: theme.spacing(0), + [theme.breakpoints.up('sm')]: { + marginLeft: theme.spacing(2), + }, + width: 280, + '& a': { + color: iconGray, + }, + }, }) ); @@ -88,6 +123,21 @@ export default function MainPortal() { )} + +
+

Copyright © Eclipse Foundation. All Rights Reserved.

+
+ + Privacy Policy + + + Terms of Use + + + Copyright Agent + +
+
); -- GitLab From 4645a5fa9ecb64ccbb630e29d879356303a604a7 Mon Sep 17 00:00:00 2001 From: Zhou Fang Date: Thu, 9 Dec 2021 16:31:46 -0500 Subject: [PATCH 2/2] Made the footer a seperate component --- src/main/www/src/components/Portal/Portal.tsx | 54 ++-------------- .../src/components/Portal/PortalFooter.tsx | 62 +++++++++++++++++++ 2 files changed, 66 insertions(+), 50 deletions(-) create mode 100644 src/main/www/src/components/Portal/PortalFooter.tsx diff --git a/src/main/www/src/components/Portal/Portal.tsx b/src/main/www/src/components/Portal/Portal.tsx index 577b7ccd..5efebcb8 100644 --- a/src/main/www/src/components/Portal/Portal.tsx +++ b/src/main/www/src/components/Portal/Portal.tsx @@ -4,7 +4,7 @@ import { Switch, Route, Redirect } from 'react-router-dom'; import { CircularProgress, Theme } from '@material-ui/core'; import { makeStyles, createStyles } from '@material-ui/core/styles'; import LeftNavBar from './NavBar/LeftNavBar'; -import { iconGray, LOGIN_FROM_KEY, mainContentBGColor, PERMISSIONS_BASED_ON_ROLES } from '../../Constants/Constants'; +import { LOGIN_FROM_KEY, mainContentBGColor, PERMISSIONS_BASED_ON_ROLES } from '../../Constants/Constants'; import Dashboard from './Dashboard/Dashboard'; import AppTopBar from './NavBar/AppTopBar'; import OrgProfile from './OrgProfile/OrgProfiles'; @@ -13,6 +13,7 @@ import { useEffect, useContext, useState } from 'react'; import GlobalContext from '../../Context/GlobalContext'; import { checkPermission } from '../../Utils/portalFunctionHelpers'; import NoAccess from '../ErrorPages/NoAccess'; +import PortalFooter from './PortalFooter'; const useStyles = makeStyles((theme: Theme) => createStyles({ @@ -39,40 +40,6 @@ const useStyles = makeStyles((theme: Theme) => justifyContent: 'center', alignItems: 'center', }, - footer: { - position: 'absolute', - fontSize: 12, - color: iconGray, - bottom: 10, - left: 15, - right: 15, - display: 'flex', - flexDirection: 'column', - alignItems: 'center', - [theme.breakpoints.up('sm')]: { - flexDirection: 'row', - alignItems: 'stretch', - justifyContent: 'space-between', - left: 25, - right: 25, - }, - [theme.breakpoints.up('md')]: { - left: 65, - right: 65, - }, - }, - footerLinkContainer: { - display: 'flex', - justifyContent: 'space-between', - marginLeft: theme.spacing(0), - [theme.breakpoints.up('sm')]: { - marginLeft: theme.spacing(2), - }, - width: 280, - '& a': { - color: iconGray, - }, - }, }) ); @@ -123,21 +90,8 @@ export default function MainPortal() { )} - -
-

Copyright © Eclipse Foundation. All Rights Reserved.

- -
+ + ); diff --git a/src/main/www/src/components/Portal/PortalFooter.tsx b/src/main/www/src/components/Portal/PortalFooter.tsx new file mode 100644 index 00000000..8768b537 --- /dev/null +++ b/src/main/www/src/components/Portal/PortalFooter.tsx @@ -0,0 +1,62 @@ +import { Theme } from '@material-ui/core'; +import { makeStyles, createStyles } from '@material-ui/core/styles'; +import { iconGray } from '../../Constants/Constants'; + +const useStyles = makeStyles((theme: Theme) => + createStyles({ + footer: { + position: 'absolute', + fontSize: 12, + color: iconGray, + bottom: 10, + left: 15, + right: 15, + display: 'flex', + flexDirection: 'column', + alignItems: 'center', + [theme.breakpoints.up('sm')]: { + flexDirection: 'row', + alignItems: 'stretch', + justifyContent: 'space-between', + left: 25, + right: 25, + }, + [theme.breakpoints.up('md')]: { + left: 65, + right: 65, + }, + }, + footerLinkContainer: { + display: 'flex', + justifyContent: 'space-between', + marginLeft: theme.spacing(0), + [theme.breakpoints.up('sm')]: { + marginLeft: theme.spacing(2), + }, + width: 280, + '& a': { + color: iconGray, + }, + }, + }) +); + +export default function PortalFooter() { + const classes = useStyles(); + return ( +
+

Copyright © Eclipse Foundation. All Rights Reserved.

+ +
+ ); +} -- GitLab