diff --git a/.prettierignore b/.prettierignore
index 58d06c3..b4770e9 100644
--- a/.prettierignore
+++ b/.prettierignore
@@ -2,3 +2,4 @@
 package.json
 package-lock.json
 public
+node_modules
\ No newline at end of file
diff --git a/.prettierrc b/.prettierrc
index 33d2cfa..0c06006 100644
--- a/.prettierrc
+++ b/.prettierrc
@@ -1,4 +1,5 @@
 {
   "arrowParens": "avoid",
-  "semi": false
+  "semi": true,
+  "singleQuote": true
 }
diff --git a/gatsby-browser.js b/gatsby-browser.js
index cc1bda7..01e21b7 100644
--- a/gatsby-browser.js
+++ b/gatsby-browser.js
@@ -1 +1 @@
-import "@kichiyaki/roboto"
+import '@kichiyaki/roboto';
diff --git a/gatsby-config.js b/gatsby-config.js
index e602b7d..b118e5f 100644
--- a/gatsby-config.js
+++ b/gatsby-config.js
@@ -1,11 +1,11 @@
-const siteUrl = "https://dwysokinski.me"
+const siteUrl = 'https://dwysokinski.me';
 
 module.exports = {
   siteMetadata: {
     title: `Dawid Wysokiński | Full Stack Web Developer`,
     description: `Dawid Wysokiński - Full Stack Web Developer | Back End Developer | Front End Developer`,
     authorTwitter: `@Dawid56143781`,
-    authorFullName: "Dawid Wysokiński",
+    authorFullName: 'Dawid Wysokiński',
     siteUrl,
   },
   plugins: [
@@ -39,16 +39,16 @@ module.exports = {
     },
     `gatsby-plugin-sitemap`,
     {
-      resolve: "gatsby-plugin-robots-txt",
+      resolve: 'gatsby-plugin-robots-txt',
       options: {
         host: siteUrl,
-        sitemap: siteUrl + "/sitemap.xml",
+        sitemap: siteUrl + '/sitemap.xml',
         env: {
           development: {
-            policy: [{ userAgent: "*", disallow: ["/"] }],
+            policy: [{ userAgent: '*', disallow: ['/'] }],
           },
           production: {
-            policy: [{ userAgent: "*", allow: "/" }],
+            policy: [{ userAgent: '*', allow: '/' }],
           },
         },
       },
@@ -57,4 +57,4 @@ module.exports = {
     // To learn more, visit: https://gatsby.dev/offline
     // `gatsby-plugin-offline`,
   ],
-}
+};
diff --git a/src/components/Layout/Footer.js b/src/components/Layout/Footer.js
index 2c9b32d..0c1872f 100644
--- a/src/components/Layout/Footer.js
+++ b/src/components/Layout/Footer.js
@@ -1,26 +1,26 @@
-import React from "react"
+import React from 'react';
 
-import { makeStyles } from "@material-ui/core/styles"
-import { Typography } from "@material-ui/core"
-import Section from "@components/Section"
+import { makeStyles } from '@material-ui/core/styles';
+import { Typography } from '@material-ui/core';
+import Section from '@components/Section';
 
 const useStyles = makeStyles(theme => {
   return {
     footer: {
-      padding: "1.5rem 0",
+      padding: '1.5rem 0',
     },
-  }
-})
+  };
+});
 
 function Footer() {
-  const classes = useStyles()
+  const classes = useStyles();
   return (
     <Section component="footer" className={classes.footer}>
       <Typography align="center" variant="h6">
         © {new Date().getFullYear()} Dawid Wysokiński
       </Typography>
     </Section>
-  )
+  );
 }
 
-export default Footer
+export default Footer;
diff --git a/src/components/Layout/Layout.js b/src/components/Layout/Layout.js
index 794eb3f..3acc8dc 100644
--- a/src/components/Layout/Layout.js
+++ b/src/components/Layout/Layout.js
@@ -1,19 +1,19 @@
-import React, { Fragment } from "react"
-import PropTypes from "prop-types"
-import classnames from "classnames"
+import React, { Fragment } from 'react';
+import PropTypes from 'prop-types';
+import classnames from 'classnames';
 
-import { makeStyles } from "@material-ui/core/styles"
-import { CssBaseline } from "@material-ui/core"
-import Navbar from "./Navbar"
-import Footer from "./Footer"
+import { makeStyles } from '@material-ui/core/styles';
+import { CssBaseline } from '@material-ui/core';
+import Navbar from './Navbar';
+import Footer from './Footer';
 
 const useStyles = makeStyles(theme => ({
   main: {
-    minHeight: "calc(100vh - 200px)",
+    minHeight: 'calc(100vh - 200px)',
     paddingTop: theme.spacing(2),
     paddingBottom: theme.spacing(3),
   },
-}))
+}));
 
 const Layout = ({
   children,
@@ -22,7 +22,7 @@ const Layout = ({
   showNavbar,
   showFooter,
 }) => {
-  const classes = useStyles()
+  const classes = useStyles();
 
   return (
     <Fragment>
@@ -31,19 +31,19 @@ const Layout = ({
       {showFooter && <Footer />}
       <CssBaseline />
     </Fragment>
-  )
-}
+  );
+};
 
 Layout.defaultProps = {
   navbarProps: {},
   showNavbar: true,
   showFooter: true,
-}
+};
 
 Layout.propTypes = {
   children: PropTypes.node.isRequired,
   showNavbar: PropTypes.bool.isRequired,
   showFooter: PropTypes.bool.isRequired,
-}
+};
 
-export default Layout
+export default Layout;
diff --git a/src/components/Layout/Navbar.js b/src/components/Layout/Navbar.js
index 8519a51..21356d1 100644
--- a/src/components/Layout/Navbar.js
+++ b/src/components/Layout/Navbar.js
@@ -1,19 +1,19 @@
-import React from "react"
-import classnames from "classnames"
-import * as routes from "@config/routes"
-import useSmoothScroll from "@libs/useSmoothScroll"
-import logo from "@images/logo.svg"
-import { HEADER_ID } from "@features/HomePage/components/Header"
-import { SECTION_ID as PORTFOLIO_SECTION_ID } from "@features/HomePage/components/Portfolio/Portfolio"
-import { SECTION_ID as CONTACT_SECTION_ID } from "@features/HomePage/components/Contact"
+import React from 'react';
+import classnames from 'classnames';
+import * as routes from '@config/routes';
+import useSmoothScroll from '@libs/useSmoothScroll';
+import logo from '@images/logo.svg';
+import { HEADER_ID } from '@features/HomePage/components/Header';
+import { SECTION_ID as PORTFOLIO_SECTION_ID } from '@features/HomePage/components/Portfolio/Portfolio';
+import { SECTION_ID as CONTACT_SECTION_ID } from '@features/HomePage/components/Contact';
 
