m
/
portfolio
mirror of https://github.com/kremalicious/portfolio.git
1
0
Fork 0
Code Releases Activity

Migrate to Framer Motion (#656) 

* migrate to Framer Motion

* animation tweaks

* faster animations

* handle reduced motion

* handle SSR
This commit is contained in:
Matthias Kretschmann 2021-09-11 21:37:38 +02:00 committed by GitHub
parent 49e143e04b
commit b315f5bbb0
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
12 changed files with 259 additions and 575 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
README.md
View File

@ -98,7 +98,7 @@ If you want to know how, have a look at the respective component:
### 💫 Page transitions
Includes mechanism for transitioning between route changes with full page transitions defined with [react-pose](https://popmotion.io/pose/). Mechanism ~~stolen~~ inspired by [gatsby-universal](https://github.com/fabe/gatsby-universal).
Includes mechanism for transitioning between route changes with full page transitions defined with [Framer Motion](https://www.framer.com/motion/).
If you want to know how, have a look at the respective components:

13
gatsby-browser.js
View File

@ -11,6 +11,19 @@ if (typeof window !== 'undefined' && !window.IntersectionObserver) {
// Layout with Page Transitions
export const wrapPageElement = wrapPageElementWithLayout
export const shouldUpdateScroll = ({
routerProps: { location },
getSavedScrollPosition
}) => {
if (location.action === 'PUSH') {
window.setTimeout(() => window.scrollTo(0, 0), 200)
} else {
const savedPosition = getSavedScrollPosition(location)
window.setTimeout(() => window.scrollTo(...(savedPosition || [0, 0])), 200)
}
return false
}
// Display a message when a service worker updates
// https://www.gatsbyjs.org/docs/add-offline-support-with-a-service-worker/#displaying-a-message-when-a-service-worker-updates
export const onServiceWorkerUpdateReady = () => {

41
gatsby-node.js
View File

@ -3,13 +3,13 @@
const remark = require('remark')
const parse = require('remark-parse')
const html = require('remark-html')
const axios = require('axios')
const fs = require('fs')
const yaml = require('js-yaml')
const reposYaml = yaml.load(fs.readFileSync('./content/repos.yml', 'utf8'))
const { performance } = require('perf_hooks')
const chalk = require('chalk')
const { execSync } = require('child_process')
const { getGithubRepos } = require('./scripts/github')
function truncate(n, useWordBoundary) {
if (this.length <= n) {
@ -30,45 +30,6 @@ execSync(`node ./scripts/fetch-matomo-js > static/matomo.js`, {
stdio: 'inherit'
})
//
// Get GitHub repos
//
const gitHubConfig = {
headers: {
'User-Agent': 'kremalicious/portfolio',
Authorization: `token ${process.env.GATSBY_GITHUB_TOKEN}`
}
}
async function getGithubRepos(data) {
let repos = []
let holder = {}
for (let item of data) {
const user = item.split('/')[0]
const repoName = item.split('/')[1]
const repo = await axios.get(
`https://api.github.com/repos/${user}/${repoName}`,
gitHubConfig
)
holder.name = repo.data.name
holder.full_name = repo.data.full_name
holder.description = repo.data.description
holder.html_url = repo.data.html_url
holder.homepage = repo.data.homepage
holder.stargazers_count = repo.data.stargazers_count
holder.pushed_at = repo.data.pushed_at
repos.push(holder)
holder = {}
}
// sort by pushed to, newest first
repos = repos.sort((a, b) => b.pushed_at.localeCompare(a.pushed_at))
return repos
}
//
// Get GitHub repos once and store for later build stages
//

625
package-lock.json generated
View File

@ -12,6 +12,7 @@
"@giphy/js-fetch-api": "^4.1.2",
"axios": "^0.21.4",
"file-saver": "^2.0.5",
"framer-motion": "^4.1.17",
"gatsby": "^3.13.0",
"gatsby-plugin-image": "^1.13.0",
"gatsby-plugin-manifest": "^3.13.0",
@ -32,7 +33,6 @@
"react-dom": "^17.0.2",
"react-feather": "^2.0.9",
"react-helmet": "^6.1.0",
"react-pose": "^4.0.10",
"remark": "^13.0.0",
"remark-breaks": "^2.0.2",
"remark-html": "^13.0.2",
@ -1869,19 +1869,6 @@
"node": ">=4.0.0"
}
},
"node_modules/@emotion/is-prop-valid": {
"version": "0.7.3",
"resolved": "https://registry.npmjs.org/@emotion/is-prop-valid/-/is-prop-valid-0.7.3.tgz",
"integrity": "sha512-uxJqm/sqwXw3YPA5GXX365OBcJGFtxUVkB6WyezqFHlNe9jqUWH5ur2O2M8dGBz61kn1g3ZBlzUunFQXQIClhA==",
"dependencies": {
"@emotion/memoize": "0.7.1"
}
},
"node_modules/@emotion/memoize": {
"version": "0.7.1",
"resolved": "https://registry.npmjs.org/@emotion/memoize/-/memoize-0.7.1.tgz",
"integrity": "sha512-Qv4LTqO11jepd5Qmlp3M1YEjBumoTHcHFdgPTQ+sFlIL5myi/7xu/POwP7IRu6odBdmLXdtIs1D6TuW6kbwbbg=="
},
"node_modules/@endemolshinegroup/cosmiconfig-typescript-loader": {
"version": "3.0.2",
"resolved": "https://registry.npmjs.org/@endemolshinegroup/cosmiconfig-typescript-loader/-/cosmiconfig-typescript-loader-3.0.2.tgz",
@ -3380,23 +3367,6 @@
"integrity": "sha512-88p7+M0QGxKpmnkfXjS4V26AnoC/eiqZutE8GLdaI5X12NY75bXSdTY9NkmYb2Xyk1O+MmkuO6Frmsj84V6I8Q==",
"dev": true
},
"node_modules/@popmotion/easing": {
"version": "1.0.2",
"resolved": "https://registry.npmjs.org/@popmotion/easing/-/easing-1.0.2.tgz",
"integrity": "sha512-IkdW0TNmRnWTeWI7aGQIVDbKXPWHVEYdGgd5ZR4SH/Ty/61p63jCjrPxX1XrR7IGkl08bjhJROStD7j+RKgoIw=="
},
"node_modules/@popmotion/popcorn": {
"version": "0.4.4",
"resolved": "https://registry.npmjs.org/@popmotion/popcorn/-/popcorn-0.4.4.tgz",
"integrity": "sha512-jYO/8319fKoNLMlY4ZJPiPu8Ea8occYwRZhxpaNn/kZsK4QG2E7XFlXZMJBsTWDw7I1i0uaqyC4zn1nwEezLzg==",
"dependencies": {
"@popmotion/easing": "^1.0.1",
"framesync": "^4.0.1",
"hey-listen": "^1.0.8",
"style-value-types": "^3.1.7",
"tslib": "^1.10.0"
}
},
"node_modules/@sideway/address": {
"version": "4.1.2",
"resolved": "https://registry.npmjs.org/@sideway/address/-/address-4.1.2.tgz",
@ -3985,11 +3955,6 @@
"@types/node": "*"
}
},
"node_modules/@types/invariant": {
"version": "2.2.35",
"resolved": "https://registry.npmjs.org/@types/invariant/-/invariant-2.2.35.tgz",
"integrity": "sha512-DxX1V9P8zdJPYQat1gHyY0xj3efl8gnMVjiM9iCY6y27lj+PoQWkgjt8jDqmovPqULkKVpKRg8J36iQiA+EtEg=="
},
"node_modules/@types/istanbul-lib-coverage": {
"version": "2.0.3",
"resolved": "https://registry.npmjs.org/@types/istanbul-lib-coverage/-/istanbul-lib-coverage-2.0.3.tgz",
@ -10058,11 +10023,6 @@
"url": "https://github.com/sponsors/wooorm"
}
},
"node_modules/estree-walker": {
"version": "0.6.1",
"resolved": "https://registry.npmjs.org/estree-walker/-/estree-walker-0.6.1.tgz",
"integrity": "sha512-SqmZANLWS0mnatqbSfRP5g8OXZC12Fgg1IwNtLsyHDzJizORW4khDfjPqJZsemPWBB2uqykUah5YpQ6epsqC/w=="
},
"node_modules/esutils": {
"version": "2.0.3",
"resolved": "https://registry.npmjs.org/esutils/-/esutils-2.0.3.tgz",
@ -11203,14 +11163,73 @@
"node": ">=0.10.0"
}
},
"node_modules/framesync": {
"version": "4.1.0",
"resolved": "https://registry.npmjs.org/framesync/-/framesync-4.1.0.tgz",
"integrity": "sha512-MmgZ4wCoeVxNbx2xp5hN/zPDCbLSKiDt4BbbslK7j/pM2lg5S0vhTNv1v8BCVb99JPIo6hXBFdwzU7Q4qcAaoQ==",
"node_modules/framer-motion": {
"version": "4.1.17",
"resolved": "https://registry.npmjs.org/framer-motion/-/framer-motion-4.1.17.tgz",
"integrity": "sha512-thx1wvKzblzbs0XaK2X0G1JuwIdARcoNOW7VVwjO8BUltzXPyONGAElLu6CiCScsOQRI7FIk/45YTFtJw5Yozw==",
"dependencies": {
"hey-listen": "^1.0.5"
"framesync": "5.3.0",
"hey-listen": "^1.0.8",
"popmotion": "9.3.6",
"style-value-types": "4.1.4",
"tslib": "^2.1.0"
},
"optionalDependencies": {
"@emotion/is-prop-valid": "^0.8.2"
},
"peerDependencies": {
"react": ">=16.8 || ^17.0.0",
"react-dom": ">=16.8 || ^17.0.0"
}
},
"node_modules/framer-motion/node_modules/@emotion/is-prop-valid": {
"version": "0.8.8",
"resolved": "https://registry.npmjs.org/@emotion/is-prop-valid/-/is-prop-valid-0.8.8.tgz",
"integrity": "sha512-u5WtneEAr5IDG2Wv65yhunPSMLIpuKsbuOktRojfrEiEvRyC85LgPMZI63cr7NUqT8ZIGdSVg8ZKGxIug4lXcA==",
"optional": true,
"dependencies": {
"@emotion/memoize": "0.7.4"
}
},
"node_modules/framer-motion/node_modules/@emotion/memoize": {
"version": "0.7.4",
"resolved": "https://registry.npmjs.org/@emotion/memoize/-/memoize-0.7.4.tgz",
"integrity": "sha512-Ja/Vfqe3HpuzRsG1oBtWTHk2PGZ7GR+2Vz5iYGelAw8dx32K0y7PjVuxK6z1nMpZOqAFsRUPCkK1YjJ56qJlgw==",
"optional": true
},
"node_modules/framer-motion/node_modules/framesync": {
"version": "5.3.0",
"resolved": "https://registry.npmjs.org/framesync/-/framesync-5.3.0.tgz",
"integrity": "sha512-oc5m68HDO/tuK2blj7ZcdEBRx3p1PjrgHazL8GYEpvULhrtGIFbQArN6cQS2QhW8mitffaB+VYzMjDqBxxQeoA==",
"dependencies": {
"tslib": "^2.1.0"
}
},
"node_modules/framer-motion/node_modules/popmotion": {
"version": "9.3.6",
"resolved": "https://registry.npmjs.org/popmotion/-/popmotion-9.3.6.tgz",
"integrity": "sha512-ZTbXiu6zIggXzIliMi8LGxXBF5ST+wkpXGEjeTUDUOCdSQ356hij/xjeUdv0F8zCQNeqB1+PR5/BB+gC+QLAPw==",
"dependencies": {
"framesync": "5.3.0",
"hey-listen": "^1.0.8",
"style-value-types": "4.1.4",
"tslib": "^2.1.0"
}
},
"node_modules/framer-motion/node_modules/style-value-types": {
"version": "4.1.4",
"resolved": "https://registry.npmjs.org/style-value-types/-/style-value-types-4.1.4.tgz",
"integrity": "sha512-LCJL6tB+vPSUoxgUBt9juXIlNJHtBMy8jkXzUJSBzeHWdBu6lhzHqCvLVkXFGsFIlNa2ln1sQHya/gzaFmB2Lg==",
"dependencies": {
"hey-listen": "^1.0.8",
"tslib": "^2.1.0"
}
},
"node_modules/framer-motion/node_modules/tslib": {
"version": "2.3.1",
"resolved": "https://registry.npmjs.org/tslib/-/tslib-2.3.1.tgz",
"integrity": "sha512-77EbyPPpMz+FRFRuAFlWMtmgUWGe9UOG2Z25NqCwiIjRhOf5iKGuzSe5P2w1laq+FkRy4p+PCuVkJSGkzTEKVw=="
},
"node_modules/fresh": {
"version": "0.5.2",
"resolved": "https://registry.npmjs.org/fresh/-/fresh-0.5.2.tgz",
@ -19379,34 +19398,6 @@
"node": ">=4.0.0"
}
},
"node_modules/popmotion": {
"version": "8.7.6",
"resolved": "https://registry.npmjs.org/popmotion/-/popmotion-8.7.6.tgz",
"integrity": "sha512-gzU0mRAik8FIEOP4Nk5yqYptJIvHLoq/IRU+rANmKjDZ7tynAivYQ9cIJAxVaoS9h0zfXvN0cFBAg93ncmHHkA==",
"dependencies": {
"@popmotion/easing": "^1.0.1",
"@popmotion/popcorn": "^0.4.4",
"framesync": "^4.0.0",
"hey-listen": "^1.0.5",
"style-value-types": "^3.1.7",
"stylefire": "^7.0.1",
"tslib": "^1.10.0"
}
},
"node_modules/popmotion-pose": {
"version": "3.4.11",
"resolved": "https://registry.npmjs.org/popmotion-pose/-/popmotion-pose-3.4.11.tgz",
"integrity": "sha512-KjaevePyC1+Q3ylIcBO3YMhCouE1a/3bvtBXThrwz44fw1yXCUQagPJGkGirXI/J1xF+w3Lx3bpkkgwArizpEQ==",
"dependencies": {
"@popmotion/easing": "^1.0.1",
"hey-listen": "^1.0.5",
"popmotion": "^8.7.1",
"pose-core": "^2.1.1",
"style-value-types": "^3.0.6",
"ts-essentials": "^1.0.3",
"tslib": "^1.10.0"
}
},
"node_modules/portfinder": {
"version": "1.0.28",
"resolved": "https://registry.npmjs.org/portfinder/-/portfinder-1.0.28.tgz",
@ -19442,24 +19433,6 @@
"ms": "^2.1.1"
}
},
"node_modules/pose-core": {
"version": "2.1.1",
"resolved": "https://registry.npmjs.org/pose-core/-/pose-core-2.1.1.tgz",
"integrity": "sha512-fV1sDfu80debHmKerikypqGoORMEUHVwGh/BlWnqUSmmzQGYIg8neDrdwe66hFeRO+adr2qS4ZERSu/ZVjOiSQ==",
"dependencies": {
"@types/invariant": "^2.2.29",
"@types/node": "^10.0.5",
"hey-listen": "^1.0.5",
"rollup-plugin-typescript2": "^0.25.2",
"tslib": "^1.10.0",
"typescript": "^3.7.2"
}
},
"node_modules/pose-core/node_modules/@types/node": {
"version": "10.17.60",
"resolved": "https://registry.npmjs.org/@types/node/-/node-10.17.60.tgz",
"integrity": "sha512-F0KIgDJfy2nA3zMLmWGKxcH2ZVEtCZXHHdOQs2gSaQ27+lNeEfGxzkIw90aXswATX7AZ33tahPbzy6KAfUreVw=="
},
"node_modules/posix-character-classes": {
"version": "0.1.1",
"resolved": "https://registry.npmjs.org/posix-character-classes/-/posix-character-classes-0.1.1.tgz",
@ -25283,21 +25256,6 @@
"resolved": "https://registry.npmjs.org/react-lifecycles-compat/-/react-lifecycles-compat-3.0.4.tgz",
"integrity": "sha512-fBASbA6LnOU9dOU2eW7aQ8xmYBSXUIWr+UmF9b1efZBazGNO+rcXT/icdKnYm2pTwcRylVUYwW7H1PHfLekVzA=="
},
"node_modules/react-pose": {
"version": "4.0.10",
"resolved": "https://registry.npmjs.org/react-pose/-/react-pose-4.0.10.tgz",
"integrity": "sha512-OKc5oqKw+nL9FvIokxn8MmaAmkNsWv64hLX9xWWcMWXSgEo745hzYUqDn2viMJ97mf76oPy6Vc+BS4k6Kwj78g==",
"dependencies": {
"@emotion/is-prop-valid": "^0.7.3",
"hey-listen": "^1.0.5",
"popmotion-pose": "^3.4.10",
"tslib": "^1.10.0"
},
"peerDependencies": {
"react": "^16.3.2",
"react-dom": "^16.3.2"
}
},
"node_modules/react-refresh": {
"version": "0.9.0",
"resolved": "https://registry.npmjs.org/react-refresh/-/react-refresh-0.9.0.tgz",
@ -25985,140 +25943,6 @@
"url": "https://github.com/sponsors/isaacs"
}
},
"node_modules/rollup-plugin-typescript2": {
"version": "0.25.3",
"resolved": "https://registry.npmjs.org/rollup-plugin-typescript2/-/rollup-plugin-typescript2-0.25.3.tgz",
"integrity": "sha512-ADkSaidKBovJmf5VBnZBZe+WzaZwofuvYdzGAKTN/J4hN7QJCFYAq7IrH9caxlru6T5qhX41PNFS1S4HqhsGQg==",
"dependencies": {
"find-cache-dir": "^3.0.0",
"fs-extra": "8.1.0",
"resolve": "1.12.0",
"rollup-pluginutils": "2.8.1",
"tslib": "1.10.0"
},
"peerDependencies": {
"rollup": ">=1.26.3",
"typescript": ">=2.4.0"
}
},
"node_modules/rollup-plugin-typescript2/node_modules/find-cache-dir": {
"version": "3.3.1",
"resolved": "https://registry.npmjs.org/find-cache-dir/-/find-cache-dir-3.3.1.tgz",
"integrity": "sha512-t2GDMt3oGC/v+BMwzmllWDuJF/xcDtE5j/fCGbqDD7OLuJkj0cfh1YSA5VKPvwMeLFLNDBkwOKZ2X85jGLVftQ==",
"dependencies": {
"commondir": "^1.0.1",
"make-dir": "^3.0.2",
"pkg-dir": "^4.1.0"
},
"engines": {
"node": ">=8"
},
"funding": {
"url": "https://github.com/avajs/find-cache-dir?sponsor=1"
}
},
"node_modules/rollup-plugin-typescript2/node_modules/find-up": {
"version": "4.1.0",
"resolved": "https://registry.npmjs.org/find-up/-/find-up-4.1.0.tgz",
"integrity": "sha512-PpOwAdQ/YlXQ2vj8a3h8IipDuYRi3wceVQQGYWxNINccq40Anw7BlsEXCMbt1Zt+OLA6Fq9suIpIWD0OsnISlw==",
"dependencies": {
"locate-path": "^5.0.0",
"path-exists": "^4.0.0"
},
"engines": {
"node": ">=8"
}
},
"node_modules/rollup-plugin-typescript2/node_modules/locate-path": {
"version": "5.0.0",
"resolved": "https://registry.npmjs.org/locate-path/-/locate-path-5.0.0.tgz",
"integrity": "sha512-t7hw9pI+WvuwNJXwk5zVHpyhIqzg2qTlklJOf0mVxGSbe3Fp2VieZcduNYjaLDoy6p9uGpQEGWG87WpMKlNq8g==",
"dependencies": {
"p-locate": "^4.1.0"
},
"engines": {
"node": ">=8"
}
},
"node_modules/rollup-plugin-typescript2/node_modules/make-dir": {
"version": "3.1.0",
"resolved": "https://registry.npmjs.org/make-dir/-/make-dir-3.1.0.tgz",
"integrity": "sha512-g3FeP20LNwhALb/6Cz6Dd4F2ngze0jz7tbzrD2wAV+o9FeNHe4rL+yK2md0J/fiSf1sa1ADhXqi5+oVwOM/eGw==",
"dependencies": {
"semver": "^6.0.0"
},
"engines": {
"node": ">=8"
},
"funding": {
"url": "https://github.com/sponsors/sindresorhus"
}
},
"node_modules/rollup-plugin-typescript2/node_modules/p-limit": {
"version": "2.3.0",
"resolved": "https://registry.npmjs.org/p-limit/-/p-limit-2.3.0.tgz",
"integrity": "sha512-//88mFWSJx8lxCzwdAABTJL2MyWB12+eIY7MDL2SqLmAkeKU9qxRvWuSyTjm3FUmpBEMuFfckAIqEaVGUDxb6w==",
"dependencies": {
"p-try": "^2.0.0"
},
"engines": {
"node": ">=6"
},
"funding": {
"url": "https://github.com/sponsors/sindresorhus"
}
},
"node_modules/rollup-plugin-typescript2/node_modules/p-locate": {
"version": "4.1.0",
"resolved": "https://registry.npmjs.org/p-locate/-/p-locate-4.1.0.tgz",
"integrity": "sha512-R79ZZ/0wAxKGu3oYMlz8jy/kbhsNrS7SKZ7PxEHBgJ5+F2mtFW2fK2cOtBh1cHYkQsbzFV7I+EoRKe6Yt0oK7A==",
"dependencies": {
"p-limit": "^2.2.0"
},
"engines": {
"node": ">=8"
}
},
"node_modules/rollup-plugin-typescript2/node_modules/path-exists": {
"version": "4.0.0",
"resolved": "https://registry.npmjs.org/path-exists/-/path-exists-4.0.0.tgz",
"integrity": "sha512-ak9Qy5Q7jYb2Wwcey5Fpvg2KoAc/ZIhLSLOSBmRmygPsGwkVVt0fZa0qrtMz+m6tJTAHfZQ8FnmB4MG4LWy7/w==",
"engines": {
"node": ">=8"
}
},
"node_modules/rollup-plugin-typescript2/node_modules/pkg-dir": {
"version": "4.2.0",
"resolved": "https://registry.npmjs.org/pkg-dir/-/pkg-dir-4.2.0.tgz",
"integrity": "sha512-HRDzbaKjC+AOWVXxAU/x54COGeIv9eb+6CkDSQoNTt4XyWoIJvuPsXizxu/Fr23EiekbtZwmh1IcIG/l/a10GQ==",
"dependencies": {
"find-up": "^4.0.0"
},
"engines": {
"node": ">=8"
}
},
"node_modules/rollup-plugin-typescript2/node_modules/resolve": {
"version": "1.12.0",
"resolved": "https://registry.npmjs.org/resolve/-/resolve-1.12.0.tgz",
"integrity": "sha512-B/dOmuoAik5bKcD6s6nXDCjzUKnaDvdkRyAk6rsmsKLipWj4797iothd7jmmUhWTfinVMU+wc56rYKsit2Qy4w==",
"dependencies": {
"path-parse": "^1.0.6"
}
},
"node_modules/rollup-plugin-typescript2/node_modules/tslib": {
"version": "1.10.0",
"resolved": "https://registry.npmjs.org/tslib/-/tslib-1.10.0.tgz",
"integrity": "sha512-qOebF53frne81cf0S9B41ByenJ3/IuH8yJKngAX35CmiZySA0khhkovshKK+jGCaMnVomla7gVlIcc3EvKPbTQ=="
},
"node_modules/rollup-pluginutils": {
"version": "2.8.1",
"resolved": "https://registry.npmjs.org/rollup-pluginutils/-/rollup-pluginutils-2.8.1.tgz",
"integrity": "sha512-J5oAoysWar6GuZo0s+3bZ6sVZAC0pfqKz68De7ZgDi5z63jOVZn1uJL/+z1jeKHNbGII8kAyHF5q8LnxSX5lQg==",
"dependencies": {
"estree-walker": "^0.6.1"
}
},
"node_modules/run-async": {
"version": "2.4.1",
"resolved": "https://registry.npmjs.org/run-async/-/run-async-2.4.1.tgz",
@ -27793,27 +27617,6 @@
"inline-style-parser": "0.1.1"
}
},
"node_modules/style-value-types": {
"version": "3.2.0",
"resolved": "https://registry.npmjs.org/style-value-types/-/style-value-types-3.2.0.tgz",
"integrity": "sha512-ih0mGsrYYmVvdDi++/66O6BaQPRPRMQHoZevNNdMMcPlP/cH28Rnfsqf1UEba/Bwfuw9T8BmIMwbGdzsPwQKrQ==",
"dependencies": {
"hey-listen": "^1.0.8",
"tslib": "^1.10.0"
}
},
"node_modules/stylefire": {
"version": "7.0.3",
"resolved": "https://registry.npmjs.org/stylefire/-/stylefire-7.0.3.tgz",
"integrity": "sha512-Q0l7NSeFz/OkX+o6/7Zg3VZxSAZeQzQpYomWmIpOehFM/rJNMSLVX5fgg6Q48ut2ETNKwdhm97mPNU643EBCoQ==",
"dependencies": {
"@popmotion/popcorn": "^0.4.4",
"framesync": "^4.0.0",
"hey-listen": "^1.0.8",
"style-value-types": "^3.1.7",
"tslib": "^1.10.0"
}
},
"node_modules/stylehacks": {
"version": "5.0.1",
"resolved": "https://registry.npmjs.org/stylehacks/-/stylehacks-5.0.1.tgz",
@ -29246,11 +29049,6 @@
"resolved": "https://registry.npmjs.org/true-case-path/-/true-case-path-2.2.1.tgz",
"integrity": "sha512-0z3j8R7MCjy10kc/g+qg7Ln3alJTodw9aDuVWZa3uiWqfuBMKeAeP2ocWcxoyM3D73yz3Jt/Pu4qPr4wHSdB/Q=="
},
"node_modules/ts-essentials": {
"version": "1.0.4",
"resolved": "https://registry.npmjs.org/ts-essentials/-/ts-essentials-1.0.4.tgz",
"integrity": "sha512-q3N1xS4vZpRouhYHDPwO0bDW3EZ6SK9CrrDHxi/D6BPReSjpVgWIOpLS2o0gSBZm+7q/wyKp6RVM1AeeW7uyfQ=="
},
"node_modules/ts-node": {
"version": "9.1.1",
"resolved": "https://registry.npmjs.org/ts-node/-/ts-node-9.1.1.tgz",
@ -29413,6 +29211,7 @@
"version": "3.9.10",
"resolved": "https://registry.npmjs.org/typescript/-/typescript-3.9.10.tgz",
"integrity": "sha512-w6fIxVE/H1PkLKcCPsFqKE7Kv7QUwhU8qQY2MueZXWx5cPZdwFupLgKK3vntcK98BtNHZtAF4LA/yl2a7k8R6Q==",
"peer": true,
"bin": {
"tsc": "bin/tsc",
"tsserver": "bin/tsserver"
@ -33305,19 +33104,6 @@
"integrity": "sha512-5a6wqoJV/xEdbRNKVo6I4hO3VjyDq//8q2f9I6PBAvMesJHFauXDorcNCsr9RzvsZnaWi5NYCcfyqP1QeFHFbw==",
"dev": true
},
"@emotion/is-prop-valid": {
"version": "0.7.3",
"resolved": "https://registry.npmjs.org/@emotion/is-prop-valid/-/is-prop-valid-0.7.3.tgz",
"integrity": "sha512-uxJqm/sqwXw3YPA5GXX365OBcJGFtxUVkB6WyezqFHlNe9jqUWH5ur2O2M8dGBz61kn1g3ZBlzUunFQXQIClhA==",
"requires": {
"@emotion/memoize": "0.7.1"
}
},
"@emotion/memoize": {
"version": "0.7.1",
"resolved": "https://registry.npmjs.org/@emotion/memoize/-/memoize-0.7.1.tgz",
"integrity": "sha512-Qv4LTqO11jepd5Qmlp3M1YEjBumoTHcHFdgPTQ+sFlIL5myi/7xu/POwP7IRu6odBdmLXdtIs1D6TuW6kbwbbg=="
},
"@endemolshinegroup/cosmiconfig-typescript-loader": {
"version": "3.0.2",
"resolved": "https://registry.npmjs.org/@endemolshinegroup/cosmiconfig-typescript-loader/-/cosmiconfig-typescript-loader-3.0.2.tgz",
@ -34501,23 +34287,6 @@
"integrity": "sha512-88p7+M0QGxKpmnkfXjS4V26AnoC/eiqZutE8GLdaI5X12NY75bXSdTY9NkmYb2Xyk1O+MmkuO6Frmsj84V6I8Q==",
"dev": true
},
"@popmotion/easing": {
"version": "1.0.2",
"resolved": "https://registry.npmjs.org/@popmotion/easing/-/easing-1.0.2.tgz",
"integrity": "sha512-IkdW0TNmRnWTeWI7aGQIVDbKXPWHVEYdGgd5ZR4SH/Ty/61p63jCjrPxX1XrR7IGkl08bjhJROStD7j+RKgoIw=="
},
"@popmotion/popcorn": {
"version": "0.4.4",
"resolved": "https://registry.npmjs.org/@popmotion/popcorn/-/popcorn-0.4.4.tgz",
"integrity": "sha512-jYO/8319fKoNLMlY4ZJPiPu8Ea8occYwRZhxpaNn/kZsK4QG2E7XFlXZMJBsTWDw7I1i0uaqyC4zn1nwEezLzg==",
"requires": {
"@popmotion/easing": "^1.0.1",
"framesync": "^4.0.1",
"hey-listen": "^1.0.8",
"style-value-types": "^3.1.7",
"tslib": "^1.10.0"
}
},
"@sideway/address": {
"version": "4.1.2",
"resolved": "https://registry.npmjs.org/@sideway/address/-/address-4.1.2.tgz",
@ -34958,11 +34727,6 @@
"@types/node": "*"
}
},
"@types/invariant": {
"version": "2.2.35",
"resolved": "https://registry.npmjs.org/@types/invariant/-/invariant-2.2.35.tgz",
"integrity": "sha512-DxX1V9P8zdJPYQat1gHyY0xj3efl8gnMVjiM9iCY6y27lj+PoQWkgjt8jDqmovPqULkKVpKRg8J36iQiA+EtEg=="
},
"@types/istanbul-lib-coverage": {
"version": "2.0.3",
"resolved": "https://registry.npmjs.org/@types/istanbul-lib-coverage/-/istanbul-lib-coverage-2.0.3.tgz",
@ -39603,11 +39367,6 @@
"resolved": "https://registry.npmjs.org/estree-util-is-identifier-name/-/estree-util-is-identifier-name-1.1.0.tgz",
"integrity": "sha512-OVJZ3fGGt9By77Ix9NhaRbzfbDV/2rx9EP7YIDJTmsZSEc5kYn2vWcNccYyahJL2uAQZK2a5Or2i0wtIKTPoRQ=="
},
"estree-walker": {
"version": "0.6.1",
"resolved": "https://registry.npmjs.org/estree-walker/-/estree-walker-0.6.1.tgz",
"integrity": "sha512-SqmZANLWS0mnatqbSfRP5g8OXZC12Fgg1IwNtLsyHDzJizORW4khDfjPqJZsemPWBB2uqykUah5YpQ6epsqC/w=="
},
"esutils": {
"version": "2.0.3",
"resolved": "https://registry.npmjs.org/esutils/-/esutils-2.0.3.tgz",
@ -40508,12 +40267,67 @@
"map-cache": "^0.2.2"
}
},
"framesync": {
"version": "4.1.0",
"resolved": "https://registry.npmjs.org/framesync/-/framesync-4.1.0.tgz",
"integrity": "sha512-MmgZ4wCoeVxNbx2xp5hN/zPDCbLSKiDt4BbbslK7j/pM2lg5S0vhTNv1v8BCVb99JPIo6hXBFdwzU7Q4qcAaoQ==",
"framer-motion": {
"version": "4.1.17",
"resolved": "https://registry.npmjs.org/framer-motion/-/framer-motion-4.1.17.tgz",
"integrity": "sha512-thx1wvKzblzbs0XaK2X0G1JuwIdARcoNOW7VVwjO8BUltzXPyONGAElLu6CiCScsOQRI7FIk/45YTFtJw5Yozw==",
"requires": {
"hey-listen": "^1.0.5"
"@emotion/is-prop-valid": "^0.8.2",
"framesync": "5.3.0",
"hey-listen": "^1.0.8",
"popmotion": "9.3.6",
"style-value-types": "4.1.4",
"tslib": "^2.1.0"
},
"dependencies": {
"@emotion/is-prop-valid": {
"version": "0.8.8",
"resolved": "https://registry.npmjs.org/@emotion/is-prop-valid/-/is-prop-valid-0.8.8.tgz",
"integrity": "sha512-u5WtneEAr5IDG2Wv65yhunPSMLIpuKsbuOktRojfrEiEvRyC85LgPMZI63cr7NUqT8ZIGdSVg8ZKGxIug4lXcA==",
"optional": true,
"requires": {
"@emotion/memoize": "0.7.4"
}
},
"@emotion/memoize": {
"version": "0.7.4",
"resolved": "https://registry.npmjs.org/@emotion/memoize/-/memoize-0.7.4.tgz",
"integrity": "sha512-Ja/Vfqe3HpuzRsG1oBtWTHk2PGZ7GR+2Vz5iYGelAw8dx32K0y7PjVuxK6z1nMpZOqAFsRUPCkK1YjJ56qJlgw==",
"optional": true
},
"framesync": {
"version": "5.3.0",
"resolved": "https://registry.npmjs.org/framesync/-/framesync-5.3.0.tgz",
"integrity": "sha512-oc5m68HDO/tuK2blj7ZcdEBRx3p1PjrgHazL8GYEpvULhrtGIFbQArN6cQS2QhW8mitffaB+VYzMjDqBxxQeoA==",
"requires": {
"tslib": "^2.1.0"
}
},
"popmotion": {
"version": "9.3.6",
"resolved": "https://registry.npmjs.org/popmotion/-/popmotion-9.3.6.tgz",
"integrity": "sha512-ZTbXiu6zIggXzIliMi8LGxXBF5ST+wkpXGEjeTUDUOCdSQ356hij/xjeUdv0F8zCQNeqB1+PR5/BB+gC+QLAPw==",
"requires": {
"framesync": "5.3.0",
"hey-listen": "^1.0.8",
"style-value-types": "4.1.4",
"tslib": "^2.1.0"
}
},
"style-value-types": {
"version": "4.1.4",
"resolved": "https://registry.npmjs.org/style-value-types/-/style-value-types-4.1.4.tgz",
"integrity": "sha512-LCJL6tB+vPSUoxgUBt9juXIlNJHtBMy8jkXzUJSBzeHWdBu6lhzHqCvLVkXFGsFIlNa2ln1sQHya/gzaFmB2Lg==",
"requires": {
"hey-listen": "^1.0.8",
"tslib": "^2.1.0"
}
},
"tslib": {
"version": "2.3.1",
"resolved": "https://registry.npmjs.org/tslib/-/tslib-2.3.1.tgz",
"integrity": "sha512-77EbyPPpMz+FRFRuAFlWMtmgUWGe9UOG2Z25NqCwiIjRhOf5iKGuzSe5P2w1laq+FkRy4p+PCuVkJSGkzTEKVw=="
}
}
},
"fresh": {
@ -46729,34 +46543,6 @@
"resolved": "https://registry.npmjs.org/pngjs/-/pngjs-3.4.0.tgz",
"integrity": "sha512-NCrCHhWmnQklfH4MtJMRjZ2a8c80qXeMlQMv2uVp9ISJMTt562SbGd6n2oq0PaPgKm7Z6pL9E2UlLIhC+SHL3w=="
},
"popmotion": {
"version": "8.7.6",
"resolved": "https://registry.npmjs.org/popmotion/-/popmotion-8.7.6.tgz",
"integrity": "sha512-gzU0mRAik8FIEOP4Nk5yqYptJIvHLoq/IRU+rANmKjDZ7tynAivYQ9cIJAxVaoS9h0zfXvN0cFBAg93ncmHHkA==",
"requires": {
"@popmotion/easing": "^1.0.1",
"@popmotion/popcorn": "^0.4.4",
"framesync": "^4.0.0",
"hey-listen": "^1.0.5",
"style-value-types": "^3.1.7",
"stylefire": "^7.0.1",
"tslib": "^1.10.0"
}
},
"popmotion-pose": {
"version": "3.4.11",
"resolved": "https://registry.npmjs.org/popmotion-pose/-/popmotion-pose-3.4.11.tgz",
"integrity": "sha512-KjaevePyC1+Q3ylIcBO3YMhCouE1a/3bvtBXThrwz44fw1yXCUQagPJGkGirXI/J1xF+w3Lx3bpkkgwArizpEQ==",
"requires": {
"@popmotion/easing": "^1.0.1",
"hey-listen": "^1.0.5",
"popmotion": "^8.7.1",
"pose-core": "^2.1.1",
"style-value-types": "^3.0.6",
"ts-essentials": "^1.0.3",
"tslib": "^1.10.0"
}
},
"portfinder": {
"version": "1.0.28",
"resolved": "https://registry.npmjs.org/portfinder/-/portfinder-1.0.28.tgz",
@ -46791,26 +46577,6 @@
}
}
},
"pose-core": {
"version": "2.1.1",
"resolved": "https://registry.npmjs.org/pose-core/-/pose-core-2.1.1.tgz",
"integrity": "sha512-fV1sDfu80debHmKerikypqGoORMEUHVwGh/BlWnqUSmmzQGYIg8neDrdwe66hFeRO+adr2qS4ZERSu/ZVjOiSQ==",
"requires": {
"@types/invariant": "^2.2.29",
"@types/node": "^10.0.5",
"hey-listen": "^1.0.5",
"rollup-plugin-typescript2": "^0.25.2",
"tslib": "^1.10.0",
"typescript": "^3.7.2"
},
"dependencies": {
"@types/node": {
"version": "10.17.60",
"resolved": "https://registry.npmjs.org/@types/node/-/node-10.17.60.tgz",
"integrity": "sha512-F0KIgDJfy2nA3zMLmWGKxcH2ZVEtCZXHHdOQs2gSaQ27+lNeEfGxzkIw90aXswATX7AZ33tahPbzy6KAfUreVw=="
}
}
},
"posix-character-classes": {
"version": "0.1.1",
"resolved": "https://registry.npmjs.org/posix-character-classes/-/posix-character-classes-0.1.1.tgz",
@ -51262,17 +51028,6 @@
"resolved": "https://registry.npmjs.org/react-lifecycles-compat/-/react-lifecycles-compat-3.0.4.tgz",
"integrity": "sha512-fBASbA6LnOU9dOU2eW7aQ8xmYBSXUIWr+UmF9b1efZBazGNO+rcXT/icdKnYm2pTwcRylVUYwW7H1PHfLekVzA=="
},
"react-pose": {
"version": "4.0.10",
"resolved": "https://registry.npmjs.org/react-pose/-/react-pose-4.0.10.tgz",
"integrity": "sha512-OKc5oqKw+nL9FvIokxn8MmaAmkNsWv64hLX9xWWcMWXSgEo745hzYUqDn2viMJ97mf76oPy6Vc+BS4k6Kwj78g==",
"requires": {
"@emotion/is-prop-valid": "^0.7.3",
"hey-listen": "^1.0.5",
"popmotion-pose": "^3.4.10",
"tslib": "^1.10.0"
}
},
"react-refresh": {
"version": "0.9.0",
"resolved": "https://registry.npmjs.org/react-refresh/-/react-refresh-0.9.0.tgz",
@ -51797,105 +51552,6 @@
"glob": "^7.1.3"
}
},
"rollup-plugin-typescript2": {
"version": "0.25.3",
"resolved": "https://registry.npmjs.org/rollup-plugin-typescript2/-/rollup-plugin-typescript2-0.25.3.tgz",
"integrity": "sha512-ADkSaidKBovJmf5VBnZBZe+WzaZwofuvYdzGAKTN/J4hN7QJCFYAq7IrH9caxlru6T5qhX41PNFS1S4HqhsGQg==",
"requires": {
"find-cache-dir": "^3.0.0",
"fs-extra": "8.1.0",
"resolve": "1.12.0",
"rollup-pluginutils": "2.8.1",
"tslib": "1.10.0"
},
"dependencies": {
"find-cache-dir": {
"version": "3.3.1",
"resolved": "https://registry.npmjs.org/find-cache-dir/-/find-cache-dir-3.3.1.tgz",
"integrity": "sha512-t2GDMt3oGC/v+BMwzmllWDuJF/xcDtE5j/fCGbqDD7OLuJkj0cfh1YSA5VKPvwMeLFLNDBkwOKZ2X85jGLVftQ==",
"requires": {
"commondir": "^1.0.1",
"make-dir": "^3.0.2",
"pkg-dir": "^4.1.0"
}
},
"find-up": {
"version": "4.1.0",
"resolved": "https://registry.npmjs.org/find-up/-/find-up-4.1.0.tgz",
"integrity": "sha512-PpOwAdQ/YlXQ2vj8a3h8IipDuYRi3wceVQQGYWxNINccq40Anw7BlsEXCMbt1Zt+OLA6Fq9suIpIWD0OsnISlw==",
"requires": {
"locate-path": "^5.0.0",
"path-exists": "^4.0.0"
}
},
"locate-path": {
"version": "5.0.0",
"resolved": "https://registry.npmjs.org/locate-path/-/locate-path-5.0.0.tgz",
"integrity": "sha512-t7hw9pI+WvuwNJXwk5zVHpyhIqzg2qTlklJOf0mVxGSbe3Fp2VieZcduNYjaLDoy6p9uGpQEGWG87WpMKlNq8g==",
"requires": {
"p-locate": "^4.1.0"
}
},
"make-dir": {
"version": "3.1.0",
"resolved": "https://registry.npmjs.org/make-dir/-/make-dir-3.1.0.tgz",
"integrity": "sha512-g3FeP20LNwhALb/6Cz6Dd4F2ngze0jz7tbzrD2wAV+o9FeNHe4rL+yK2md0J/fiSf1sa1ADhXqi5+oVwOM/eGw==",
"requires": {
"semver": "^6.0.0"
}
},
"p-limit": {
"version": "2.3.0",
"resolved": "https://registry.npmjs.org/p-limit/-/p-limit-2.3.0.tgz",
"integrity": "sha512-//88mFWSJx8lxCzwdAABTJL2MyWB12+eIY7MDL2SqLmAkeKU9qxRvWuSyTjm3FUmpBEMuFfckAIqEaVGUDxb6w==",
"requires": {
"p-try": "^2.0.0"
}
},
"p-locate": {
"version": "4.1.0",
"resolved": "https://registry.npmjs.org/p-locate/-/p-locate-4.1.0.tgz",
"integrity": "sha512-R79ZZ/0wAxKGu3oYMlz8jy/kbhsNrS7SKZ7PxEHBgJ5+F2mtFW2fK2cOtBh1cHYkQsbzFV7I+EoRKe6Yt0oK7A==",
"requires": {
"p-limit": "^2.2.0"
}
},
"path-exists": {
"version": "4.0.0",
"resolved": "https://registry.npmjs.org/path-exists/-/path-exists-4.0.0.tgz",
"integrity": "sha512-ak9Qy5Q7jYb2Wwcey5Fpvg2KoAc/ZIhLSLOSBmRmygPsGwkVVt0fZa0qrtMz+m6tJTAHfZQ8FnmB4MG4LWy7/w=="
},
"pkg-dir": {
"version": "4.2.0",
"resolved": "https://registry.npmjs.org/pkg-dir/-/pkg-dir-4.2.0.tgz",
"integrity": "sha512-HRDzbaKjC+AOWVXxAU/x54COGeIv9eb+6CkDSQoNTt4XyWoIJvuPsXizxu/Fr23EiekbtZwmh1IcIG/l/a10GQ==",
"requires": {
"find-up": "^4.0.0"
}
},
"resolve": {
"version": "1.12.0",
"resolved": "https://registry.npmjs.org/resolve/-/resolve-1.12.0.tgz",
"integrity": "sha512-B/dOmuoAik5bKcD6s6nXDCjzUKnaDvdkRyAk6rsmsKLipWj4797iothd7jmmUhWTfinVMU+wc56rYKsit2Qy4w==",
"requires": {
"path-parse": "^1.0.6"
}
},
"tslib": {
"version": "1.10.0",
"resolved": "https://registry.npmjs.org/tslib/-/tslib-1.10.0.tgz",
"integrity": "sha512-qOebF53frne81cf0S9B41ByenJ3/IuH8yJKngAX35CmiZySA0khhkovshKK+jGCaMnVomla7gVlIcc3EvKPbTQ=="
}
}
},
"rollup-pluginutils": {
"version": "2.8.1",
"resolved": "https://registry.npmjs.org/rollup-pluginutils/-/rollup-pluginutils-2.8.1.tgz",
"integrity": "sha512-J5oAoysWar6GuZo0s+3bZ6sVZAC0pfqKz68De7ZgDi5z63jOVZn1uJL/+z1jeKHNbGII8kAyHF5q8LnxSX5lQg==",
"requires": {
"estree-walker": "^0.6.1"
}
},
"run-async": {
"version": "2.4.1",
"resolved": "https://registry.npmjs.org/run-async/-/run-async-2.4.1.tgz",
@ -53251,27 +52907,6 @@
"inline-style-parser": "0.1.1"
}
},
"style-value-types": {
"version": "3.2.0",
"resolved": "https://registry.npmjs.org/style-value-types/-/style-value-types-3.2.0.tgz",
"integrity": "sha512-ih0mGsrYYmVvdDi++/66O6BaQPRPRMQHoZevNNdMMcPlP/cH28Rnfsqf1UEba/Bwfuw9T8BmIMwbGdzsPwQKrQ==",
"requires": {
"hey-listen": "^1.0.8",
"tslib": "^1.10.0"
}
},
"stylefire": {
"version": "7.0.3",
"resolved": "https://registry.npmjs.org/stylefire/-/stylefire-7.0.3.tgz",
"integrity": "sha512-Q0l7NSeFz/OkX+o6/7Zg3VZxSAZeQzQpYomWmIpOehFM/rJNMSLVX5fgg6Q48ut2ETNKwdhm97mPNU643EBCoQ==",
"requires": {
"@popmotion/popcorn": "^0.4.4",
"framesync": "^4.0.0",
"hey-listen": "^1.0.8",
"style-value-types": "^3.1.7",
"tslib": "^1.10.0"
}
},
"stylehacks": {
"version": "5.0.1",
"resolved": "https://registry.npmjs.org/stylehacks/-/stylehacks-5.0.1.tgz",
@ -54370,11 +54005,6 @@
"resolved": "https://registry.npmjs.org/true-case-path/-/true-case-path-2.2.1.tgz",
"integrity": "sha512-0z3j8R7MCjy10kc/g+qg7Ln3alJTodw9aDuVWZa3uiWqfuBMKeAeP2ocWcxoyM3D73yz3Jt/Pu4qPr4wHSdB/Q=="
},
"ts-essentials": {
"version": "1.0.4",
"resolved": "https://registry.npmjs.org/ts-essentials/-/ts-essentials-1.0.4.tgz",
"integrity": "sha512-q3N1xS4vZpRouhYHDPwO0bDW3EZ6SK9CrrDHxi/D6BPReSjpVgWIOpLS2o0gSBZm+7q/wyKp6RVM1AeeW7uyfQ=="
},
"ts-node": {
"version": "9.1.1",
"resolved": "https://registry.npmjs.org/ts-node/-/ts-node-9.1.1.tgz",
@ -54498,7 +54128,8 @@
"typescript": {
"version": "3.9.10",
"resolved": "https://registry.npmjs.org/typescript/-/typescript-3.9.10.tgz",
"integrity": "sha512-w6fIxVE/H1PkLKcCPsFqKE7Kv7QUwhU8qQY2MueZXWx5cPZdwFupLgKK3vntcK98BtNHZtAF4LA/yl2a7k8R6Q=="
"integrity": "sha512-w6fIxVE/H1PkLKcCPsFqKE7Kv7QUwhU8qQY2MueZXWx5cPZdwFupLgKK3vntcK98BtNHZtAF4LA/yl2a7k8R6Q==",
"peer": true
},
"unbox-primitive": {
"version": "1.0.1",

2
package.json
View File

@ -23,6 +23,7 @@
"@giphy/js-fetch-api": "^4.1.2",
"axios": "^0.21.4",
"file-saver": "^2.0.5",
"framer-motion": "^4.1.17",
"gatsby": "^3.13.0",
"gatsby-plugin-image": "^1.13.0",
"gatsby-plugin-manifest": "^3.13.0",
@ -43,7 +44,6 @@
"react-dom": "^17.0.2",
"react-feather": "^2.0.9",
"react-helmet": "^6.1.0",
"react-pose": "^4.0.10",
"remark": "^13.0.0",
"remark-breaks": "^2.0.2",
"remark-html": "^13.0.2",

42
scripts/github.js Normal file
View File

@ -0,0 +1,42 @@
const axios = require('axios')
//
// Get GitHub repos
//
const gitHubConfig = {
headers: {
'User-Agent': 'kremalicious/portfolio',
Authorization: `token ${process.env.GATSBY_GITHUB_TOKEN}`
}
}
async function getGithubRepos(data) {
let repos = []
let holder = {}
for (let item of data) {
const user = item.split('/')[0]
const repoName = item.split('/')[1]
const repo = await axios.get(
`https://api.github.com/repos/${user}/${repoName}`,
gitHubConfig
)
holder.name = repo.data.name
holder.full_name = repo.data.full_name
holder.description = repo.data.description
holder.html_url = repo.data.html_url
holder.homepage = repo.data.homepage
holder.stargazers_count = repo.data.stargazers_count
holder.pushed_at = repo.data.pushed_at
repos.push(holder)
holder = {}
}
// sort by pushed to, newest first
repos = repos.sort((a, b) => b.pushed_at.localeCompare(a.pushed_at))
return repos
}
module.exports = { getGithubRepos }

31
src/components/Layout.jsx
View File

@ -1,7 +1,7 @@
import React from 'react'
import PropTypes from 'prop-types'
import posed, { PoseGroup } from 'react-pose'
import { fadeIn } from './atoms/Transitions'
import { motion, AnimatePresence, useReducedMotion } from 'framer-motion'
import { fadeIn, moveInBottom, getAnimationProps } from './atoms/Transitions'
import Typekit from './atoms/Typekit'
import HostnameCheck from './atoms/HostnameCheck'
import ThemeSwitch from './molecules/ThemeSwitch'
@ -24,11 +24,10 @@ Layout.propTypes = {
}).isRequired
}
const timeout = 200
const RoutesContainer = posed.div(fadeIn)
export default function Layout({ children, location }) {
const { allowedHosts } = useMeta()
const shouldReduceMotion = useReducedMotion()
const isSsr = typeof window === 'undefined'
const isHomepage =
location.pathname === '/' ||
@ -42,16 +41,24 @@ export default function Layout({ children, location }) {
<HostnameCheck allowedHosts={allowedHosts} />
<ThemeSwitch />
<PoseGroup animateOnMount={process.env.NODE_ENV !== 'test'}>
<RoutesContainer
<AnimatePresence exitBeforeEnter>
<motion.div
key={location.pathname}
delay={timeout}
delayChildren={timeout}
variants={fadeIn}
{...getAnimationProps(shouldReduceMotion, isSsr)}
>
<Header minimal={!isHomepage} hide={isResume} />
<main className={screen}>{children}</main>
</RoutesContainer>
</PoseGroup>
<motion.main
key={location.pathname}
variants={moveInBottom}
initial={`${shouldReduceMotion || isSsr ? 'enter' : 'initial'}`}
animate={`${shouldReduceMotion || isSsr ? null : 'enter'}`}
className={screen}
>
{children}
</motion.main>
</motion.div>
</AnimatePresence>
<Footer />
</>

34
src/components/atoms/Transitions.js
View File

@ -1,30 +1,52 @@
export const fadeIn = {
initial: {
opacity: 0
},
enter: {
opacity: 1
opacity: 1,
duration: '0.4',
when: 'beforeChildren'
},
exit: {
opacity: 0
opacity: 0,
transition: { duration: '0.2' }
}
}
export const moveInTop = {
initial: {
y: '-2rem',
transition: { type: 'spring' }
},
enter: {
y: 0,
transition: { type: 'spring' }
transition: { type: 'spring', duration: '0.4' }
},
exit: {
y: '-2rem',
transition: { type: 'spring' }
transition: { type: 'spring', delay: '0.1', duration: '0.3' }
}
}
export const moveInBottom = {
initial: {
y: '2rem',
transition: { type: 'spring' }
},
enter: {
y: 0,
transition: { type: 'spring' }
transition: { type: 'spring', duration: '0.4' }
},
exit: {
y: '2rem',
transition: { type: 'spring' }
transition: { type: 'spring', delay: '0.1', duration: '0.3' }
}
}
export function getAnimationProps(shouldReduceMotion, isSsr) {
return {
initial: `${shouldReduceMotion || isSsr ? 'enter' : 'initial'}`,
animate: `${shouldReduceMotion || isSsr ? null : 'enter'}`,
exit: `${shouldReduceMotion || isSsr ? null : 'exit'}`
}
}

16
src/components/molecules/Availability.jsx
View File

@ -1,17 +1,17 @@
import React from 'react'
import PropTypes from 'prop-types'
import posed from 'react-pose'
import { fadeIn } from '../atoms/Transitions'
import { motion, useReducedMotion } from 'framer-motion'
import { moveInTop, getAnimationProps } from '../atoms/Transitions'
import { useMeta } from '../../hooks/use-meta'
import {
availability as styleAvailability,
available as styleAvailable
} from './Availability.module.css'
const Animation = posed.aside(fadeIn)
export default function Availability({ hide }) {
const { availability } = useMeta()
const shouldReduceMotion = useReducedMotion()
const isSSr = typeof window === 'undefined'
const { status, available, unavailable } = availability
const className = status
? `${styleAvailability} ${styleAvailable}`
@ -20,9 +20,13 @@ export default function Availability({ hide }) {
return (
!hide && (
<Animation className={className}>
<motion.aside
variants={moveInTop}
className={className}
{...getAnimationProps(shouldReduceMotion, isSSr)}
>
<p dangerouslySetInnerHTML={{ __html: html }} />
</Animation>
</motion.aside>
)
)
}

10
src/components/molecules/LogoUnit.jsx
View File

@ -1,8 +1,8 @@
import React from 'react'
import PropTypes from 'prop-types'
import { Link } from 'gatsby'
import posed from 'react-pose'
import { moveInBottom } from '../atoms/Transitions'
import { motion, useReducedMotion } from 'framer-motion'
import { moveInTop, getAnimationProps } from '../atoms/Transitions'
import { ReactComponent as Logo } from '../../images/logo.svg'
import {
minimal as styleMinimal,
@ -20,10 +20,10 @@ LogoUnit.propTypes = {
export default function LogoUnit({ minimal }) {
const { basics } = useResume()
const Animation = posed.div(moveInBottom)
const shouldReduceMotion = useReducedMotion()
return (
<Animation>
<motion.div variants={moveInTop} {...getAnimationProps(shouldReduceMotion)}>
<Link className={minimal ? styleMinimal : logounit} to={'/'}>
<Logo className={logo} />
<h1 className={`p-name ${title}`}>{basics.name.toLowerCase()}</h1>
@ -31,6 +31,6 @@ export default function LogoUnit({ minimal }) {
{basics.label.toLowerCase()}
</p>
</Link>
</Animation>
</motion.div>
)
}

16
src/components/molecules/Networks.jsx
View File

@ -1,7 +1,7 @@
import React from 'react'
import PropTypes from 'prop-types'
import posed from 'react-pose'
import { moveInTop } from '../atoms/Transitions'
import { motion, useReducedMotion } from 'framer-motion'
import { moveInBottom, getAnimationProps } from '../atoms/Transitions'
import Icon from '../atoms/Icon'
import { useResume } from '../../hooks/use-resume'
import {
@ -32,12 +32,16 @@ NetworkLink.propTypes = {
export default function Networks({ small, hide }) {
const { basics } = useResume()
const shouldReduceMotion = useReducedMotion()
const isSSr = typeof window === 'undefined'
if (hide) return null
const Animation = posed.aside(moveInTop)
return (
<Animation className={small ? styleSmall : networks}>
<motion.aside
variants={moveInBottom}
{...getAnimationProps(shouldReduceMotion, isSSr)}
className={small ? styleSmall : networks}
>
<NetworkLink name="Mail" url={`mailto:${basics.email}`} />
{basics.profiles.map((profile) => (
@ -47,7 +51,7 @@ export default function Networks({ small, hide }) {
url={profile.url}
/>
))}
</Animation>
</motion.aside>
)
}

2
src/components/organisms/Header.module.css
View File

@ -2,7 +2,7 @@
position: relative;
padding: calc(var(--spacer) / 2);
padding-top: 30vh;
min-height: calc(100vh - var(--spacer));
min-height: calc(90vh - var(--spacer));
max-height: 1000px;
text-align: center;
display: flex;