Merge branch '8-favicon-title-etc' into 'master'

Resolve "Change favicon, page title, and home page (including picture)" Closes #8 See merge request it2810-h21/team-24/project2-it2810!14

Merge branch '8-favicon-title-etc' into 'master'
0d64e8d9 · Ulrik Røsby · 3be3ec54 · a8461849 · 3be3ec54 · 0d64e8d9
Commit 0d64e8d9 authored 3 years ago by Ulrik Røsby
--- a/public/favicon.ico
+++ b/public/favicon.ico
--- 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>

--- 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>

--- a/src/assets/gitlab.png
+++ b/src/assets/gitlab.png
--- a/src/assets/materialui.png
+++ b/src/assets/materialui.png
--- a/src/assets/react.png
+++ b/src/assets/react.png
--- 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'}

--- a/src/pages/BarChartPage/index.tsx
+++ b/src/pages/BarChartPage/index.tsx
-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>
-  );
-}
--- a/src/pages/Home/index.tsx
+++ b/src/pages/Home/index.tsx
 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>
  );
 }
--- a/src/pages/Home/styles.ts
+++ b/src/pages/Home/styles.ts
+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;