-import { makeStyles } from "@material-ui/core/styles"
-import { AppBar, Toolbar, Container, Link } from "@material-ui/core"
-import { Link as GatsbyLink } from "gatsby-theme-material-ui"
+import { makeStyles } from '@material-ui/core/styles';
+import { AppBar, Toolbar, Container, Link } from '@material-ui/core';
+import { Link as GatsbyLink } from 'gatsby-theme-material-ui';
 
 function Navbar({ className, ...rest }) {
-  const classes = useStyles()
-  const handleClickLink = useSmoothScroll()
+  const classes = useStyles();
+  const handleClickLink = useSmoothScroll();
 
   return (
     <AppBar
@@ -34,7 +34,7 @@ function Navbar({ className, ...rest }) {
             <Link
               title="Start"
               color="inherit"
-              href={"#" + HEADER_ID}
+              href={'#' + HEADER_ID}
               onClick={handleClickLink(HEADER_ID)}
             >
               Start
@@ -42,7 +42,7 @@ function Navbar({ className, ...rest }) {
             <Link
               title="Portfolio"
               color="inherit"
-              href={"#" + PORTFOLIO_SECTION_ID}
+              href={'#' + PORTFOLIO_SECTION_ID}
               onClick={handleClickLink(PORTFOLIO_SECTION_ID)}
             >
               Portfolio
@@ -50,7 +50,7 @@ function Navbar({ className, ...rest }) {
             <Link
               title="Contact"
               color="inherit"
-              href={"#" + CONTACT_SECTION_ID}
+              href={'#' + CONTACT_SECTION_ID}
               onClick={handleClickLink(CONTACT_SECTION_ID)}
             >
               Contact
@@ -59,49 +59,49 @@ function Navbar({ className, ...rest }) {
         </Toolbar>
       </Container>
     </AppBar>
-  )
+  );
 }
 
 const useStyles = makeStyles(theme => ({
   appBar: {
-    backgroundColor: "transparent",
-    color: "#fff",
-    boxShadow: "none",
+    backgroundColor: 'transparent',
+    color: '#fff',
+    boxShadow: 'none',
   },
   linkContainer: {
-    "& > *:not(:last-child)": {
+    '& > *:not(:last-child)': {
       marginRight: theme.spacing(1.5),
     },
-    [theme.breakpoints.down("xs")]: {
-      "& > *:not(:last-child)": {
+    [theme.breakpoints.down('xs')]: {
+      '& > *:not(:last-child)': {
         marginRight: theme.spacing(0.75),
       },
     },
   },
   logo: {
-    width: "56px",
-    height: "auto",
-    [theme.breakpoints.down("xs")]: {
-      width: "48px",
+    width: '56px',
+    height: 'auto',
+    [theme.breakpoints.down('xs')]: {
+      width: '48px',
     },
   },
   divider: {
     flexGrow: 1,
   },
   link: {
-    width: "100%",
+    width: '100%',
   },
   titleContainer: {
-    display: "flex",
-    alignItems: "center",
-    "& > *:not(:last-child)": {
+    display: 'flex',
+    alignItems: 'center',
+    '& > *:not(:last-child)': {
       marginRight: theme.spacing(1),
     },
   },
   toolbar: {
     padding: theme.spacing(2, 0),
-    fontSize: "1.25rem",
+    fontSize: '1.25rem',
   },
-}))
+}));
 
-export default Navbar
+export default Navbar;
diff --git a/src/components/SEO.js b/src/components/SEO.js
index eebf7fd..8e17b32 100644
--- a/src/components/SEO.js
+++ b/src/components/SEO.js
@@ -1,8 +1,8 @@
-import React from "react"
-import PropTypes from "prop-types"
-import { Helmet } from "react-helmet"
-import { useStaticQuery, graphql } from "gatsby"
-import ogThumbnail from "@images/og_thumbnail.png"
+import React from 'react';
+import PropTypes from 'prop-types';
+import { Helmet } from 'react-helmet';
+import { useStaticQuery, graphql } from 'gatsby';
+import ogThumbnail from '@images/og_thumbnail.png';
 
 function SEO({ description, lang, meta, title, pathname }) {
   const { site } = useStaticQuery(
@@ -18,9 +18,9 @@ function SEO({ description, lang, meta, title, pathname }) {
         }
       }
     `
-  )
+  );
 
-  const metaDescription = description || site.siteMetadata.description
+  const metaDescription = description || site.siteMetadata.description;
 
   return (
     <Helmet
@@ -28,7 +28,7 @@ function SEO({ description, lang, meta, title, pathname }) {
         lang,
       }}
       title={title ?? site.siteMetadata.title}
-      titleTemplate={title ? `%s | ${site.siteMetadata.title}` : "%s"}
+      titleTemplate={title ? `%s | ${site.siteMetadata.title}` : '%s'}
       meta={[
         {
           name: `description`,
@@ -105,20 +105,20 @@ function SEO({ description, lang, meta, title, pathname }) {
         content={`${site.siteMetadata.siteUrl}${pathname}`}
       ></link>
     </Helmet>
-  )
+  );
 }
 
 SEO.defaultProps = {
   lang: `pl`,
   meta: [],
   description: ``,
-}
+};
 
 SEO.propTypes = {
   description: PropTypes.string,
   lang: PropTypes.string,
   meta: PropTypes.arrayOf(PropTypes.object),
   title: PropTypes.string.isRequired,
-}
+};
 
-export default SEO
+export default SEO;
diff --git a/src/components/Section.js b/src/components/Section.js
index 8574833..9d6049e 100644
--- a/src/components/Section.js
+++ b/src/components/Section.js
@@ -1,64 +1,64 @@
-import React from "react"
-import PropTypes from "prop-types"
-import classnames from "classnames"
+import React from 'react';
+import PropTypes from 'prop-types';
+import classnames from 'classnames';
 
-import { makeStyles } from "@material-ui/core/styles"
+import { makeStyles } from '@material-ui/core/styles';
 
 const useStyles = makeStyles(theme => ({
   section: {
-    padding: "3rem 0",
-    "&.is-primary": {
+    padding: '3rem 0',
+    '&.is-primary': {
       backgroundColor: theme.palette.primary.main,
     },
-    "&.is-black": {
-      backgroundColor: "#000",
-      color: "#fff",
+    '&.is-black': {
+      backgroundColor: '#000',
+      color: '#fff',
     },
-    [theme.breakpoints.up("md")]: {
-      padding: "6rem 0",
+    [theme.breakpoints.up('md')]: {
+      padding: '6rem 0',
     },
-    "&.is-small": {
-      padding: "3rem 0",
+    '&.is-small': {
+      padding: '3rem 0',
     },
   },
-}))
+}));
 
 export const BG_COLOR = {
-  TRANSPARENT: "transparent",
-  BLACK: "black",
-  PRIMARY: "primary",
-}
+  TRANSPARENT: 'transparent',
+  BLACK: 'black',
+  PRIMARY: 'primary',
+};
 
 export const SIZE = {
-  SMALL: "small",
-  MEDIUM: "medium",
-}
+  SMALL: 'small',
+  MEDIUM: 'medium',
+};
 
 function Section({ children, className, bgColor, component, size, ...rest }) {
-  const classes = useStyles()
-  const Component = component || "section"
+  const classes = useStyles();
+  const Component = component || 'section';
   return (
     <Component
       className={classnames(classes.section, className, {
-        "is-primary": bgColor === BG_COLOR.PRIMARY,
-        "is-black": bgColor === BG_COLOR.BLACK,
-        "is-small": size === SIZE.SMALL,
+        'is-primary': bgColor === BG_COLOR.PRIMARY,
+        'is-black': bgColor === BG_COLOR.BLACK,
+        'is-small': size === SIZE.SMALL,
       })}
       {...rest}
     >
       {children}
     </Component>
-  )
+  );
 }
 
 Section.defaultProps = {
   bgColor: BG_COLOR.TRANSPARENT,
   size: SIZE.MEDIUM,
-}
+};
 
 Section.propTypes = {
   bgColor: PropTypes.oneOf(Object.values(BG_COLOR)).isRequired,
   size: PropTypes.oneOf(Object.values(SIZE)).isRequired,
-}
+};
 
-export default Section
+export default Section;
diff --git a/src/config/routes.js b/src/config/routes.js
index b75c8cb..d980e90 100644
--- a/src/config/routes.js
+++ b/src/config/routes.js
@@ -1 +1 @@
-export const HOME = "/"
+export const HOME = '/';
diff --git a/src/features/HomePage/HomePage.js b/src/features/HomePage/HomePage.js
index 42a3df3..d2b4351 100644
--- a/src/features/HomePage/HomePage.js
+++ b/src/features/HomePage/HomePage.js
@@ -1,25 +1,25 @@
-import React from "react"
+import React from 'react';
 
-import { makeStyles } from "@material-ui/core/styles"
-import { Divider } from "@material-ui/core"
-import Layout from "@components/Layout/Layout"
-import SEO from "@components/SEO"
-import Header from "./components/Header"
-import MyPriorities from "./components/MyPriorities/MyPriorities"
-import Technologies from "./components/Technologies/Technologies"
-import Portfolio from "./components/Portfolio/Portfolio"
-import Contact from "./components/Contact"
+import { makeStyles } from '@material-ui/core/styles';
+import { Divider } from '@material-ui/core';
+import Layout from '@components/Layout/Layout';
+import SEO from '@components/SEO';
+import Header from './components/Header';
+import MyPriorities from './components/MyPriorities/MyPriorities';
+import Technologies from './components/Technologies/Technologies';
+import Portfolio from './components/Portfolio/Portfolio';
+import Contact from './components/Contact';
 
 const useStyles = makeStyles(theme => ({
   layout: {
     padding: 0,
   },
-}))
+}));
 
 const HomePage = ({ location }) => {
-  const classes = useStyles()
+  const classes = useStyles();
   return (
-    <Layout className={classes.layout} navbarProps={{ position: "absolute" }}>
+    <Layout className={classes.layout} navbarProps={{ position: 'absolute' }}>
       <SEO pathname={location.pathname} />
       <Header />
       <MyPriorities />
@@ -29,7 +29,7 @@ const HomePage = ({ location }) => {
       <Contact />
       <Divider />
     </Layout>
-  )
-}
+  );
+};
 
-export default HomePage
+export default HomePage;
diff --git a/src/features/HomePage/components/Contact.js b/src/features/HomePage/components/Contact.js
index 0179b35..3f0d8b0 100644
--- a/src/features/HomePage/components/Contact.js
+++ b/src/features/HomePage/components/Contact.js
@@ -1,23 +1,23 @@
-import React from "react"
+import React from 'react';
 
-import { makeStyles } from "@material-ui/core/styles"
-import { Typography, Container, Link } from "@material-ui/core"
+import { makeStyles } from '@material-ui/core/styles';
+import { Typography, Container, Link } from '@material-ui/core';
 import {
   Email as EmailIcon,
   GitHub as GitHubIcon,
   Facebook as FacebookIcon,
-} from "@material-ui/icons"
-import Section from "@components/Section"
+} from '@material-ui/icons';
+import Section from '@components/Section';
 
-export const SECTION_ID = "contact"
+export const SECTION_ID = 'contact';
 
 function Contact() {
-  const classes = useStyles()
+  const classes = useStyles();
 
   const linkProps = {
-    underline: "hover",
-    color: "secondary",
-  }
+    underline: 'hover',
+    color: 'secondary',
+  };
 
   return (
     <Section size="small" id={SECTION_ID}>
@@ -47,30 +47,30 @@ function Contact() {
         </div>
       </Container>
     </Section>
-  )
+  );
 }
 
 const useStyles = makeStyles(theme => {
   return {
     container: {
-      display: "flex",
-      alignItems: "center",
-      justifyContent: "center",
+      display: 'flex',
+      alignItems: 'center',
+      justifyContent: 'center',
     },
     urlContainer: {
-      "& > *:not(:last-child)": {
+      '& > *:not(:last-child)': {
         marginBottom: theme.spacing(0.5),
       },
-      "& > *": {
-        display: "flex",
-        alignItems: "center",
-        wordBreak: "break-all",
-        "& > *:not(:last-child)": {
+      '& > *': {
+        display: 'flex',
+        alignItems: 'center',
+        wordBreak: 'break-all',
+        '& > *:not(:last-child)': {
           marginRight: theme.spacing(1),
         },
       },
     },
-  }
-})
+  };
+});
 
-export default Contact
+export default Contact;
diff --git a/src/features/HomePage/components/Header.js b/src/features/HomePage/components/Header.js
index a2c27f5..8921d02 100644
--- a/src/features/HomePage/components/Header.js
+++ b/src/features/HomePage/components/Header.js
@@ -1,16 +1,16 @@
-import React from "react"
-import useSmoothScroll from "@libs/useSmoothScroll"
-import { SECTION_ID } from "./Contact"
+import React from 'react';
+import useSmoothScroll from '@libs/useSmoothScroll';
+import { SECTION_ID } from './Contact';
 
-import { makeStyles } from "@material-ui/core/styles"
-import { Container, Typography, Button, Link } from "@material-ui/core"
-import bg from "./header-bg.jpg"
+import { makeStyles } from '@material-ui/core/styles';
+import { Container, Typography, Button, Link } from '@material-ui/core';
+import bg from './header-bg.jpg';
 
-export const HEADER_ID = "start"
+export const HEADER_ID = 'start';
 
 function Header() {
-  const classes = useStyles()
-  const handleLinkClick = useSmoothScroll()
+  const classes = useStyles();
+  const handleLinkClick = useSmoothScroll();
   return (
     <header id={HEADER_ID} className={classes.header}>
       <Container className={classes.container}>
@@ -28,7 +28,7 @@ function Header() {
           </div>
           <Link
             underline="none"
-            to={"#" + SECTION_ID}
+            to={'#' + SECTION_ID}
             onClick={handleLinkClick(SECTION_ID)}
           >
             <Button variant="outlined" size="large">
@@ -38,31 +38,31 @@ function Header() {
         </div>
       </Container>
     </header>
-  )
+  );
 }
 
 const useStyles = makeStyles(theme => ({
   header: {
-    minHeight: "100vh",
+    minHeight: '100vh',
     backgroundImage: `url(${bg})`,
-    backgroundSize: "cover",
-    backgroundPosition: "center",
-    clipPath: "polygon(0 0,100% 0,100% 80vh,0 100%)",
+    backgroundSize: 'cover',
+    backgroundPosition: 'center',
+    clipPath: 'polygon(0 0,100% 0,100% 80vh,0 100%)',
 
-    height: "100%",
-    display: "flex",
-    justifyContent: "center",
-    flexDirection: "column",
-    [theme.breakpoints.down("sm")]: {
+    height: '100%',
+    display: 'flex',
+    justifyContent: 'center',
+    flexDirection: 'column',
+    [theme.breakpoints.down('sm')]: {
       margin: 0,
-      clipPath: "none",
+      clipPath: 'none',
     },
   },
   container: {
-    textAlign: "center",
-    height: "100%",
+    textAlign: 'center',
+    height: '100%',
     paddingBottom: theme.spacing(8),
-    [theme.breakpoints.down("sm")]: {
+    [theme.breakpoints.down('sm')]: {
       paddingBottom: theme.spacing(1),
     },
   },
@@ -70,6 +70,6 @@ const useStyles = makeStyles(theme => ({
     paddingTop: theme.spacing(12),
     paddingBottom: theme.spacing(5),
   },
-}))
+}));
 
-export default Header
+export default Header;
diff --git a/src/features/HomePage/components/MyPriorities/MyPriorities.js b/src/features/HomePage/components/MyPriorities/MyPriorities.js
index 1710c75..e7392f7 100644
--- a/src/features/HomePage/components/MyPriorities/MyPriorities.js
+++ b/src/features/HomePage/components/MyPriorities/MyPriorities.js
@@ -1,15 +1,15 @@
-import React from "react"
+import React from 'react';
 
-import { makeStyles } from "@material-ui/core/styles"
-import { Container, Typography, Grid } from "@material-ui/core"
-import Section from "@components/Section"
-import speedIcon from "./speed.svg"
-import responsiveIcon from "./responsive.svg"
-import securityIcon from "./security.svg"
-import intuitiveIcon from "./intuitive.svg"
+import { makeStyles } from '@material-ui/core/styles';
+import { Container, Typography, Grid } from '@material-ui/core';
+import Section from '@components/Section';
+import speedIcon from './speed.svg';
+import responsiveIcon from './responsive.svg';
+import securityIcon from './security.svg';
+import intuitiveIcon from './intuitive.svg';
 
 function MyPriorities() {
-  const classes = useStyles()
+  const classes = useStyles();
   return (
     <Section>
       <Container className={classes.container}>
@@ -53,21 +53,21 @@ function MyPriorities() {
         </Grid>
       </Container>
     </Section>
-  )
+  );
 }
 
 const useStyles = makeStyles(theme => ({
   icon: {
     width: 128,
     height: 128,
-    [theme.breakpoints.down("md")]: {
+    [theme.breakpoints.down('md')]: {
       width: 96,
       height: 96,
     },
   },
   container: {
-    textAlign: "center",
+    textAlign: 'center',
   },
-}))
+}));
 
-export default MyPriorities
+export default MyPriorities;
diff --git a/src/features/HomePage/components/Portfolio/Portfolio.js b/src/features/HomePage/components/Portfolio/Portfolio.js
index e0149a8..089ea37 100644
--- a/src/features/HomePage/components/Portfolio/Portfolio.js
+++ b/src/features/HomePage/components/Portfolio/Portfolio.js
@@ -1,34 +1,34 @@
-import React from "react"
-import { useStaticQuery, graphql } from "gatsby"
+import React from 'react';
+import { useStaticQuery, graphql } from 'gatsby';
 
-import { makeStyles } from "@material-ui/core/styles"
-import { Typography, Container } from "@material-ui/core"
-import Section, { BG_COLOR } from "@components/Section"
-import Project from "./Project"
+import { makeStyles } from '@material-ui/core/styles';
+import { Typography, Container } from '@material-ui/core';
+import Section, { BG_COLOR } from '@components/Section';
+import Project from './Project';
 
 const useStyles = makeStyles(theme => ({
   section: {
-    transform: "skewY(-7deg)",
-    padding: "8rem 0",
-    margin: "6rem 0",
-    "& > *": {
-      transform: "skewY(7deg)",
+    transform: 'skewY(-7deg)',
+    padding: '8rem 0',
+    margin: '6rem 0',
+    '& > *': {
+      transform: 'skewY(7deg)',
     },
-    [theme.breakpoints.down("sm")]: {
-      margin: "3rem 0",
+    [theme.breakpoints.down('sm')]: {
+      margin: '3rem 0',
     },
   },
   projects: {
-    "& > *:not(:last-child)": {
+    '& > *:not(:last-child)': {
       marginBottom: theme.spacing(2),
     },
   },
-}))
+}));
 
-export const SECTION_ID = "portfolio"
+export const SECTION_ID = 'portfolio';
 
 function Portfolio() {
-  const classes = useStyles()
+  const classes = useStyles();
   const data = useStaticQuery(graphql`
     {
       allCoverImages: allFile(
@@ -47,7 +47,7 @@ function Portfolio() {
         }
       }
     }
-  `)
+  `);
   return (
     <Section
       id={SECTION_ID}
@@ -60,13 +60,13 @@ function Portfolio() {
         </Typography>
         <div className={classes.projects}>
           {projects.map((project, index) => {
-            let fluid = undefined
+            let fluid = undefined;
             if (project.fluid) {
               const edge = data.allCoverImages.edges.find(
                 img => img.node.relativePath === project.fluid
-              )
+              );
               if (edge) {
-                fluid = edge.node.childImageSharp.fluid
+                fluid = edge.node.childImageSharp.fluid;
               }
             }
 
@@ -77,121 +77,121 @@ function Portfolio() {
                 fluid={fluid}
                 reverse={(index + 1) % 2 === 0}
               />
-            )
+            );
           })}
         </div>
       </Container>
     </Section>
-  )
+  );
 }
 
 const projects = [
   {
-    title: "TWHelp",
+    title: 'TWHelp',
     description:
-      "A stat tracking and tools website, scripts, a public GraphQL API and a Discord bot for the browser-based game Tribal Wars.",
+      'A stat tracking and tools website, scripts, a public GraphQL API and a Discord bot for the browser-based game Tribal Wars.',
     technologies: [
-      "GraphQL",
-      "Golang",
-      "gqlgen",
-      "Gin",
-      "discordgo",
-      "robfig/cron",
-      "Redis",
-      "PostgreSQL",
-      "TypeScript",
-      "React",
-      "Gatsby",
-      "Material-UI",
-      "Create React App",
-      "Apollo",
-      "Parcel",
-      "Docker",
-      "Traefik",
+      'GraphQL',
+      'Golang',
+      'gqlgen',
+      'Gin',
+      'discordgo',
+      'robfig/cron',
+      'Redis',
+      'PostgreSQL',
+      'TypeScript',
+      'React',
+      'Gatsby',
+      'Material-UI',
+      'Create React App',
+      'Apollo',
+      'Parcel',
+      'Docker',
+      'Traefik',
     ],
-    github: "https://github.com/tribalwarshelp",
-    fluid: "projects/twhelp.png",
-    live: "https://tribalwarshelp.com/",
+    github: 'https://github.com/tribalwarshelp',
+    fluid: 'projects/twhelp.png',
+    live: 'https://tribalwarshelp.com/',
   },
   {
-    title: "Zdam Egzamin Zawodowy",
+    title: 'Zdam Egzamin Zawodowy',
     description:
-      "A mobile and web app for practising the theoretical part of the vocational exam.",
+      'A mobile and web app for practising the theoretical part of the vocational exam.',
     technologies: [
-      "GraphQL",
-      "Golang",
-      "gqlgen",
-      "Echo",
-      "PostgreSQL",
-      "React",
-      "Next.JS",
-      "Material-UI",
-      "Apollo",
-      "React Native",
+      'GraphQL',
+      'Golang',
+      'gqlgen',
+      'Echo',
+      'PostgreSQL',
+      'React',
+      'Next.JS',
+      'Material-UI',
+      'Apollo',
+      'React Native',
     ],
-    github: "",
-    fluid: "projects/zdam.png",
-    live: "https://zdamegzaminzawodowy.pl/",
+    github: '',
+    fluid: 'projects/zdam.png',
+    live: 'https://zdamegzaminzawodowy.pl/',
   },
   {
-    title: "matura-z-informatyki.pl",
-    description: "",
-    technologies: ["React", "Next.JS", "Bulma", "Ghost"],
-    github: "https://github.com/Kichiyaki/matura-z-informatyki.pl",
-    live: "https://matura-z-informatyki.pl/",
-    fluid: "projects/maturazinf.png",
+    title: 'matura-z-informatyki.pl',
+    description: '',
+    technologies: ['React', 'Next.JS', 'Bulma', 'Ghost'],
+    github: 'https://github.com/Kichiyaki/matura-z-informatyki.pl',
+    live: 'https://matura-z-informatyki.pl/',
+    fluid: 'projects/maturazinf.png',
   },
   {
-    title: "dwysokinski.me",
-    description: "",
-    technologies: ["React", "Gatsby", "Material-UI"],
-    github: "https://github.com/Kichiyaki/dwysokinski.me",
-    live: "https://dwysokinski.me",
-    fluid: "projects/dw.png",
+    title: 'dwysokinski.me',
+    description: '',
+    technologies: ['React', 'Gatsby', 'Material-UI'],
+    github: 'https://github.com/Kichiyaki/dwysokinski.me',
+    live: 'https://dwysokinski.me',
+    fluid: 'projects/dw.png',
   },
   {
-    title: "OLX Crawler",
-    description: "An app written in Go to observe olx.pl ads.",
+    title: 'OLX Crawler',
+    description: 'An app written in Go to observe olx.pl ads.',
     technologies: [
-      "Golang",
-      "Colly",
-      "SQLite3",
-      "Echo",
-      "React",
-      "Material-UI",
+      'Golang',
+      'Colly',
+      'SQLite3',
+      'Echo',
+      'React',
+      'Material-UI',
     ],
-    fluid: "projects/olx.png",
-    github: "https://github.com/Kichiyaki/olx-crawler",
+    fluid: 'projects/olx.png',
+    github: 'https://github.com/Kichiyaki/olx-crawler',
   },
   {
-    title: "Instaling.pl Bot",
-    description: "A bot that solves the instaling.pl vocabulary test for you.",
-    technologies: ["Golang", "Lorca"],
-    fluid: "projects/instaling.png",
-    github: "https://github.com/Kichiyaki/Instaling-Bot",
+    title: 'Instaling.pl Bot',
+    description: 'A bot that solves the instaling.pl vocabulary test for you.',
+    technologies: ['Golang', 'Lorca'],
+    fluid: 'projects/instaling.png',
+    github: 'https://github.com/Kichiyaki/Instaling-Bot',
   },
   {
-    title: "Margonem Mini Bot",
+    title: 'Margonem Mini Bot',
     description:
-      "A bot for the mobile client of the browser-based MMORPG game Margonem.",
-    technologies: ["Golang", "Colly"],
-    fluid: "projects/margonem.png",
-    github: "https://github.com/Kichiyaki/margonem-mini-bot",
+      'A bot for the mobile client of the browser-based MMORPG game Margonem.',
+    technologies: ['Golang', 'Colly'],
+    fluid: 'projects/margonem.png',
+    github: 'https://github.com/Kichiyaki/margonem-mini-bot',
   },
   {
-    title: "Akademia Młodego Inżyniera",
-    description: "",
-    technologies: ["HTML", "CSS", "Bootstrap"],
-    live: "https://dwysokinski.me/preview/akademia/",
-    fluid: "projects/amz.png",
+    title: 'Akademia Młodego Inżyniera',
+    description: '',
+    technologies: ['HTML', 'CSS', 'Bootstrap'],
+    live: 'https://dwysokinski.me/preview/akademia/',
+    fluid: 'projects/amz.png',
   },
   {
-    title: "Freshline",
-    description: "",
-    technologies: ["Wordpress", "CSS", "Bootstrap"],
-    live: "http://fresh-line.pl/",
-    fluid: "projects/freshline.png",
+    title: 'Freshline',
+    description: '',
+    technologies: ['Wordpress', 'CSS', 'Bootstrap'],
+    live: 'http://fresh-line.pl/',
+    fluid: 'projects/freshline.png',
   },
-]
+];
 
-export default Portfolio
+export default Portfolio;
diff --git a/src/features/HomePage/components/Portfolio/Project.js b/src/features/HomePage/components/Portfolio/Project.js
index 180a6ea..871afca 100644
--- a/src/features/HomePage/components/Portfolio/Project.js
+++ b/src/features/HomePage/components/Portfolio/Project.js
@@ -1,9 +1,9 @@
-import React from "react"
-import PropTypes from "prop-types"
-import classnames from "classnames"
-import notFound from "./not-found.jpg"
+import React from 'react';
+import PropTypes from 'prop-types';
+import classnames from 'classnames';
+import notFound from './not-found.jpg';
 
-import { makeStyles } from "@material-ui/core/styles"
+import { makeStyles } from '@material-ui/core/styles';
 import {
   Card,
   CardContent,
@@ -12,8 +12,8 @@ import {
   Button,
   Chip,
   Link,
-} from "@material-ui/core"
-import BackgroundImage from "gatsby-background-image"
+} from '@material-ui/core';
+import BackgroundImage from 'gatsby-background-image';
 
 function Project({
   reverse,
@@ -25,7 +25,7 @@ function Project({
   img,
   fluid,
 }) {
-  const classes = useStyles()
+  const classes = useStyles();
   return (
     <Card
       className={classnames(classes.card, {
@@ -53,7 +53,7 @@ function Project({
           {technologies.map(technology => {
             return (
               <Chip key={technology} label={technology} color="secondary" />
-            )
+            );
           })}
         </div>
         <div className={classes.buttons}>
@@ -74,29 +74,29 @@ function Project({
         </div>
       </CardContent>
     </Card>
-  )
+  );
 }
 
 const useStyles = makeStyles(theme => ({
   card: {
-    display: "flex",
-    minHeight: "400px",
-    "&.reverse": {
-      flexDirection: "row-reverse",
-      [theme.breakpoints.down("sm")]: {
-        flexDirection: "column",
+    display: 'flex',
+    minHeight: '400px',
+    '&.reverse': {
+      flexDirection: 'row-reverse',
+      [theme.breakpoints.down('sm')]: {
+        flexDirection: 'column',
       },
     },
-    [theme.breakpoints.down("sm")]: {
-      flexDirection: "column",
+    [theme.breakpoints.down('sm')]: {
+      flexDirection: 'column',
     },
   },
   cardContent: {
-    display: "flex",
-    flexDirection: "column",
-    width: "45%",
-    [theme.breakpoints.down("sm")]: {
-      width: "100%",
+    display: 'flex',
+    flexDirection: 'column',
+    width: '45%',
+    [theme.breakpoints.down('sm')]: {
+      width: '100%',
     },
   },
   divider: {
@@ -107,42 +107,42 @@ const useStyles = makeStyles(theme => ({
   },
   technologies: {
     marginBottom: theme.spacing(2),
-    "& > *:not(:last-child)": {
+    '& > *:not(:last-child)': {
       marginRight: theme.spacing(1),
     },
-    "& > *": {
+    '& > *': {
       marginBottom: theme.spacing(1),
     },
   },
   buttons: {
-    "& > *:not(:last-child)": {
+    '& > *:not(:last-child)': {
       marginRight: theme.spacing(1),
     },
-    "& > *": {
+    '& > *': {
       marginBottom: theme.spacing(1),
-      [theme.breakpoints.down("xs")]: {
-        width: "100%",
+      [theme.breakpoints.down('xs')]: {
+        width: '100%',
       },
     },
   },
   cover: {
-    width: "55%",
-    [theme.breakpoints.down("sm")]: {
-      width: "100%",
-      paddingTop: "56.25%",
+    width: '55%',
+    [theme.breakpoints.down('sm')]: {
+      width: '100%',
+      paddingTop: '56.25%',
     },
   },
-}))
+}));
 
 Project.defaultProps = {
   reverse: false,
-  title: "",
-  description: "",
+  title: '',
+  description: '',
   technologies: [],
-  github: "",
-  live: "",
+  github: '',
+  live: '',
   img: notFound,
-}
+};
 
 Project.propTypes = {
   reverse: PropTypes.bool.isRequired,
@@ -152,6 +152,6 @@ Project.propTypes = {
   github: PropTypes.string.isRequired,
   live: PropTypes.string.isRequired,
   img: PropTypes.string.isRequired,
-}
+};
 
-export default Project
+export default Project;
diff --git a/src/features/HomePage/components/Technologies/Technologies.js b/src/features/HomePage/components/Technologies/Technologies.js
index faa665e..5f08134 100644
--- a/src/features/HomePage/components/Technologies/Technologies.js
+++ b/src/features/HomePage/components/Technologies/Technologies.js
@@ -1,21 +1,21 @@
-import React from "react"
-import { useStaticQuery, graphql } from "gatsby"
+import React from 'react';
+import { useStaticQuery, graphql } from 'gatsby';
 
-import { makeStyles } from "@material-ui/core/styles"
-import { Container, Typography, Grid } from "@material-ui/core"
-import Section from "@components/Section"
-import Technology from "./Technology"
+import { makeStyles } from '@material-ui/core/styles';
+import { Container, Typography, Grid } from '@material-ui/core';
+import Section from '@components/Section';
+import Technology from './Technology';
 
 const useStyles = makeStyles(theme => ({
   hide: {
-    [theme.breakpoints.down("md")]: {
-      display: "none",
+    [theme.breakpoints.down('md')]: {
+      display: 'none',
     },
   },
-}))
+}));
 
-function AboutMe() {
-  const classes = useStyles()
+function Technologies() {
+  const classes = useStyles();
   const data = useStaticQuery(graphql`
     {
       allIcons: allFile(filter: { absolutePath: { regex: "/technologies/" } }) {
@@ -32,15 +32,17 @@ function AboutMe() {
         }
       }
     }
-  `)
+  `);
 
   const findIcon = path => {
-    const edge = data.allIcons.edges.find(img => img.node.relativePath === path)
+    const edge = data.allIcons.edges.find(
+      img => img.node.relativePath === path
+    );
     if (edge) {
-      return edge.node.childImageSharp.fixed
+      return edge.node.childImageSharp.fixed;
     }
-    return {}
-  }
+    return {};
+  };
 
   return (
     <Section>
@@ -52,75 +54,75 @@ function AboutMe() {
           <Grid item className={classes.hide} lg={1}></Grid>
           <Grid item xs={6} sm={4} md={2} lg={1}>
             <Technology
-              fixed={findIcon("technologies/html5.png")}
+              fixed={findIcon('technologies/html5.png')}
               name="HTML"
             />
           </Grid>
           <Grid item className={classes.hide} lg={1}></Grid>
           <Grid item xs={6} sm={4} md={2} lg={1}>
-            <Technology fixed={findIcon("technologies/css.png")} name="CSS" />
+            <Technology fixed={findIcon('technologies/css.png')} name="CSS" />
           </Grid>
           <Grid item className={classes.hide} lg={1}></Grid>
           <Grid item xs={6} sm={4} md={2} lg={1}>
-            <Technology fixed={findIcon("technologies/scss.png")} name="SCSS" />
+            <Technology fixed={findIcon('technologies/scss.png')} name="SCSS" />
           </Grid>
           <Grid item className={classes.hide} lg={1}></Grid>
           <Grid item xs={6} sm={4} md={2} lg={1}>
             <Technology
-              fixed={findIcon("technologies/js.png")}
+              fixed={findIcon('technologies/js.png')}
               name="JavaScript"
             />
           </Grid>
           <Grid item className={classes.hide} lg={1}></Grid>
           <Grid item xs={6} sm={4} md={2} lg={1}>
             <Technology
-              fixed={findIcon("technologies/typescript.png")}
+              fixed={findIcon('technologies/typescript.png')}
               name="TypeScript"
             />
           </Grid>
           <Grid item className={classes.hide} lg={1}></Grid>
           <Grid item xs={6} sm={4} md={2} lg={1}>
             <Technology
-              fixed={findIcon("technologies/react.png")}
+              fixed={findIcon('technologies/react.png')}
               name="React"
             />
           </Grid>
 
           <Grid item xs={6} sm={4} md={2} lg={1}>
             <Technology
-              fixed={findIcon("technologies/gatsby.png")}
+              fixed={findIcon('technologies/gatsby.png')}
               name="Gatsby"
             />
           </Grid>
           <Grid item className={classes.hide} lg={1}></Grid>
           <Grid item xs={6} sm={4} md={2} lg={1}>
             <Technology
-              fixed={findIcon("technologies/nextjs.png")}
+              fixed={findIcon('technologies/nextjs.png')}
               name="Next.JS"
             />
           </Grid>
           <Grid item className={classes.hide} lg={1}></Grid>
           <Grid item xs={6} sm={4} md={2} lg={1}>
-            <Technology fixed={findIcon("technologies/jest.png")} name="Jest" />
+            <Technology fixed={findIcon('technologies/jest.png')} name="Jest" />
           </Grid>
           <Grid item className={classes.hide} lg={1}></Grid>
           <Grid item xs={6} sm={4} md={2} lg={1}>
             <Technology
-              fixed={findIcon("technologies/express.png")}
+              fixed={findIcon('technologies/express.png')}
               name="Express"
             />
           </Grid>
           <Grid item className={classes.hide} lg={1}></Grid>
           <Grid item xs={6} sm={4} md={2} lg={1}>
             <Technology
-              fixed={findIcon("technologies/strapi.png")}
+              fixed={findIcon('technologies/strapi.png')}
               name="Strapi"
             />
           </Grid>
           <Grid item className={classes.hide} lg={1}></Grid>
           <Grid item xs={6} sm={4} md={2} lg={1}>
             <Technology
-              fixed={findIcon("technologies/ghost.png")}
+              fixed={findIcon('technologies/ghost.png')}
               name="Ghost"
             />
           </Grid>
@@ -129,49 +131,49 @@ function AboutMe() {
           <Grid item className={classes.hide} lg={1}></Grid>
           <Grid item xs={6} sm={4} md={2} lg={1}>
             <Technology
-              fixed={findIcon("technologies/graphql.png")}
+              fixed={findIcon('technologies/graphql.png')}
               name="GraphQL"
             />
           </Grid>
           <Grid item className={classes.hide} lg={1}></Grid>
           <Grid item xs={6} sm={4} md={2} lg={1}>
             <Technology
-              fixed={findIcon("technologies/golang.png")}
+              fixed={findIcon('technologies/golang.png')}
               name="Golang"
             />
           </Grid>
           <Grid item className={classes.hide} lg={1}></Grid>
           <Grid item xs={6} sm={4} md={2} lg={1}>
             <Technology
-              fixed={findIcon("technologies/gqlgen.png")}
+              fixed={findIcon('technologies/gqlgen.png')}
               name="gqlgen"
             />
           </Grid>
           <Grid item className={classes.hide} lg={1}></Grid>
           <Grid item xs={6} sm={4} md={2} lg={1}>
             <Technology
-              fixed={findIcon("technologies/golang.png")}
+              fixed={findIcon('technologies/golang.png')}
               name="Gin"
             />
           </Grid>
           <Grid item className={classes.hide} lg={1}></Grid>
           <Grid item xs={6} sm={4} md={2} lg={1}>
             <Technology
-              fixed={findIcon("technologies/postgresql.png")}
+              fixed={findIcon('technologies/postgresql.png')}
               name="PostgreSQL"
             />
           </Grid>
           <Grid item className={classes.hide} lg={1}></Grid>
           <Grid item xs={6} sm={4} md={2} lg={1}>
             <Technology
-              fixed={findIcon("technologies/docker.png")}
+              fixed={findIcon('technologies/docker.png')}
               name="Docker"
             />
           </Grid>
         </Grid>
       </Container>
     </Section>
-  )
+  );
 }
 
-export default AboutMe
+export default Technologies;
diff --git a/src/features/HomePage/components/Technologies/Technology.js b/src/features/HomePage/components/Technologies/Technology.js
index e7df847..ca9ef3c 100644
--- a/src/features/HomePage/components/Technologies/Technology.js
+++ b/src/features/HomePage/components/Technologies/Technology.js
@@ -1,31 +1,31 @@
-import React from "react"
+import React from 'react';
 
-import { makeStyles } from "@material-ui/core/styles"
-import { Typography, Paper } from "@material-ui/core"
-import Image from "gatsby-image"
+import { makeStyles } from '@material-ui/core/styles';
+import { Typography, Paper } from '@material-ui/core';
+import Image from 'gatsby-image';
 
 const useStyles = makeStyles(theme => ({
   paper: {
-    display: "flex",
-    alignItems: "center",
-    flexDirection: "column",
-    textAlign: "center",
-    height: "100%",
+    display: 'flex',
+    alignItems: 'center',
+    flexDirection: 'column',
+    textAlign: 'center',
+    height: '100%',
     padding: theme.spacing(1),
   },
   image: {
     marginBottom: theme.spacing(1),
   },
-}))
+}));
 
 function Technology({ fixed, name }) {
-  const classes = useStyles()
+  const classes = useStyles();
   return (
     <Paper className={classes.paper}>
       <Image className={classes.image} fixed={fixed} />
       <Typography variant="body2">{name}</Typography>
     </Paper>
-  )
+  );
 }
 
-export default Technology
+export default Technology;
diff --git a/src/gatsby-theme-material-ui-top-layout/theme.js b/src/gatsby-theme-material-ui-top-layout/theme.js
index 38787b6..95cfc1e 100644
--- a/src/gatsby-theme-material-ui-top-layout/theme.js
+++ b/src/gatsby-theme-material-ui-top-layout/theme.js
@@ -1,9 +1,9 @@
-import { createMuiTheme, responsiveFontSizes } from "@material-ui/core/styles"
+import { createMuiTheme, responsiveFontSizes } from '@material-ui/core/styles';
 
 const theme = createMuiTheme({
   palette: {
-    type: "dark",
+    type: 'dark',
   },
-})
+});
 
-export default responsiveFontSizes(theme)
+export default responsiveFontSizes(theme);
diff --git a/src/libs/useSmoothScroll.js b/src/libs/useSmoothScroll.js
index 5c6ddb0..95275ad 100644
--- a/src/libs/useSmoothScroll.js
+++ b/src/libs/useSmoothScroll.js
@@ -1,14 +1,14 @@
-import isSmoothScrollSupported from "@utils/isSmoothScrollSupported"
+import isSmoothScrollSupported from '@utils/isSmoothScrollSupported';
 
 export default () => {
   return id => e => {
     if (isSmoothScrollSupported()) {
-      e.preventDefault()
-      document.querySelector("#" + id).scrollIntoView({
-        behavior: "smooth",
-        block: "start",
-        inline: "nearest",
-      })
+      e.preventDefault();
+      document.querySelector('#' + id).scrollIntoView({
+        behavior: 'smooth',
+        block: 'start',
+        inline: 'nearest',
+      });
     }
-  }
-}
+  };
+};
diff --git a/src/pages/404.js b/src/pages/404.js
index bd69103..73abc6d 100644
--- a/src/pages/404.js
+++ b/src/pages/404.js
@@ -1,26 +1,26 @@
-import React from "react"
+import React from 'react';
 
-import { makeStyles } from "@material-ui/core/styles"
-import { Container, Typography } from "@material-ui/core"
-import { Link } from "gatsby-theme-material-ui"
-import Layout from "@components/Layout/Layout"
-import SEO from "@components/SEO"
+import { makeStyles } from '@material-ui/core/styles';
+import { Container, Typography } from '@material-ui/core';
+import { Link } from 'gatsby-theme-material-ui';
+import Layout from '@components/Layout/Layout';
+import SEO from '@components/SEO';
 
 const useStyles = makeStyles(() => ({
   container: {
-    minHeight: "100vh",
-    display: "flex",
-    flexDirection: "column",
-    justifyContent: "center",
-    textAlign: "center",
+    minHeight: '100vh',
+    display: 'flex',
+    flexDirection: 'column',
+    justifyContent: 'center',
+    textAlign: 'center',
   },
   layout: {
-    padding: "0",
+    padding: '0',
   },
-}))
+}));
 
 const NotFoundPage = ({ location }) => {
-  const classes = useStyles()
+  const classes = useStyles();
 
   return (
     <Layout className={classes.layout} showNavbar={false} showFooter={false}>
@@ -44,7 +44,7 @@ const NotFoundPage = ({ location }) => {
         </Typography>
       </Container>
     </Layout>
-  )
-}
+  );
+};
 
-export default NotFoundPage
+export default NotFoundPage;
diff --git a/src/pages/index.js b/src/pages/index.js
index ca66ef6..da9d77a 100644
--- a/src/pages/index.js
+++ b/src/pages/index.js
@@ -1,7 +1,7 @@
-import React from "react"
+import React from 'react';
 
-import HomePage from "@features/HomePage/HomePage"
+import HomePage from '@features/HomePage/HomePage';
 
-const IndexPage = props => <HomePage {...props} />
+const IndexPage = props => <HomePage {...props} />;
 
-export default IndexPage
+export default IndexPage;
diff --git a/src/utils/isSmoothScrollSupported.js b/src/utils/isSmoothScrollSupported.js
index ea4706c..9a95e2f 100644
--- a/src/utils/isSmoothScrollSupported.js
+++ b/src/utils/isSmoothScrollSupported.js
@@ -1 +1 @@
-export default () => "scrollBehavior" in document.documentElement.style
+export default () => 'scrollBehavior' in document.documentElement.style;