readme update

README.md

@@ -1,5 +1,5 @@
 <p align="center">
-  <a href="https://matthiaskretschmann.com"><img src="src/images/twitter-card.png" /></a>
+  <a href="https://matthiaskretschmann.com"><img src="src/images/github-header.png" /></a>
  </p>
 <p align="center">
   <strong>👔 Portfolio thingy, built with <a href="https://www.gatsbyjs.org">Gatsby</a>.</strong>
@@ -16,61 +16,61 @@
 
 ## Table of Contents
 
-- [Features](#features)
+- [🎉 Features](#features)
-  - [Lighthouse score](#lighthouse-score)
+  - [⛵️ Lighthouse score](#lighthouse-score)
-  - [One data file to rule all pages](#one-data-file-to-rule-all-pages)
+  - [💍 One data file to rule all pages](#one-data-file-to-rule-all-pages)
-  - [Theme switcher](#theme-switcher)
+  - [💅 Theme switcher](#theme-switcher)
-  - [SEO component](#seo-component)
+  - [🏆 SEO component](#seo-component)
-  - [Client-side vCard creation](#client-side-vcard-creation)
+  - [📇 Client-side vCard creation](#client-side-vcard-creation)
-  - [Matomo (formerly Piwik) analytics tracking](#matomo-formerly-piwik-analytics-tracking)
+  - [📈 Matomo (formerly Piwik) analytics tracking](#matomo-formerly-piwik-analytics-tracking)
-  - [Project images](#project-images)
+  - [🖼 Project images](#project-images)
-  - [Importing SVG assets](#importing-svg-assets)
+  - [💎 Importing SVG assets](#importing-svg-assets)
-  - [Typekit component](#typekit-component)
+  - [🍬 Typekit component](#typekit-component)
-- [Development](#development)
+- [✨ Development](#development)
-  - [Linting](#linting)
+  - [🔮 Linting](#linting)
-  - [Add a new project](#add-a-new-project)
+  - [🎈 Add a new project](#add-a-new-project)
-- [Deployment](#deployment)
+- [🚚 Deployment](#deployment)
-- [Licenses](#licenses)
+- [🏛 Licenses](#licenses)
 
 ---
 
-## Features
+## 🎉 Features
 
 The whole [portfolio](https://matthiaskretschmann.com) is a React-based Single Page App built with [Gatsby v2](https://www.gatsbyjs.org).
 
-### Lighthouse score
+### ⛵️ Lighthouse score
 
 [![Lighthouse scores](https://lighthouse.now.sh/?perf=100&pwa=100&a11y=100&bp=100&seo=100)](https://travis-ci.com/kremalicious/portfolio)
 
-### One data file to rule all pages
+### 💍 One data file to rule all pages
 
 All content is powered by one YAML file, [`data/projects.yml`](data/projects.yml) where all the portfolio's projects are defined. The project description itself is transformed from Markdown.
 
 Gatsby automatically creates pages from each item in that file utilizing the [`src/templates/Project.jsx`](src/templates/Project.jsx) template.
 
-### Theme switcher
+### 💅 Theme switcher
 
 Includes a theme switcher which allows user to toggle between a light and a dark theme. Switching between them also happens automatically based on time of day.
 
 If you want to know how, have a look at the respective component under [`src/components/molecules/ThemeSwitch.jsx`](src/components/molecules/ThemeSwitch.jsx)
 
-### SEO component
+### 🏆 SEO component
 
 Includes a SEO component which automatically switches all required `meta` tags for search engines, Twitter Cards, and Facebook OpenGraph tags based on the browsed route/page.
 
 If you want to know how, have a look at the respective component under [`src/components/atoms/SEO.jsx`](src/components/atoms/SEO.jsx)
 
-### Client-side vCard creation
+### 📇 Client-side vCard creation
 
 The _Add to addressbook_ link in the footer automatically creates a downloadable vCard file on the client-side, based on data defined in `data/meta.yml`.
 
 If you want to know how, have a look at the respective component under [`src/components/atoms/Vcard.jsx`](src/components/atoms/Vcard.jsx)
 
-### Matomo (formerly Piwik) analytics tracking
+### 📈 Matomo (formerly Piwik) analytics tracking
 
 Site sends usage statistics to my own [Matomo](https://matomo.org) installation. To make this work in Gatsby, I created and open sourced a plugin, [gatsby-plugin-matomo](https://github.com/kremalicious/gatsby-plugin-matomo), which is in use on this site.
 
-### Project images
+### 🖼 Project images
 
 All project images live under `src/images` and are automatically attached to each project based on the inclusion of the project's `slug` in their filenames.
 
@@ -80,7 +80,7 @@ All together, Gatsby automatically generates all required image sizes for delive
 
 All project images use one single component defined in [`src/components/atoms/ProjectImage.jsx`](src/components/atoms/ProjectImage.jsx). In there, one main GraphQL query fragment is defined, which then gets used throughout other GraphQL queries.
 
-### Importing SVG assets
+### 💎 Importing SVG assets
 
 All SVG assets under `src/images/` will be converted to React components before every build. Makes use of `SVGR` so SVG assets can be imported like so:
 
@@ -90,13 +90,13 @@ import Logo from './components/svg/Logo'
 
 That's done with a simple bash script under [`src/scripts/svg.sh`](src/scripts/svg.sh)
 
-### Typekit component
+### 🍬 Typekit component
 
 Includes a component for adding the Typekit snippet.
 
 If you want to know how, have a look at the respective component under [`src/components/atoms/Typekit.jsx`](src/components/atoms/Typekit.jsx)
 
-## Development
+## ✨ Development
 
 ```bash
 git clone git@github.com:kremalicious/portfolio.git
@@ -106,7 +106,7 @@ npm i
 npm start
 ```
 
-### Linting
+### 🔮 Linting
 
 ESlint, Prettier, and Stylelint are setup for all linting purposes:
 
@@ -121,7 +121,7 @@ npm run format
 npm run format:css
 ```
 
-### Add a new project
+### 🎈 Add a new project
 
 To add a new project, run the following command. This adds a new item to the top of the `projects.yml` file, creating the title & slug from the argument:
 
@@ -140,7 +140,7 @@ portfolio-SLUG-03.png
 ...
 ```
 
-## Deployment
+## 🚚 Deployment
 
 Automatic deployments are triggered upon successful tests & builds on Travis:
 
@@ -155,7 +155,7 @@ npm run deploy
 
 The deploymeng script can be used locally too, the branch checks are only happening for Travis builds, allowing to deploy any branch from local machine.
 
-## Licenses
+## 🏛 Licenses
 
 All images and projects are plain ol' copyright: