Minor content change to header; refactor project structure; prettier-standard everything

src/components/ClearButton/index.js

@@ -1,7 +1,7 @@
 // @flow
-import React from "react"
+import React from 'react'
 
-import "./index.css"
+import './index.css'
 
 type Props = {
   href: string,
@@ -9,9 +9,9 @@ type Props = {
 }
 
 class ClearButton extends React.PureComponent<Props> {
-  render() {
+  render () {
     return (
-      <a className="clear-button" href={this.props.href}>
+      <a className='clear-button' href={this.props.href}>
         {this.props.children}
       </a>
     )

src/components/Contact/index.css

@@ -1,18 +0,0 @@
-.contact-container {
-  text-align: center;
-}
-
-.contact-container img {
-  margin-left: 12px;
-}
-
-.contact-container p {
-  background-color: rgb(216, 221, 233);
-  border-radius: 5px;
-  color: rgb(46, 51, 64);
-  font-family: "IBM Plex Mono", monospace;
-  margin: 10% auto;
-  padding: 5px;
-  user-select: all;
-  width: 150px;
-}

src/components/Contact/index.js

@@ -1,22 +0,0 @@
-// @flow
-import React from "react"
-
-import "./index.css"
-import linkedIn from "../../images/In-2C-128px-TM.png"
-
-type Props = {}
-
-class Contact extends React.PureComponent<Props> {
-  render() {
-    return (
-      <div className="contact-container">
-        <p>m@mjfs.us</p>
-        <a href="https://www.linkedin.com/in/mitchelljfsimon/">
-          <img src={linkedIn} alt="LinkedIn" />
-        </a>
-      </div>
-    )
-  }
-}
-
-export default Contact

src/components/Header/index.js

@@ -1,18 +1,23 @@
 // @flow
-import React from "react"
+import React from 'react'
 
-import SmallText from "../SmallText"
+import SmallText from '../SmallText'
 
-import "./index.css"
+import './index.css'
 
 type Props = {}
 
 class Header extends React.PureComponent<Props> {
-  render() {
+  render () {
     return (
-      <div className="header-container">
+      <div className='header-container'>
         <h2>Mitchell J. F. Simon</h2>
-        <SmallText>Backend Engineer, TV Time</SmallText>
+        <SmallText>
+          Software engineer;&nbsp;
+          <span style={{ display: 'inline-block' }}>
+            cloud-native web services and clients
+          </span>
+        </SmallText>
       </div>
     )
   }

src/components/Home/index.css

@@ -1,25 +0,0 @@
-.home-container p {
-  text-align: left;
-}
-
-.home-container img {
-  border-radius: 3px;
-  display: block;
-  float: left;
-  margin-bottom: 100%;
-  margin-right: 1%;
-  width: 37%;
-}
-
-.signature {
-  float: right;
-  font-style: italic;
-  margin-right: 3%;
-}
-
-@media screen and (max-width: 500px) {
-  .home-container img {
-    margin: 5%;
-    width: 90%;
-  }
-}

src/components/Home/index.js

@@ -1,40 +0,0 @@
-// @flow
-import React from 'react'
-
-import './index.css'
-import profile from '../../images/profile.jpg'
-
-type Props = {}
-
-class Home extends React.PureComponent<Props> {
-  render () {
-    return (
-      <div className='home-container'>
-        <img src={profile} alt='Profile' />
-        <p>Hello and welcome,</p>
-        <p>
-          I am a software developer, with most of my experience in web services.
-          More specifically, for the past year, I have been focused on Go web
-	  services with cloud-native architectures. Tech that I love working
-	  with includes Go, TypeScript, gRPC, Serverless, Docker, Redis, and
-	  PostgreSQL. Concepts that I am currently focused on are Docker
-	  containerization and orchestration, microservices software architecture
-	  w/ dependency injection, and infrastructure as code using Terraform.
-        </p>
-        <p>
-          My professional interests, aside from the above, include software
-          architecture, system administration, development tools, and business
-          development. My personal interests include music performance, skiing,
-          and politics.
-        </p>
-        <p>
-          Thank you for reading my quick bio. If you would like to contact me
-          visit the contact page for all of your options.
-        </p>
-        <p className='signature'>- Mitchell J. F. Simon, III</p>
-      </div>
-    )
-  }
-}
-
-export default Home

src/components/Job/index.js

@@ -1,8 +1,8 @@
 // @flow
-import * as React from "react"
+import * as React from 'react'
 
-import SmallText from "../../components/SmallText"
-import "./index.css"
+import SmallText from '../../components/SmallText'
+import './index.css'
 
 type Props = {
   title: string,
@@ -14,7 +14,7 @@ type Props = {
 class Experience extends React.PureComponent<Props> {
   listedBullets: Array<React.Element<string>>
 
-  constructor(props: Props) {
+  constructor (props: Props) {
     super(props)
 
     this.listedBullets = this.props.bullets.map((bullet, index) => (
@@ -22,11 +22,11 @@ class Experience extends React.PureComponent<Props> {
     ))
   }
 
-  render() {
+  render () {
     return (
-      <div className="job-container">
-        <div className="job-title">{this.props.title}</div>
-        <div className="job-company">{this.props.company}</div>
+      <div className='job-container'>
+        <div className='job-title'>{this.props.title}</div>
+        <div className='job-company'>{this.props.company}</div>
         <SmallText>{this.props.timeSpan}</SmallText>
         <ul>{this.listedBullets}</ul>
       </div>

src/components/Navbar/index.js

@@ -1,11 +1,11 @@
 // @flow
-import * as React from "react"
-import { NavLink } from "react-router-dom"
-import FontAwesomeIcon from "@fortawesome/react-fontawesome"
-import faBars from "@fortawesome/fontawesome-free-solid/faBars"
+import * as React from 'react'
+import { NavLink } from 'react-router-dom'
+import FontAwesomeIcon from '@fortawesome/react-fontawesome'
+import faBars from '@fortawesome/fontawesome-free-solid/faBars'
 
-import "./index.css"
-import { routes } from "../../routes/routes.js"
+import './index.css'
+import { routes } from '../../routes/routes.js'
 
 const changeMenu = 800
 
@@ -18,7 +18,7 @@ type State = {
 class Navbar extends React.Component<Props, State> {
   buttons: Array<NavLink<string>>
 
-  constructor(props: Props) {
+  constructor (props: Props) {
     super(props)
 
     if (window.innerWidth <= changeMenu) {
@@ -30,8 +30,8 @@ class Navbar extends React.Component<Props, State> {
     this.buttons = routes.map(route => (
       <NavLink
         key={route.name}
-        className="navbar-menu-button"
-        activeClassName="active-button"
+        className='navbar-menu-button'
+        activeClassName='active-button'
         exact={route.exact}
         to={route.path}
         onClick={this.closeMenu}
@@ -56,7 +56,7 @@ class Navbar extends React.Component<Props, State> {
     }
   }
 
-  render() {
+  render () {
     let menuButton: ?React.Element<string>
 
     if (this.isMobile()) {
@@ -64,8 +64,8 @@ class Navbar extends React.Component<Props, State> {
         <div
           className={
             this.state.showMenu
-              ? "navbar-button navbar-button-closed"
-              : "navbar-button"
+              ? 'navbar-button navbar-button-closed'
+              : 'navbar-button'
           }
           onClick={this.toggleMenu}
         >
@@ -75,10 +75,10 @@ class Navbar extends React.Component<Props, State> {
     }
 
     return (
-      <div className="navbar">
+      <div className='navbar'>
         {menuButton}
         {this.state.showMenu ? (
-          <div className="navbar-menu">{this.buttons}</div>
+          <div className='navbar-menu'>{this.buttons}</div>
         ) : null}
       </div>
     )

src/components/Project/index.js

@@ -1,9 +1,9 @@
 // @flow
-import * as React from "react"
+import * as React from 'react'
 
-import ClearButton from "../../components/ClearButton"
+import ClearButton from '../../components/ClearButton'
 
-import "./index.css"
+import './index.css'
 
 type Badge = {
   imgUrl: string,
@@ -21,15 +21,15 @@ type Props = {
 class Project extends React.PureComponent<Props> {
   renderBadges = (badges: Array<Badge>) => {
     return this.props.badges.map((badge, index) => (
-      <a className="project-badge" href={badge.linkUrl} key={index}>
+      <a className='project-badge' href={badge.linkUrl} key={index}>
         <img src={badge.imgUrl} alt={badge.alt} />
       </a>
     ))
   }
 
-  render() {
+  render () {
     return (
-      <div className="project-container">
+      <div className='project-container'>
         <h4>{this.props.title}</h4>
         {this.renderBadges(this.props.badges)}
         <p>{this.props.children}</p>

src/components/SmallText/index.js

@@ -1,15 +1,15 @@
 // @flow
-import React from "react"
+import React from 'react'
 
-import "./index.css"
+import './index.css'
 
 type Props = {
   children: string
 }
 
 class SmallText extends React.PureComponent<Props> {
-  render() {
-    return <div className="small-text">{this.props.children}</div>
+  render () {
+    return <div className='small-text'>{this.props.children}</div>
   }
 }