m/portfolio
1
0
Fork 0
mirror of https://github.com/kremalicious/portfolio.git synced 2024-12-23 01:29:41 +01:00
Code Releases Activity

switch more images, icon tweaks

Browse Source
This commit is contained in:
Matthias Kretschmann 2018-04-22 23:51:50 +02:00
parent 011ab8dccb
commit 63b6f2cfe4
Signed by: m
GPG Key ID: 606EEEF3C479A91F
29 changed files with 129 additions and 123 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
README.md
View File

@ -10,6 +10,12 @@ npm i
npm start npm start
``` ```
Get SVG images
```js
import { ReactComponent as Logo } from '../../images/logo.svg'
```
## Deployment ## Deployment
```bash ```bash

34
data/projects.json
View File

@ -8,10 +8,20 @@
"oceanprotocol02" "oceanprotocol02"
], ],
"links": [ "links": [
{ "title": "Link", "url": "https://oceanprotocol.com" }, {
{ "title": "GitHub", "url": "https://github.com/oceanprotocol/art" } "title": "Link",
"url": "https://oceanprotocol.com"
},
{
"title": "Styleguide",
"url": "https://oceanprotocol.com/art"
},
{
"title": "GitHub",
"url": "https://github.com/oceanprotocol/art"
}
], ],
"description": "Conceptualizing, executing and iterating on the creative and visual direction of the Ocean Protocol brand. Leading the UI design & development of all Ocean Protocol web properties. \n\nInitial website in collaboration with [Balance](https://balance.io/). Key visuals in collaboration with [Wojciech Hupert](https://twitter.com/wojciechhupert).", "description": "Conceptualizing, executing and iterating on the creative and visual direction of the Ocean Protocol brand. Leading the UI design & development of all Ocean Protocol web properties.\n\nInitial website in collaboration with [Balance](https://balance.io/). Key visuals in collaboration with [Wojciech Hupert](https://twitter.com/wojciechhupert).",
"techstack": [ "techstack": [
"Sketch", "Sketch",
"Affinity Designer", "Affinity Designer",
@ -37,6 +47,10 @@
"title": "Link", "title": "Link",
"url": "https://ipdb.io" "url": "https://ipdb.io"
}, },
{
"title": "Styleguide",
"url": "https://ipdb.io/styleguide/"
},
{ {
"title": "GitHub", "title": "GitHub",
"url": "https://github.com/ipdb/website" "url": "https://github.com/ipdb/website"
@ -84,6 +98,10 @@
"title": "Link", "title": "Link",
"url": "https://2017.9984.io" "url": "https://2017.9984.io"
}, },
{
"title": "Styleguide",
"url": "https://2017.9984.io/styleguide/"
},
{ {
"title": "GitHub", "title": "GitHub",
"url": "https://github.com/9984/2017.9984.io" "url": "https://github.com/9984/2017.9984.io"
@ -116,6 +134,10 @@
"title": "Link", "title": "Link",
"url": "https://www.bigchaindb.com" "url": "https://www.bigchaindb.com"
}, },
{
"title": "Styleguide",
"url": "https://www.bigchaindb.com/styleguide/"
},
{ {
"title": "GitHub", "title": "GitHub",
"url": "https://github.com/bigchaindb/site" "url": "https://github.com/bigchaindb/site"
@ -153,6 +175,10 @@
"title": "Link", "title": "Link",
"url": "https://chartmogul.com/" "url": "https://chartmogul.com/"
}, },
{
"title": "Styleguide",
"url": "https://chartmogul.com/styleguide/"
},
{ {
"title": "Dribbble", "title": "Dribbble",
"url": "https://dribbble.com/kremalicious/projects/311439-ChartMogul" "url": "https://dribbble.com/kremalicious/projects/311439-ChartMogul"
@ -303,7 +329,7 @@
"url": "https://dribbble.com/kremalicious/projects/690029-MLU" "url": "https://dribbble.com/kremalicious/projects/690029-MLU"
} }
], ],
"description": "I worked for over 3 years at the IT services department of [Martin-Luther-Universität Halle-Wittenberg](http://www.uni-halle.de) where I conceptualized & implemented numerous in-house and public facing interfaces for thousands of students and staff.\n\nAdditionally, I conceptualized, designed, created, and maintained the blog network & community for all students & staff.", "description": "From 2009 to 2012 I worked at the IT services department of [Martin-Luther-Universität Halle-Wittenberg](http://www.uni-halle.de) where I conceptualized & implemented numerous in-house and public facing interfaces for thousands of students and staff.\n\nAdditionally, I conceptualized, designed, created, and maintained the blog network & community for all students & staff.",
"techstack": [ "techstack": [
"Photoshop", "Photoshop",
"Illustrator", "Illustrator",

20
gatsby-config.js
View File

@ -9,10 +9,7 @@ module.exports = {
{ {
resolve: 'gatsby-plugin-sass', resolve: 'gatsby-plugin-sass',
options: { options: {
includePaths: [ includePaths: [`${__dirname}/node_modules`, `${__dirname}/src/styles`],
`${__dirname}/node_modules`,
`${__dirname}/src/styles`
],
}, },
}, },
{ {
@ -22,6 +19,13 @@ module.exports = {
path: `${__dirname}/data/`, path: `${__dirname}/data/`,
}, },
}, },
{
resolve: 'gatsby-source-filesystem',
options: {
name: 'images',
path: `${__dirname}/src/images/`,
},
},
{ {
resolve: 'gatsby-plugin-google-analytics', resolve: 'gatsby-plugin-google-analytics',
options: { options: {
@ -31,6 +35,14 @@ module.exports = {
respectDNT: true, respectDNT: true,
}, },
}, },
{
resolve: 'gatsby-plugin-svgr',
options: {
icon: false,
viewBox: true,
// see https://github.com/smooth-code/svgr for a list of all options
},
},
'gatsby-plugin-react-next', 'gatsby-plugin-react-next',
'gatsby-plugin-react-helmet', 'gatsby-plugin-react-helmet',
'gatsby-transformer-json', 'gatsby-transformer-json',

1
package.json
View File

@ -20,6 +20,7 @@
"gatsby-plugin-react-next": "^1.0.11", "gatsby-plugin-react-next": "^1.0.11",
"gatsby-plugin-remove-trailing-slashes": "^1.0.9", "gatsby-plugin-remove-trailing-slashes": "^1.0.9",
"gatsby-plugin-sass": "^1.0.26", "gatsby-plugin-sass": "^1.0.26",
"gatsby-plugin-svgr": "^1.0.0",
"gatsby-source-filesystem": "^1.5.33", "gatsby-source-filesystem": "^1.5.33",
"gatsby-transformer-json": "^1.0.16", "gatsby-transformer-json": "^1.0.16",
"react-helmet": "^5.2.0", "react-helmet": "^5.2.0",

89
src/components/atoms/Icons.js
View File

@ -1,89 +0,0 @@
import React from 'react'
import './Icons.scss'
export const Logo = props => (
<svg width="146" height="146" viewBox="0 0 146 146" {...props}>
<path
d="M307.015625,177.53125 L317.421875,188.078125 L182.421875,322.515625 L172.4375,312.390625 L307.015625,177.53125 Z M307.015625,217.328125 L317.421875,227.875 L222.21875,322.515625 L212.234375,312.390625 L307.015625,217.328125 Z M267.359375,177.53125 L277.625,188.078125 L182.421875,282.71875 L172.4375,272.59375 L267.359375,177.53125 Z"
transform="translate(-172 -177)"
/>
</svg>
)
export const GitHub = props => (
<svg className="icon" viewBox="0 0 20 20" width="20" height="20" {...props}>
<path
d="M13.18,11.309c-0.718,0-1.3,0.807-1.3,1.799c0,0.994,0.582,1.801,1.3,1.801s1.3-0.807,1.3-1.801 C14.479,12.116,13.898,11.309,13.18,11.309z M17.706,6.626c0.149-0.365,0.155-2.439-0.635-4.426c0,0-1.811,0.199-4.551,2.08
c-0.575-0.16-1.548-0.238-2.519-0.238c-0.973,0-1.945,0.078-2.52,0.238C4.74,2.399,2.929,2.2,2.929,2.2 C2.14,4.187,2.148,6.261,2.295,6.626C1.367,7.634,0.8,8.845,0.8,10.497c0,7.186,5.963,7.301,7.467,7.301 c0.342,0,1.018,0.002,1.734,0.002c0.715,0,1.392-0.002,1.732-0.002c1.506,0,7.467-0.115,7.467-7.301 C19.2,8.845,18.634,7.634,17.706,6.626z M10.028,16.915H9.972c-3.771,0-6.709-0.449-6.709-4.115c0-0.879,0.31-1.693,1.047-2.369 c1.227-1.127,3.305-0.531,5.662-0.531c0.01,0,0.02,0,0.029,0c0.01,0,0.018,0,0.027,0c2.357,0,4.436-0.596,5.664,0.531 c0.735,0.676,1.045,1.49,1.045,2.369C16.737,16.466,13.8,16.915,10.028,16.915z M6.821,11.309c-0.718,0-1.3,0.807-1.3,1.799 c0,0.994,0.582,1.801,1.3,1.801c0.719,0,1.301-0.807,1.301-1.801C8.122,12.116,7.54,11.309,6.821,11.309z"
/>
</svg>
)
export const Twitter = props => (
<svg className="icon" viewBox="0 0 20 20" width="20" height="20" {...props}>
<path
d="M17.316,6.246c0.008,0.162,0.011,0.326,0.011,0.488c0,4.99-3.797,10.742-10.74,10.742c-2.133,0-4.116-0.625-5.787-1.697
c0.296,0.035,0.596,0.053,0.9,0.053c1.77,0,3.397-0.604,4.688-1.615c-1.651-0.031-3.046-1.121-3.526-2.621
c0.23,0.043,0.467,0.066,0.71,0.066c0.345,0,0.679-0.045,0.995-0.131c-1.727-0.348-3.028-1.873-3.028-3.703c0-0.016,0-0.031,0-0.047
c0.509,0.283,1.092,0.453,1.71,0.473c-1.013-0.678-1.68-1.832-1.68-3.143c0-0.691,0.186-1.34,0.512-1.898
C3.942,5.498,6.725,7,9.862,7.158C9.798,6.881,9.765,6.594,9.765,6.297c0-2.084,1.689-3.773,3.774-3.773
c1.086,0,2.067,0.457,2.756,1.191c0.859-0.17,1.667-0.484,2.397-0.916c-0.282,0.881-0.881,1.621-1.66,2.088
c0.764-0.092,1.49-0.293,2.168-0.594C18.694,5.051,18.054,5.715,17.316,6.246z"
/>
</svg>
)
export const Dribbble = props => (
<svg className="icon" viewBox="0 0 24 24" width="24" height="24" {...props}>
<path d="M13.626 9.504C14.139 10.469 14.58 11.467 14.96 12.491 16.501 12.19 18.08 12.032 19.692 12.032 20.74 12.032 22.328 12.162 23.484 12.303 23.566 9.437 22.606 6.801 20.895 4.714 18.714 6.748 16.263 8.368 13.626 9.504zM19.692 13.032C18.196 13.032 16.729 13.177 15.296 13.447 16.082 15.86 16.5 18.404 16.5 21 16.5 21.36 16.474 22.007 16.442 22.609 20.205 21.032 22.946 17.511 23.421 13.303 22.287 13.162 20.689 13.032 19.692 13.032zM.641 10.292C1.815 10.423 3.143 10.5 4 10.5 6.821 10.5 9.584 9.983 12.19 9.004 10.636 6.384 8.555 4.066 6.06 2.165 3.196 3.9 1.155 6.843.641 10.292zM15.42 22.983C15.46 22.298 15.5 21.421 15.5 21 15.5 18.475 15.085 16.002 14.311 13.657 10.31 14.598 6.613 16.611 3.386 19.602 5.493 21.987 8.566 23.5 12 23.5 13.191 23.5 14.34 23.319 15.42 22.983z" />
<path d="M13.977 12.707C13.611 11.739 13.183 10.795 12.693 9.883 9.931 10.94 6.998 11.5 4 11.5 3.095 11.5 1.749 11.419.536 11.283.521 11.522.5 11.758.5 12 .5 14.557 1.345 16.911 2.756 18.821 6.072 15.761 9.868 13.691 13.977 12.707zM7.024 1.645C9.506 3.607 11.574 5.974 13.128 8.631 15.704 7.535 18.098 5.958 20.225 3.971 18.137 1.832 15.226.5 12 .5 10.215.5 8.532.919 7.024 1.645z" />
</svg>
)
export const Chain = props => (
<svg className="icon" viewBox="0 0 18 8" width="18" height="8" {...props}>
<path d="M1.9,4 C1.9,2.84 2.84,1.9 4,1.9 L8,1.9 L8,0 L4,0 C1.79,0 0,1.79 0,4 C0,6.21 1.79,8 4,8 L8,8 L8,6.1 L4,6.1 C2.84,6.1 1.9,5.16 1.9,4 Z M14,0 L10,0 L10,1.9 L14,1.9 C15.16,1.9 16.1,2.84 16.1,4 C16.1,5.16 15.16,6.1 14,6.1 L10,6.1 L10,8 L14,8 C16.21,8 18,6.21 18,4 C18,1.79 16.21,0 14,0 Z M6,5 L12,5 L12,3 L6,3 L6,5 Z" />
</svg>
)
export const Blog = props => (
<svg className="icon" viewBox="0 0 22 22" width="22" height="22" {...props}>
<g>
<path d="M0.394,21.61 C0.542,21.757 0.765,21.795 0.945,21.714 L5.533,19.747 L2.254,16.47 L0.287,21.059 C0.207,21.246 0.249,21.464 0.394,21.61 Z" />
<polygon points="6.368 19.169 15.662 9.877 12.136 6.352 2.833 15.635" />
<path d="M21.607,3.224 L18.778,0.395 C18.583,0.201 18.266,0.201 18.071,0.395 L17.682,0.785 C17.276,0.515 16.801,0.37 16.303,0.37 C15.635,0.37 15.007,0.63 14.535,1.103 L8.879,6.761 C8.684,6.956 8.684,7.272 8.879,7.467 C9.075,7.662 9.392,7.661 9.586,7.467 L15.243,1.811 C15.686,1.367 16.385,1.275 16.941,1.527 L12.833,5.634 L16.368,9.17 L21.606,3.931 C21.803,3.736 21.802,3.419 21.607,3.224 Z" />
</g>
</svg>
)
export const Email = props => (
<svg className="icon" viewBox="0 0 22 15" width="22" height="15" {...props}>
<g>
<path d="M11.002,8.36 L21.097,0.33 C20.782,0.123 20.406,0 20.001,0 L2.001,0 C1.614,0 1.255,0.115 0.948,0.307 L11.002,8.36 Z" />
<path d="M21.764,1.076 L11.296,9.391 C11.118,9.525 10.88,9.525 10.702,9.39 L0.26,1.036 C0.1,1.323 0.001,1.648 0,2 L0,13 C0.001,14.103 0.898,15 2.001,15 L19.999,15 C21.102,15 21.999,14.103 22,13 L22,2 C22,1.665 21.91,1.353 21.764,1.076 Z" />
</g>
</svg>
)
export const Index = props => (
<svg className="icon" viewBox="0 0 20 20" width="20" height="20" {...props}>
<rect width="9" height="5" />
<rect width="9" height="5" y="7" />
<rect width="9" height="5" y="14" />
<rect width="9" height="5" x="11" />
<rect width="9" height="5" x="11" y="7" />
<rect width="9" height="5" x="11" y="14" />
</svg>
)
export const Info = props => (
<svg className="icon" viewBox="0 0 20 20" width="20" height="20" {...props}>
<path d="M10,19 C5.02943725,19 1,14.9705627 1,10 C1,5.02943725 5.02943725,1 10,1 C14.9705627,1 19,5.02943725 19,10 C19,14.9705627 14.9705627,19 10,19 Z M11.2903086,6.10848407 C11.2903086,5.93461182 11.2559923,5.77218098 11.1873585,5.62118666 C11.1187247,5.47019234 11.0272144,5.33979011 10.9128247,5.22997606 C10.7984351,5.12016201 10.6611696,5.03322719 10.5010241,4.969169 C10.3408786,4.9051108 10.1738722,4.87308219 10,4.87308219 C9.81697658,4.87308219 9.64768246,4.90739856 9.49211256,4.97603234 C9.33654266,5.04466612 9.19927715,5.1338887 9.08031193,5.24370275 C8.96134671,5.3535168 8.86983638,5.48391903 8.80577818,5.63491335 C8.74171998,5.78590766 8.70969137,5.94376299 8.70969137,6.10848407 C8.70969137,6.44707739 8.83323032,6.7376227 9.08031193,6.98012873 C9.32739354,7.22263476 9.63395317,7.34388595 10,7.34388595 C10.1738722,7.34388595 10.3408786,7.31185733 10.5010241,7.24779914 C10.6611696,7.18374094 10.7984351,7.09680612 10.9128247,6.98699207 C11.0272144,6.87717802 11.1187247,6.7467758 11.1873585,6.59578148 C11.2559923,6.44478716 11.2903086,6.28235631 11.2903086,6.10848407 Z M8.87441162,15.1269178 L11.1255884,15.1269178 L11.1255884,8.2910274 L8.87441162,8.2910274 L8.87441162,15.1269178 Z" />
</svg>
)
export const Download = props => (
<svg className="icon" viewBox="0 0 20 20" width="20" height="20" {...props}>
<path d="M10,19 C14.9707692,19 19,14.9707692 19,10 C19,5.03061538 14.9707692,1 10,1 C5.02923077,1 1,5.03061538 1,10 C1,14.9707692 5.02923077,19 10,19 Z M6.53846154,10.6923077 C6.80846154,10.4223077 7.24738462,10.4223077 7.51738462,10.6923077 L9.30769231,12.4826154 L9.30769231,5.84615385 C9.30769231,5.464 9.61784615,5.15384615 10,5.15384615 C10.3821538,5.15384615 10.6923077,5.464 10.6923077,5.84615385 L10.6923077,12.4826154 L12.4826154,10.6923077 C12.7526154,10.4223077 13.1915385,10.4223077 13.4615385,10.6923077 C13.7315385,10.9623077 13.7315385,11.4012308 13.4615385,11.6712308 L10.4901538,14.644 C10.2201538,14.9126154 9.78123077,14.9126154 9.51123077,14.644 L6.53846154,11.6712308 C6.26846154,11.4012308 6.26846154,10.9623077 6.53846154,10.6923077 Z" />
</svg>
)

28
src/components/molecules/ProjectLinks.js
View File

@ -1,21 +1,31 @@
import React from 'react' import React from 'react'
import PropTypes from 'prop-types' import PropTypes from 'prop-types'
import { OutboundLink } from 'gatsby-plugin-google-analytics' import { OutboundLink } from 'gatsby-plugin-google-analytics'
import { Chain, GitHub, Dribbble, Info, Download } from '../atoms/Icons'
import { ReactComponent as Link } from '../../images/link.svg'
import { ReactComponent as Download } from '../../images/download.svg'
import { ReactComponent as Info } from '../../images/info.svg'
import { ReactComponent as Styleguide } from '../../images/styleguide.svg'
import { ReactComponent as GitHub } from '../../images/github.svg'
import { ReactComponent as Dribbble } from '../../images/dribbble.svg'
import '../atoms/Icons.scss'
import './ProjectLinks.scss' import './ProjectLinks.scss'
const LinkIcon = ({ title }) => { const LinkIcon = props => {
switch (title) { switch (props.title) {
case 'Link': case 'Link':
return <Chain /> return <Link {...props} />
case 'GitHub': case 'GitHub':
return <GitHub /> return <GitHub {...props} />
case 'Dribbble': case 'Dribbble':
return <Dribbble /> return <Dribbble {...props} />
case 'Info': case 'Info':
return <Info /> return <Info {...props} />
case 'Download': case 'Download':
return <Download /> return <Download {...props} />
case 'Styleguide':
return <Styleguide {...props} />
default: default:
return null return null
} }
@ -34,7 +44,7 @@ const ProjectLinks = ({ links }) => (
return ( return (
<li key={title}> <li key={title}>
<OutboundLink href={url}> <OutboundLink href={url}>
<LinkIcon title={title} /> <LinkIcon title={title} className="icon" />
{title} {title}
</OutboundLink> </OutboundLink>
</li> </li>

2
src/components/molecules/ProjectLinks.scss
View File

@ -34,7 +34,7 @@
background: rgba(#fff, .15); background: rgba(#fff, .15);
.icon { .icon {
fill: $brand-grey; fill: $brand-grey-light;
} }
&:hover, &:hover,

6
src/components/molecules/ProjectNav.js
View File

@ -1,8 +1,10 @@
import React from 'react' import React from 'react'
import PropTypes from 'prop-types' import PropTypes from 'prop-types'
import Link from 'gatsby-link' import Link from 'gatsby-link'
import { Index } from '../atoms/Icons'
import images from '../../images' import images from '../../images'
import { ReactComponent as Index } from '../../images/index.svg'
import '../atoms/Icons.scss'
import './ProjectNav.scss' import './ProjectNav.scss'
const ProjectNav = ({ previous, next }) => ( const ProjectNav = ({ previous, next }) => (
@ -24,7 +26,7 @@ const ProjectNav = ({ previous, next }) => (
title="Back to projects" title="Back to projects"
to={'/#projects'} to={'/#projects'}
> >
<Index /> <Index className="icon" />
</Link> </Link>
{next && ( {next && (
<div className="project__nav__item"> <div className="project__nav__item">

25
src/components/molecules/Social.js
View File

@ -1,22 +1,29 @@
import React, { Fragment } from 'react' import React, { Fragment } from 'react'
import PropTypes from 'prop-types' import PropTypes from 'prop-types'
import { OutboundLink } from 'gatsby-plugin-google-analytics' import { OutboundLink } from 'gatsby-plugin-google-analytics'
import { Email, Blog, Twitter, GitHub, Dribbble } from '../atoms/Icons'
import { FadeIn } from '../atoms/Animations' import { FadeIn } from '../atoms/Animations'
import { ReactComponent as Email } from '../../images/email.svg'
import { ReactComponent as Blog } from '../../images/blog.svg'
import { ReactComponent as Twitter } from '../../images/twitter.svg'
import { ReactComponent as GitHub } from '../../images/github.svg'
import { ReactComponent as Dribbble } from '../../images/dribbble.svg'
import '../atoms/Icons.scss'
import './Social.scss' import './Social.scss'
const SocialIcon = ({ title }) => { const SocialIcon = props => {
switch (title) { switch (props.title) {
case 'Email': case 'Email':
return <Email /> return <Email {...props} />
case 'Blog': case 'Blog':
return <Blog /> return <Blog {...props} />
case 'Twitter': case 'Twitter':
return <Twitter /> return <Twitter {...props} />
case 'GitHub': case 'GitHub':
return <GitHub /> return <GitHub {...props} />
case 'Dribbble': case 'Dribbble':
return <Dribbble /> return <Dribbble {...props} />
default: default:
return null return null
} }
@ -38,7 +45,7 @@ const Social = ({ meta, minimal, hide }) => {
key={i} key={i}
title={key} title={key}
> >
<SocialIcon title={key} /> <SocialIcon title={key} className="icon" />
</OutboundLink> </OutboundLink>
))} ))}
</aside> </aside>

2
src/components/organisms/Header.js
View File

@ -2,9 +2,9 @@ import React from 'react'
import Link from 'gatsby-link' import Link from 'gatsby-link'
import PropTypes from 'prop-types' import PropTypes from 'prop-types'
import { FadeIn } from '../atoms/Animations' import { FadeIn } from '../atoms/Animations'
import { Logo } from '../atoms/Icons'
import Social from '../molecules/Social' import Social from '../molecules/Social'
import Availability from '../molecules/Availability' import Availability from '../molecules/Availability'
import { ReactComponent as Logo } from '../../images/logo.svg'
import './Header.scss' import './Header.scss'
const Header = ({ meta, isHomepage }) => { const Header = ({ meta, isHomepage }) => {

3
src/images/blog.svg Normal file
View File

@ -0,0 +1,3 @@
<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 20 20">
<path d="M16.1510073,1.50364152 C13.8691672,-0.0929445285 12.2451332,-0.0582109669 11.6282894,0.0378852202 C11.4548021,0.0645142841 11.3090246,0.160610471 11.2066189,0.296071362 L5.64056749,7.67579542 L2.91416614,11.2915592 C2.58044401,11.7338332 2.38768033,12.2594678 2.357561,12.8047847 L2.00094819,19.3161697 C1.97564796,19.7850728 2.46117148,20.1243039 2.91657569,19.956425 L9.2488627,17.6292764 C9.78257714,17.4324529 10.2464148,17.0909062 10.5813417,16.6463166 L12.8029431,13.6997528 L18.8701801,5.65430213 C18.9774049,5.51189453 19.0207767,5.33822672 18.9906574,5.16455891 C18.8894564,4.5555638 18.4039329,3.07822965 16.1510073,1.50364152 Z M9.26813906,16.3279256 L6.80678778,17.2414183 C6.71040594,17.2773096 6.60318114,17.248365 6.54053294,17.1696356 C6.22367763,16.7817775 5.84658368,16.3973927 5.24540194,15.9771166 C4.6442202,15.5579983 4.14785372,15.3310724 3.66714928,15.1597202 C3.57076744,15.1249866 3.50932401,15.0369949 3.51534788,14.9374254 L3.66233019,12.4065065 L4.32375058,11.5323785 C4.32375058,11.5323785 5.80441662,11.3367128 7.73687255,12.6878484 C9.66691893,14.0378261 9.93076423,15.4526399 9.93076423,15.4526399 L9.26813906,16.3279256 Z"/>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 1.2 KiB

3
src/images/download.svg Normal file
View File

@ -0,0 +1,3 @@
<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 20 20">
<path d="M10,20 C15.5230769,20 20,15.5230769 20,10 C20,4.47846154 15.5230769,0 10,0 C4.47692308,0 0,4.47846154 0,10 C0,15.5230769 4.47692308,20 10,20 Z M6.22106755,11.2861633 C6.51582428,10.9797128 6.99499291,10.9797128 7.28974965,11.2861633 L9.24421351,13.3181656 L9.24421351,5.78577041 C9.24421351,5.35202514 9.58280586,5 10,5 C10.4171941,5 10.7557865,5.35202514 10.7557865,5.78577041 L10.7557865,13.3181656 L12.7102504,11.2861633 C13.0050071,10.9797128 13.4841757,10.9797128 13.7789325,11.2861633 C14.0736892,11.5926138 14.0736892,12.0907922 13.7789325,12.3972427 L10.5350968,15.7713408 C10.2403401,16.0762197 9.76117147,16.0762197 9.46641474,15.7713408 L6.22106755,12.3972427 C5.92631082,12.0907922 5.92631082,11.5926138 6.22106755,11.2861633 Z"/>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 845 B

3
src/images/dribbble.svg Normal file
View File

@ -0,0 +1,3 @@
<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 20 20">
<path d="M11.4194452,7.82956522 C13.7136001,6.84173913 15.8459375,5.43304348 17.7433784,3.66434783 C19.2319256,5.47913043 20.0671129,7.77130435 19.9957739,10.2634783 C18.9900693,10.1408696 17.6085305,10.0278261 16.6967844,10.0278261 C15.2943659,10.0278261 13.9206569,10.1652174 12.5800075,10.4269565 C12.2494125,9.53652174 11.8657484,8.66869565 11.4194452,7.82956522 Z M16.6967844,10.8973913 C17.5641612,10.8973913 18.9543999,11.0104348 19.9409648,11.1330435 C19.5277211,14.7921739 17.1430876,17.853913 13.8693277,19.2252174 C13.8971673,18.7017391 13.9197869,18.1391304 13.9197869,17.826087 C13.9197869,15.5686957 13.5561325,13.3565217 12.872323,11.2582609 C14.1190139,11.0234783 15.3952844,10.8973913 16.6967844,10.8973913 Z M0.122668122,8.51478261 C0.569841278,5.51565217 2.3454841,2.95652174 4.83712596,1.44782609 C7.00774274,3.10086957 8.81818503,5.11652174 10.1701443,7.39478261 C7.90295904,8.24608696 5.49918583,8.69565217 3.04495339,8.69565217 C2.29937481,8.69565217 1.14403249,8.62869565 0.122668122,8.51478261 Z M12.9802013,19.5504348 C12.0406157,19.8426087 11.041001,20 10.0048469,20 C7.01731259,20 4.34384351,18.6843478 2.51078157,16.6104348 C5.3182286,14.0095652 8.53456937,12.2591304 12.0153861,11.4408696 C12.6887558,13.48 13.0498003,15.6304348 13.0498003,17.826087 C13.0498003,18.1921739 13.0150008,18.9547826 12.9802013,19.5504348 Z M11.7248105,10.6147826 C8.15003526,11.4704348 4.8475658,13.2704348 1.96268996,15.9313043 C0.735138748,14.2704348 1.77635684e-15,12.2234783 1.77635684e-15,10 C1.77635684e-15,9.78956522 0.0182697204,9.58434783 0.0313195206,9.37652174 C1.08661337,9.49478261 2.25761545,9.56521739 3.04495339,9.56521739 C5.65317347,9.56521739 8.20484442,9.07826087 10.6077476,8.15913043 C11.0340411,8.95217391 11.4063954,9.77304348 11.7248105,10.6147826 Z M5.67579313,0.995652174 C6.98773305,0.364347826 8.45192064,-1.77635684e-15 10.0048469,-1.77635684e-15 C12.8114239,-1.77635684e-15 15.3439551,1.15826087 17.1604873,3.01826087 C15.3100257,4.74608696 13.2272775,6.1173913 10.9861918,7.07043478 C9.63423254,4.76 7.83510008,2.70173913 5.67579313,0.995652174 Z"/>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 2.1 KiB

3
src/images/email.svg Normal file
View File

@ -0,0 +1,3 @@
<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 20 20">
<path d="M0.637778603,5.39316667 C1.18000075,5.677 8.69111085,9.61166667 8.97111081,9.75791667 C9.25111077,9.90416667 9.61333295,9.9735 9.97777734,9.9735 C10.3422217,9.9735 10.7044439,9.90416667 10.9844439,9.75791667 C11.2644438,9.61166667 18.7755539,5.677 19.3177761,5.39316667 C19.8611093,5.10825 20.4735107,3.4354248 19.3777761,3 L0.578889722,3 C-0.346679687,3.58984375 0.0955564542,5.10825 0.637778603,5.39316667 Z M19.5699983,7.77975 C18.9533317,8.09283333 11.3622216,11.9495 10.9844439,12.1423333 C10.6066661,12.3351667 10.3422217,12.3579167 9.97777734,12.3579167 C9.61333295,12.3579167 9.34888854,12.3351667 8.97111081,12.1423333 C8.59333309,11.9495 1.04555633,8.09175 0.428889743,7.77866667 C-0.00444353233,7.55766667 9.11517064e-07,7.81658333 9.11517064e-07,8.01591667 C9.11517064e-07,8.21525 9.11517077e-07,16.9166667 9.11517077e-07,16.9166667 C9.11517077e-07,17.3716667 0.628889716,18 1.11111187,18 L18.8888873,18 C19.3711094,18 19.9999982,17.3716667 19.9999982,16.9166667 C19.9999982,16.9166667 19.9999982,8.21633333 19.9999982,8.017 C19.9999982,7.81766667 20.0044427,7.55875 19.5699983,7.77975 Z"/>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 1.2 KiB

3
src/images/github.svg Normal file
View File

@ -0,0 +1,3 @@
<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 20 20">
<path d="M13.4592813,11.5103846 C12.6786865,11.5103846 12.0459481,12.4415385 12.0459481,13.5861538 C12.0459481,14.7330769 12.6786865,15.6642308 13.4592813,15.6642308 C14.2398762,15.6642308 14.8726146,14.7330769 14.8726146,13.5861538 C14.8715274,12.4415385 14.2398762,11.5103846 13.4592813,11.5103846 Z M18.3798554,6.10692308 C18.5418452,5.68576923 18.5483682,3.29269231 17.6894965,1 C17.6894965,1 15.7206145,1.22961538 12.7417429,3.4 C12.1166147,3.21538462 11.0587891,3.12538462 10.0031379,3.12538462 C8.94531234,3.12538462 7.88857393,3.21538462 7.26344576,3.4 C4.28348695,1.22961538 2.314605,1 2.314605,1 C1.45682043,3.29269231 1.46551787,5.68576923 1.62533325,6.10692308 C0.616430736,7.27 0,8.66730769 0,10.5734615 C0,18.865 6.48285093,18.9976923 8.11796879,18.9976923 C8.48978416,18.9976923 9.22471745,19 10.0031379,19 C10.7804712,19 11.5164917,18.9976923 11.8861327,18.9976923 C13.5234249,18.9976923 20.0041015,18.865 20.0041015,10.5734615 C20.0041015,8.66730769 19.3887579,7.27 18.3798554,6.10692308 Z M10.0324918,17.9788462 L9.97160972,17.9788462 C5.87185609,17.9788462 2.67772293,17.4607692 2.67772293,13.2307692 C2.67772293,12.2165385 3.01474856,11.2773077 3.81599979,10.4973077 C5.14996895,9.19692308 7.40912781,9.88461538 9.97160972,9.88461538 C9.98248151,9.88461538 9.99335331,9.88461538 10.0031379,9.88461538 C10.0140097,9.88461538 10.0227072,9.88461538 10.0324918,9.88461538 C12.5949737,9.88461538 14.8552197,9.19692308 16.190276,10.4973077 C16.9893529,11.2773077 17.3263786,12.2165385 17.3263786,13.2307692 C17.3263786,17.4607692 14.1333326,17.9788462 10.0324918,17.9788462 Z M6.54590734,11.5103846 C5.76531251,11.5103846 5.13257408,12.4415385 5.13257408,13.5861538 C5.13257408,14.7330769 5.76531251,15.6642308 6.54590734,15.6642308 C7.32758935,15.6642308 7.96032778,14.7330769 7.96032778,13.5861538 C7.96032778,12.4415385 7.32758935,11.5103846 6.54590734,11.5103846 Z"/>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 1.9 KiB

3
src/images/index.svg Normal file
View File

@ -0,0 +1,3 @@
<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 20 20">
<path fill-rule="evenodd" d="M0,0 L9,0 L9,5 L0,5 L0,0 Z M0,7 L9,7 L9,12 L0,12 L0,7 Z M0,14 L9,14 L9,19 L0,19 L0,14 Z M11,0 L20,0 L20,5 L11,5 L11,0 Z M11,7 L20,7 L20,12 L11,12 L11,7 Z M11,14 L20,14 L20,19 L11,19 L11,14 Z"/>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 316 B

3
src/images/info.svg Normal file
View File

@ -0,0 +1,3 @@
<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 20 20">
<path fill-rule="evenodd" d="M10,20 C4.4771525,20 0,15.5228475 0,10 C0,4.4771525 4.4771525,0 10,0 C15.5228475,0 20,4.4771525 20,10 C20,15.5228475 15.5228475,20 10,20 Z M12,5.5 C12,5.28888783 11.9601068,5.09166758 11.8803191,4.90833333 C11.8005315,4.72499908 11.6941496,4.56666733 11.5611702,4.43333333 C11.4281908,4.29999933 11.268618,4.19444483 11.0824468,4.11666667 C10.8962757,4.0388885 10.7021287,4 10.5,4 C10.287233,4 10.0904264,4.04166625 9.90957447,4.125 C9.7287225,4.20833375 9.56914963,4.316666 9.43085106,4.45 C9.2925525,4.583334 9.18617059,4.74166575 9.11170213,4.925 C9.03723367,5.10833425 9,5.299999 9,5.5 C9,5.91111317 9.14361559,6.26388742 9.43085106,6.55833333 C9.71808654,6.85277925 10.074466,7 10.5,7 C10.7021287,7 10.8962757,6.9611115 11.0824468,6.88333333 C11.268618,6.80555517 11.4281908,6.70000067 11.5611702,6.56666667 C11.6941496,6.43333267 11.8005315,6.27500092 11.8803191,6.09166667 C11.9601068,5.90833242 12,5.71111217 12,5.5 Z M9,16 L12,16 L12,8 L9,8 L9,16 Z"/>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 1.1 KiB

3
src/images/link.svg Normal file
View File

@ -0,0 +1,3 @@
<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 20 20">
<path d="M10.0010417,0 C4.48541667,0 0,4.48645833 0,10 C0,15.5135417 4.48541667,20 10.0010417,20 C15.5145833,20 20.0010417,15.5135417 20.0010417,10 C20.0010417,4.48645833 15.5145833,0 10.0010417,0 Z M18.5302083,10 C18.5302083,11.9510417 17.8677083,13.75 16.7635417,15.1875 C16.4510417,14.94375 16.11875,14.284375 16.43125,13.6010417 C16.746875,12.9135417 16.8291667,11.321875 16.75625,10.7020833 C16.6875,10.0833333 16.365625,8.59270833 15.4916667,8.578125 C14.61875,8.565625 14.0197917,8.27708333 13.5010417,7.24166667 C12.425,5.0875 15.5208333,4.67395833 14.4447917,3.48229167 C14.14375,3.146875 12.5875,4.859375 12.359375,2.57708333 C12.3447917,2.41354167 12.5,2.16875 12.709375,1.91458333 C16.0885417,3.05 18.5302083,6.24479167 18.5302083,10 Z M8.82916667,1.55520833 C8.625,1.953125 8.08645833,2.11458333 7.759375,2.41354167 C7.046875,3.05833333 6.740625,2.96875 6.35729167,3.5875 C5.97083333,4.20625 4.725,5.096875 4.725,5.54479167 C4.725,5.99270833 5.35416667,6.51979167 5.66875,6.41770833 C5.98333333,6.31354167 6.81354167,6.31979167 7.30104167,6.490625 C7.78958333,6.66354167 11.378125,6.83645833 10.234375,9.86979167 C9.871875,10.834375 8.28333333,10.671875 7.86041667,12.26875 C7.796875,12.503125 7.57708333,13.5041667 7.56354167,13.83125 C7.5375,14.3375 7.921875,16.2458333 7.43333333,16.2458333 C6.94270833,16.2458333 5.62291667,14.5385417 5.62291667,14.2291667 C5.62291667,13.9197917 5.28125,12.8354167 5.28125,11.90625 C5.28125,10.978125 3.7,10.9927083 3.7,9.75833333 C3.7,8.64583333 4.55729167,8.09166667 4.36458333,7.55729167 C4.17604167,7.02604167 2.66979167,7.00833333 2.04166667,6.94270833 C3.13854167,4.09791667 5.71875,1.98645833 8.82916667,1.55520833 Z M7.31770833,18.09375 C7.83020833,17.8229167 7.88229167,17.4729167 8.346875,17.4552083 C8.878125,17.43125 9.31041667,17.2479167 9.909375,17.115625 C10.440625,17 11.3916667,16.4604167 12.228125,16.3916667 C12.934375,16.334375 14.3270833,16.428125 14.7020833,17.109375 C13.353125,18.00625 11.7354167,18.5291667 10,18.5291667 C9.06354167,18.5291667 8.16145833,18.3739583 7.31770833,18.09375 Z"/>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 2.1 KiB

BIN
src/images/portfolio-allinnia-01.png
View File

Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 73 KiB

After

Width:  |  Height:  |  Size: 91 KiB

BIN
src/images/portfolio-allinnia-02.png
View File

Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 152 KiB

After

Width:  |  Height:  |  Size: 154 KiB

BIN
src/images/portfolio-allinnia.png
View File

Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 1.3 MiB

After

Width:  |  Height:  |  Size: 2.4 MiB

BIN
src/images/portfolio-coffeecup.png
View File

Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 317 KiB

After

Width:  |  Height:  |  Size: 319 KiB

BIN
src/images/portfolio-unihalle-01.png
View File

Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 426 KiB

After

Width:  |  Height:  |  Size: 428 KiB

BIN
src/images/portfolio-unihalle-02.png
View File

Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 148 KiB

After

Width:  |  Height:  |  Size: 150 KiB

BIN
src/images/portfolio-unihalle.png
View File

Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 463 KiB

After

Width:  |  Height:  |  Size: 742 KiB

3
src/images/styleguide.svg Normal file
View File

@ -0,0 +1,3 @@
<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 20 20">
<path d="M2.99299081,6.34225172 C2.55843094,5.97869048 1.90710479,6.04101526 1.54651255,6.47936625 L0.234614304,8.07799698 C-0.124950604,8.51738672 -0.0643382341,9.17699069 0.369194312,9.53951319 L8.47276001,16.3349922 L4.56172114,7.65730468 L2.99299081,6.34225172 Z M6.93176755,2.89880736 L5.06203003,3.75992813 C4.5493932,3.99676232 4.32029899,4.61689393 4.55350251,5.13522839 L8.91964783,14.8215387 L9.13846876,5.28688536 L8.29400489,3.41298683 C8.05771938,2.89361362 7.4454317,2.66197317 6.93176755,2.89880736 Z M14.3264767,3.11071162 C14.339832,2.5394011 13.8878075,2.06157775 13.3238043,2.04807404 L11.2691477,2.00029171 C10.7051444,1.986788 10.2325734,2.44383643 10.2192181,3.01410821 L9.97368667,13.6539877 L14.2781923,5.17054577 L14.3264767,3.11071162 Z M19.4425717,4.09752072 L17.6149546,3.14914524 C17.1125911,2.88945864 16.4890028,3.09201419 16.2311434,3.59996119 L9.66548818,16.5385865 C9.40762877,17.0465335 9.60795779,17.6770526 10.1113487,17.937778 L11.9389657,18.8861534 C12.4413293,19.1468788 13.0638902,18.9443232 13.3217496,18.4363762 L19.8874049,5.49775089 C20.1452643,4.9877264 19.9449352,4.35824607 19.4425717,4.09752072 Z M12.8758891,17.0361461 C12.6170024,17.5472093 11.9975234,17.7487261 11.4931052,17.486962 C10.9876597,17.2251979 10.7893854,16.5998726 11.0482721,16.0888093 C11.3071588,15.5777461 11.9256105,15.377268 12.431056,15.6390321 C12.9365015,15.8997575 13.1347759,16.5261216 12.8758891,17.0361461 Z"/>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 1.5 KiB

3
src/images/twitter.svg Normal file
View File

@ -0,0 +1,3 @@
<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 20 20">
<path d="M20,4.07466667 C19.2746391,4.39733333 18.6633399,4.408 18.0155053,4.08888889 C18.8513634,3.58933333 18.889681,3.23822222 19.1917662,2.29422222 C18.4093744,2.75733333 17.5423276,3.09422222 16.6200321,3.27555556 C15.8821957,2.49155556 14.8297986,2 13.6651221,2 C11.4284441,2 9.61593299,3.80977778 9.61593299,6.03911111 C9.61593299,6.35555556 9.65157726,6.664 9.72019248,6.96 C6.35537337,6.792 3.37105685,5.184 1.37408662,2.73955556 C1.02566387,3.336 0.826055962,4.03022222 0.826055962,4.77066667 C0.826055962,6.17244444 1.54161469,7.408 2.62698271,8.13244444 C1.96310818,8.11111111 1.33933345,7.92977778 0.793976118,7.62755556 C0.793085012,7.64444444 0.793085012,7.66044444 0.793085012,7.67822222 C0.793085012,9.63555556 2.18855819,11.2675556 4.04206024,11.6391111 C3.44858314,11.8 2.8230262,11.8248889 2.21261807,11.7093333 C2.72856888,13.3128889 4.22384602,14.4808889 5.99536624,14.5137778 C4.26216361,15.8684444 2.11370522,16.4328889 0,16.1857778 C1.79290679,17.3315556 3.91997861,18 6.20744965,18 C13.6553199,18 17.7276778,11.8453333 17.7276778,6.50755556 C17.7276778,6.33155556 17.7250045,6.15822222 17.7169845,5.98488889 C18.5073962,5.416 19.457316,4.88533333 20,4.07466667 Z"/>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 1.3 KiB

5
src/layouts/index.js
View File

@ -5,7 +5,7 @@ import TransitionGroup from 'react-transition-group/TransitionGroup'
import Head from '../components/atoms/Head' import Head from '../components/atoms/Head'
import Header from '../components/organisms/Header' import Header from '../components/organisms/Header'
import Footer from '../components/organisms/Footer' import Footer from '../components/organisms/Footer'
import { FadeIn } from '../components/atoms/Animations' import { FadeIn } from '../components/atoms/Animations'
import './index.scss' import './index.scss'
class TransitionHandler extends Component { class TransitionHandler extends Component {
@ -31,7 +31,8 @@ const TemplateWrapper = ({ data, location, children }) => {
<TransitionGroup appear={true}> <TransitionGroup appear={true}>
<FadeIn <FadeIn
key={location.pathname} key={location.pathname}
timeout={{ enter: 300, exit: 200, appear: 300 }}> timeout={{ enter: 300, exit: 200, appear: 300 }}
>
<TransitionHandler location={location}> <TransitionHandler location={location}>
{children()} {children()}
</TransitionHandler> </TransitionHandler>

4
src/templates/Project.js
View File

@ -1,4 +1,4 @@
import React from 'react' import React, { Component } from 'react'
import PropTypes from 'prop-types' import PropTypes from 'prop-types'
import Helmet from 'react-helmet' import Helmet from 'react-helmet'
import ReactMarkdown from 'react-markdown' import ReactMarkdown from 'react-markdown'
@ -11,7 +11,7 @@ import ProjectNav from '../components/molecules/ProjectNav'
import images from '../images' import images from '../images'
import './Project.scss' import './Project.scss'
class Project extends React.Component { class Project extends Component {
constructor() { constructor() {
super() super()
} }