Skip to content

Commit

Permalink
feat: #120 adds footer to all pages
Browse files Browse the repository at this point in the history
  • Loading branch information
redet-G committed Nov 20, 2024
1 parent b0998f7 commit bb8f189
Show file tree
Hide file tree
Showing 4 changed files with 230 additions and 21 deletions.
Binary file added public/moh.png
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
23 changes: 3 additions & 20 deletions src/Components/Dashboard.js
Original file line number Diff line number Diff line change
Expand Up @@ -19,24 +19,7 @@ import Chart from "./Chart";
import SecondaryListItems from "./SecondaryListItems";
import ReactGA from "react-ga4";
// import MapChart from "./MapChart";

function Copyright(props) {
return (
<Typography
variant="body2"
color="text.secondary"
align="center"
{...props}
>
{"Copyright © "}
<Link color="inherit" href="https://habtechsolution.com/">
HABTech Solution
</Link>{" "}
{new Date().getFullYear()}
{"."}
</Typography>
);
}
import Footer from "./Footer";

const drawerWidth = 240;

Expand Down Expand Up @@ -203,7 +186,7 @@ export default function Dashboard() {
}}
>
<Toolbar />
<Container maxWidth="lg" sx={{ mt: 4, mb: 4 }}>
<Container maxWidth="lg" sx={{ mt: 4, mb: 4, minHeight: "80vh" }}>
<Grid container spacing={3}>
{/* Chart */}
<Chart
Expand All @@ -213,8 +196,8 @@ export default function Dashboard() {
setSelectedSavedChart={setSelectedSavedChart}
/>
</Grid>
<Copyright sx={{ pt: 4 }} />
</Container>
<Footer></Footer>
</Box>
</Box>
</ThemeProvider>
Expand Down
224 changes: 224 additions & 0 deletions src/Components/Footer.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,224 @@
import {
Grid,
Link,
Typography,
Box,
Container,
IconButton,
} from "@mui/material";

import {
Facebook,
Twitter,
Instagram,
LinkedIn,
YouTube,
} from "@mui/icons-material";

function Copyright(props) {
return (
<Typography variant="body2" align="center" {...props}>
Copyright © {new Date().getFullYear()}{" "}
<Link color="inherit" href="https://habtechsolution.com/">
HABTech Solution
</Link>{" "}
{"."} All rights reserved.
</Typography>
);
}

function Footer1() {
return (
<Grid container sx={{ my: 8 }}>
<Grid
lg="6"
xs={12}
sx={{
textAlign: "center",
pt: 4,
}}
>
<Grid
item
sx={{
textAlign: "center",
}}
>
<Copyright />
</Grid>
</Grid>
<Grid
container
spacing={2}
justifyContent="center"
sx={{
textAlign: "center",
pt: 4,
}}
color="text.secondary"
lg="6"
>
<Grid item xs={12} sm={4} md={2}>
<Link
color="text.secondary"
href="https://moh.gov.et"
underline="none"
>
Home
</Link>
</Grid>
<Grid item xs={12} sm={4} md={2}>
<Link href="http://ermp.moh.gov.et" underline="none" color="inherit">
ERMP
</Link>
</Grid>
<Grid item xs={12} sm={4} md={2}>
<Link href="http://pts.moh.gov.et" underline="none" color="inherit">
PTS
</Link>
</Grid>
<Grid item xs={12} sm={4} md={2}>
<Link href="https://cpd.moh.gov.et" underline="none" color="inherit">
CPD
</Link>
</Grid>
<Grid item xs={12} sm={4} md={2}>
<Link
href="http://196.188.120.145:8000"
underline="none"
color="inherit"
>
LIPH
</Link>
</Grid>
<Grid item xs={12} sm={4} md={2}>
<Link href="/en/contact" underline="none" color="inherit">
Contact
</Link>
</Grid>
</Grid>
</Grid>
);
}

function Footer2() {
return (
<Box
component="footer"
sx={{ bgcolor: "primary.main", color: "white", py: 6, mt: 8 }}
>
<Container>
<Grid container spacing={4}>
<Grid item xs={12} md={4}>
<Typography variant="h6" gutterBottom>
<img src="./moh.png" alt="moh logo" width="100%" />
</Typography>
<Typography variant="body2">
Our Vision is to see Healthy, Productive, and Prosperous Citizens
of Ethiopia.
</Typography>
</Grid>
<Grid item xs={12} md={4}>
<Typography variant="h6" gutterBottom>
Quick Links
</Typography>
<Typography variant="body2" component="div">
<Box component="span" sx={{ display: "block", mb: 1 }}>
<Link
color="inherit"
href="https://moh.gov.et"
underline="none"
>
Home
</Link>
</Box>
<Box component="span" sx={{ display: "block", mb: 1 }}>
<Link
href="http://ermp.moh.gov.et"
underline="none"
color="inherit"
>
ERMP
</Link>
</Box>
<Box component="span" sx={{ display: "block", mb: 1 }}>
<Link
href="http://pts.moh.gov.et"
underline="none"
color="inherit"
>
PTS
</Link>
</Box>
<Box component="span" sx={{ display: "block", mb: 1 }}>
<Link
href="https://cpd.moh.gov.et"
underline="none"
color="inherit"
>
CPD
</Link>
</Box>
<Box component="span" sx={{ display: "block", mb: 1 }}>
<Link
href="http://196.188.120.145:8000"
underline="none"
color="inherit"
>
LIPH
</Link>
</Box>
</Typography>
</Grid>
<Grid item xs={12} md={4}>
<Typography variant="h6" gutterBottom>
Connect With Us
</Typography>
<Box justifyContent="center" gap={2}>
<Box component="span" sx={{ display: "block" }}>
<Link
href="https://www.facebook.com/EthiopiaFMoH"
underline="none"
color="inherit"
>
<IconButton color="inherit" aria-label="Facebook">
<Facebook />
</IconButton>
</Link>
</Box>
<Box component="span" sx={{ display: "block" }}>
<Link
href="https://twitter.com/fmohealth"
underline="none"
color="inherit"
>
<IconButton color="inherit" aria-label="Twitter">
<Twitter />
</IconButton>
</Link>
</Box>
<Box component="span" sx={{ display: "block" }}>
<Link
href="https://www.youtube.com/@FMoHealthEthiopia"
underline="none"
color="inherit"
>
<IconButton color="inherit" aria-label="YouTube">
<YouTube />
</IconButton>
</Link>
</Box>
</Box>
</Grid>
</Grid>
<Typography variant="body2" align="center" sx={{ mt: 4 }}>
<Copyright />
</Typography>
</Container>
</Box>
);
}

export default function Footer() {
return <Footer2 />;
}
4 changes: 3 additions & 1 deletion src/Components/RequestForm.js
Original file line number Diff line number Diff line change
Expand Up @@ -27,6 +27,7 @@ import { mainListItems } from "./listItems";
import Chart from "./Chart";
import SecondaryListItems from "./SecondaryListItems";
import ReactGA from "react-ga4";
import Footer from "./Footer";

function Copyright(props) {
return (
Expand Down Expand Up @@ -216,7 +217,6 @@ export default function RequestForm() {
flexGrow: 1,
height: "100vh",
overflow: "auto",
pl: 4,
}}
>
<Container maxWidth="lg" sx={{ mt: 4, mb: 4, p: 4 }}>
Expand Down Expand Up @@ -330,6 +330,8 @@ export default function RequestForm() {
</Grid>
)}
</Container>

<Footer></Footer>
</Box>
</Box>
</ThemeProvider>
Expand Down

0 comments on commit bb8f189

Please sign in to comment.