diff --git a/public/favicon.ico b/public/favicon.ico
index a11777cc471a4344702741ab1c8a588998b1311a..19c92e84519a11e9d493f07ae326f694944f171d 100644
Binary files a/public/favicon.ico and b/public/favicon.ico differ
diff --git a/public/index.html b/public/index.html
index da89b7acd51ea4364d6ddb9fe30857abaa799f71..98ed4b02a0366c0958b7f27660986dd172e4e1c7 100644
--- a/public/index.html
+++ b/public/index.html
@@ -26,7 +26,7 @@
href="https://fonts.googleapis.com/css?family=Roboto:300,400,500,700&display=swap"
/>
- <title>React App</title>
+ <title>Gitlab data visualization</title>
</head>
<body>
<noscript>You need to enable JavaScript to run this app.</noscript>
diff --git a/src/App.tsx b/src/App.tsx
index dd711f21962d6c1adcb5618aa3077b960f3414ec..98fff5e26f51cd8fda9b2fb2ba7300d680806f04 100644
--- a/src/App.tsx
+++ b/src/App.tsx
@@ -6,7 +6,6 @@ import CommonLogic from './components/CommonLogic/index';
import NavBar from './components/NavBar';
import { OpenSettingsContext } from './helpers/context';
import { themes } from './helpers/themes';
-import BarChartPage from './pages/BarChartPage';
import Home from './pages/Home/index';
import SettingsPage from './pages/SettingsPage/index';
import FeatsVsFixesPage from './pages/FeatsVsFixesPage';
@@ -37,7 +36,7 @@ function App() {
themeName={themeName}
setThemeName={setThemeName}
/>
- <NavBar title="CoolWebsiteName" />
+ <NavBar title="Gitlab data visualization" />
<Router>
<CommonLogic />
<Switch>
@@ -47,9 +46,6 @@ function App() {
<Route exact path={'/commits'}>
<FeatsVsFixesPage />
</Route>
- <Route exact path={'/bar'}>
- <BarChartPage />
- </Route>
<Route exact path={'/timeperissuelabel'}>
<TimePerIssueLabelPage />
</Route>
diff --git a/src/assets/gitlab.png b/src/assets/gitlab.png
new file mode 100644
index 0000000000000000000000000000000000000000..2543972331f90aee7ea7411c2fc8a1af76451d0c
Binary files /dev/null and b/src/assets/gitlab.png differ
diff --git a/src/assets/materialui.png b/src/assets/materialui.png
new file mode 100644
index 0000000000000000000000000000000000000000..ddec58ba3e7849deb77b9ddecca12bf62fc0bc2b
Binary files /dev/null and b/src/assets/materialui.png differ
diff --git a/src/assets/react.png b/src/assets/react.png
new file mode 100644
index 0000000000000000000000000000000000000000..c36b7b8d2c767a4d497ec9a06ddb35c9e65f23d9
Binary files /dev/null and b/src/assets/react.png differ
diff --git a/src/components/NavBar/index.tsx b/src/components/NavBar/index.tsx
index fbd9e2a7de20901ee5a9532aa217d06e22cb6e56..0decf5959d49ee620b503112875922d5a92cb36f 100644
--- a/src/components/NavBar/index.tsx
+++ b/src/components/NavBar/index.tsx
@@ -65,9 +65,6 @@ export default function NavBar(props: MenuProps) {
<Link underline="none" href={'/commits'}>
<MenuItem className={classes.menuItem}>Commits</MenuItem>
</Link>
- <Link underline="none" href={'/bar'}>
- <MenuItem className={classes.menuItem}>Bar</MenuItem>
- </Link>
<Link underline="none" href={'/timeperissuelabel'}>
<MenuItem className={classes.menuItem}>Issue-label</MenuItem>
</Link>
@@ -79,7 +76,6 @@ export default function NavBar(props: MenuProps) {
) : (
<div className={classes.linkContainer}>
<IconLink url={'commits'} title={'Commits'} icon={<ChartPieIcon />} />
- <IconLink url={'bar'} title={'Bar'} icon={<ChartBarIcon />} />
<IconLink url={'timeperissuelabel'} title={'Issue-label'} icon={<ChartBarIcon />} />
<IconLink
title={'settings'}
diff --git a/src/pages/BarChartPage/index.tsx b/src/pages/BarChartPage/index.tsx
deleted file mode 100644
index 3049e246c61e434be069c44530fab340c4523c9e..0000000000000000000000000000000000000000
--- a/src/pages/BarChartPage/index.tsx
+++ /dev/null
@@ -1,16 +0,0 @@
-import PageContainer from '../../components/PageContainer/index';
-import ChartBar from '../../components/ChartBar';
-
-const data = [
- { barValue: 4119626293, barLabel: 'Petter' },
- { barValue: 1012956064, barLabel: 'Ole' },
-];
-
-export default function BarChartPage() {
- return (
- <PageContainer title="BarChart">
- <div>This is Bar Chart</div>
- <ChartBar data={data} title={'Ole og petter'} />
- </PageContainer>
- );
-}
diff --git a/src/pages/Home/index.tsx b/src/pages/Home/index.tsx
index 4dfd468130b691a163251aeb318a510f23403e6a..00e2e68ecf73eda9e6dbf49792ca30b62b3aadf8 100644
--- a/src/pages/Home/index.tsx
+++ b/src/pages/Home/index.tsx
@@ -1,8 +1,28 @@
import PageContainer from '../../components/PageContainer/index';
+import reactLogo from '../../assets/react.png';
+import gitlabLogo from '../../assets/gitlab.png';
+import materialUI from '../../assets/materialui.png';
+import useStyles from './styles';
export default function Home() {
+ const classes = useStyles();
return (
- <PageContainer title="Home">
- <div>This is text</div>
+ <PageContainer title="Intro">
+ <div>
+ In this project we visualize gitlab data about the repository used when developing this
+ website. We use react and material UI for most of the layout, and use devexpress graphs for
+ the base graph components.
+ </div>
+ <div className={classes.imgContainer}>
+ <div>
+ <img src={reactLogo} alt={'react'} />
+ </div>
+ <div>
+ <img src={gitlabLogo} alt={'react'} />
+ </div>
+ <div>
+ <img className={classes.materialUILogo} src={materialUI} alt={'react'} />
+ </div>
+ </div>
</PageContainer>
);
}
diff --git a/src/pages/Home/styles.ts b/src/pages/Home/styles.ts
new file mode 100644
index 0000000000000000000000000000000000000000..ea464229f03cc6498e47af042a6a6bcf43d5cf4d
--- /dev/null
+++ b/src/pages/Home/styles.ts
@@ -0,0 +1,24 @@
+import { createStyles, makeStyles } from '@material-ui/core';
+
+const useStyles = makeStyles(() =>
+ createStyles({
+ imgContainer: {
+ display: 'grid',
+ gridGap: '1rem',
+ gridTemplateColumns: '1fr 1fr 1fr',
+ width: '100%',
+ '& *': {
+ maxWidth: '100%',
+ display: 'flex',
+ justifyContent: 'center',
+ },
+ alignItems: 'center',
+ marginTop: '2rem',
+ },
+ materialUILogo: {
+ maxWidth: '50%',
+ },
+ }),
+);
+
+export default useStyles;