codebushi / gatsby-starter-dimension Goto Github PK

Gatsby.js V2 starter template based on Dimension, designed by HTML5 UP. Check out https://codebushi.com/gatsby-starters-and-themes/ for more Gatsby starters.

License: Other

JavaScript 19.20% CSS 80.80%

gatsby-starter-dimension's Introduction

gatsby-starter-dimension

This is a starter for Gatsby.js V2.

The older V1 version of this starter can be found on the v1 branch:

Gatsby.js V2 starter based on the Dimension site template, designed by HTML5 UP. Check out https://codebushi.com/gatsby-starters-and-themes/ for more Gatsby starters and templates.

Preview

https://gatsby-dimension.surge.sh/

Installation

Install this starter (assuming Gatsby is installed) by running from your CLI:
gatsby new gatsby-starter-dimension https://github.com/codebushi/gatsby-starter-dimension

Run gatsby develop in the terminal to start the dev site.

gatsby-starter-dimension's People

Contributors

Stargazers

Watchers

Forkers

rob-rychs wassimz wolfy2k zacharywenner andrew-jung alexanderson1993 igorchiriac devvault tsukhu xavierartot gabbymorgan davidwwu coreyt355 mph-code johnnypackard blermyjake abdulkanjo harlanheath deanthonymiller vision-x haroonabbasi ashgia antorotolo lucasayrton gillkyle sagardesai90 sharp0111 dcorkran ah5ive lukejosten shortjared rajarshiprattipati gg-1414 unbanksytv jmsdevx pjans sgoal2 simenskristoffer vippolit cookiemonsta89 harisnaeemofficial cholai jturner11 mjaydenkim edjeong99 natkus34cp36 mhdmardini jeffyjkang dearroy vspits kbhuvanamohan treycottingham dderooy jooohhn webstrapd upkardroid mary-tyler-moore freq32 cpoliver christiankamalu jolt64 victorxdev poprg resir014 swyxio qisaw tpiros omonk phatthana wgao19 sebastianquek soyarsauce alexkimin chinying erichaick jeantanzj adamwoodnz natebakescakes bitneko taejs mklnwt dhrubo doombu hampallop filipows chocnut seeo jessebell08 kettil cbied marshallrj yds05238 jajibhee akshatgit dlevi309 bjhorn chowjiaming githubber mattshaverwebcreator stavxyz

gatsby-starter-dimension's Issues

Divider lines showing as rgb(51, 51, 51)

This is a great template thanks for sharing!

I noticed that the on Chrome, the animating lines do not always turn white. They look fine in Safari. Any insight?

show nothing when double click on close article

i try to double click on close article and it show nothing instead of back to main

update joi

(personal) [pts/2] ~  » gatsby new gatsby-starter-dimension https://github.com/codebushi/gatsby-starter-dimension
info Creating new site from git: https://github.com/codebushi/gatsby-starter-dimension.git

Cloning into 'gatsby-starter-dimension'...
remote: Enumerating objects: 350, done.
remote: Total 350 (delta 0), reused 0 (delta 0), pack-reused 350
Receiving objects: 100% (350/350), 2.57 MiB | 6.06 MiB/s, done.
success Created starter directory layout
info Installing packages...

npm WARN deprecated [email protected]: This version has been deprecated in accordance with the hapi support policy (hapi.im/support). Please upgrade to the latest version to get the best features, bug fixes, and security patches. If you are unable to upgrade at this time, paid support is available for older versions (hapi.im/commercial).```

Netlfiy forms don't submit- Netlfiy offer a fix-How can the code be worked into the starter?

``import React from 'react'
import { navigate } from 'gatsby-link'
import Layout from '../components/layout'

function encode(data) {
return Object.keys(data)
.map(key => encodeURIComponent(key) + '=' + encodeURIComponent(data[key]))
.join('&')
}

export default class Index extends React.Component {
constructor(props) {
super(props)
this.state = { isValidated: false }
}

handleChange = e => {
this.setState({ [e.target.name]: e.target.value })
}

handleSubmit = e => {
e.preventDefault()
const form = e.target
fetch('/', {
method: 'POST',
headers: { 'Content-Type': 'application/x-www-form-urlencoded' },
body: encode({
'form-name': form.getAttribute('name'),
...this.state,
}),
})
.then(() => navigate(form.getAttribute('action')))
.catch(error => alert(error))
}

render() {
return (

Contact

{/* The form-name hidden field is required to support form submissions without JavaScript */}

Don’t fill this out:{' '}

<label className="label" htmlFor={'name'}>
Your name

<label className="label" htmlFor={'email'}>
Email

<label className="label" htmlFor={'message'}>
Message

Send

)
}
}

netlify failed

It's failing to deploy on Netlify. I wonder what's the problem?

https://app.netlify.com/sites/strong-faloodeh-b71028/deploys/625880e13cfc6b105271225a

Form does not clear after submit

There is no code implemented to clear the form once the submit button has been clicked.
There is a reset button for the user to use.

But the form should really be cleared on submit.

Clicking on scrollbar closes modal / resolved

resolved

edit: removed addEventListener from handleClickOutside to avoid closing modal on scroll behavior.

best way to add favicon to project?

Hi, I tried adding a favicon to the project in line 154 on ./src/layouts/index.js file by inserting -> <link rel="icon" type="image/x-icon" href="../../favicon.ico" /> with a favicon.ico on my root dir... but with no success...

Line off center by a pixel

The vertical line above the "WORK" and "ABOUT" boxes is off center by like a pixel hardly noticeable until you change the background image then just really annoying haha. And I cannot for the life of me find the code that adjusts it.

Deactivate Scrolling

Hi, first of all thank you for making this template accessible.
I wanted to ask if there is a way to deactivate the scrolling?
Thank you in advance.

Blur/transitions slow in Firefox

Opening and closing the sections (Intro/Work/About/Contact) is really slow on Firefox. Looks great on Chrome & Safari. Not sure why.

Of course you're under no obligation to fix this, just thought I'd let you know. Thanks for the great theme 😃 !

What the hell are the dependencies?

I've been trying to set up a working env for this since 2 days now. It just won't work. First it wanted Python2 for some reason, then now it works .NET?

the index.html page generated by gatsby is black

I have downloaded and installed Gatsby following the tutorial here: https://www.gatsbyjs.org/docs/
Then I have installed the Dimension starter.
But if I open the index.html file in the public folder, I can only see a black page.

More info here: https://stackoverflow.com/questions/50470047/cant-find-my-html-pages

Try to reproduce with the following commands:

#gatsby new gatsby-starter-dimension https://github.com/ChangoMan/gatsby-starter-dimension
#cd gatsby-starter-dimension
#gatsby develop
#gatsby build
#gatsby serve

Then try to open this file with your browser: gatsby-starter-dimension\public\index.html The page is all black.

Thank you

Issue with installation and gatsby develop

When running npm install or gatsby develop I get the following:

  ⚠ The `/home/Projects/dimension/node_modules/pngquant-bin/vendor/pngquant` binary doesn't seem to work correctly
  ⚠ pngquant pre-build test failed
  ℹ compiling from source
  ✖ Error: pngquant failed to build, make sure that libpng-dev is installed
    at ChildProcess.exithandler (child_process.js:275:12)
    at emitTwo (events.js:126:13)
    at ChildProcess.emit (events.js:214:7)
    at maybeClose (internal/child_process.js:925:16)
    at Process.ChildProcess._handle.onexit (internal/child_process.js:209:5)

Corrected with this:

npm install [email protected] --save
npm install [email protected] --save

Just wanted to post in case someone else ran into the same issue.

gatsby-plugin-offline doesn't work

Hi, first of all : great starter !

When, I run an audit with Lighthouse it says that offline mode works well (it responds with a 200 code) but when I try directly (with prod build) that occurs an error.

I uninstall/reinstall the gatsby-plugin-offline but it ends similar.

Thanks for help.

"dependencies": {
    "@hapi/hoek": "^8.1.0",
    "@hapi/joi": "^15.1.0",
    "@hapi/topo": "^3.1.2",
    "core-js": "^3.1.4",
    "date-fns": "^1.30.1",
    "firebase": "^6.3.4",
    "gatsby": "^2.13.52",
    "gatsby-image": "^2.2.8",
    "gatsby-plugin-catch-links": "^2.1.2",
    "gatsby-plugin-manifest": "^2.2.5",
    "gatsby-plugin-netlify": "^2.1.3",
    "gatsby-plugin-netlify-cache": "^1.2.0",
    "gatsby-plugin-offline": "^2.2.4",
    "gatsby-plugin-react-helmet": "^3.1.3",
    "gatsby-plugin-sass": "^2.1.4",
    "gatsby-plugin-sharp": "^2.2.10",
    "gatsby-source-filesystem": "^2.1.9",
    "gatsby-transformer-sharp": "^2.2.5",
    "joi": "^14.3.1",
    "node-sass": "^4.11.0",
    "re-base": "^4.0.0",
    "react": "^16.8.5",
    "react-datetime": "^2.16.3",
    "react-dom": "^16.8.5",
    "react-helmet": "^5.2.0",
    "react-markdown": "^4.1.0",
    "react-slick": "^0.24.0",
    "styled-components": "^4.3.2",
    "topo": "^3.0.3",
    "typeface-patrick-hand": "0.0.72",
    "typeface-righteous": "0.0.72"
  },
  "devDependencies": {
    "prettier": "^1.14.2"
  },

EDITED

Internal Linking

I may be just overlooking something, but I'm still super new to webdev. But when you click on the "check out my awesome work." on the about me page it should pop open the work article right? But the link https://gatsby-dimension.surge.sh/#work just goes to the homepage and not the work article.

Dimension V4 Gatbsy V4.2.0

Rebuilt this starter for Gatsby V4, view it at Dimension V4, The Repo is at Donald Boulton's Repos.

All Images now processed with gatsby-plugin-image

random images in public/static folder?

Hi. I found some images in this folder that have nothing to do with the project. The name is something along the lines salty_egg_*.jpg. There were several of these in that folder. This happens after I gatsby develop in my root dir

Email Setting

Hi, thank you for this awesome template. I am a complete beginner in Gatsby. I wanted to know the settings for email/contacts page. I'm not using netlify.

layout and pages index

Hey, I am addapting dimension template to make a web
When I run gatsby as development mode, everything works great, it loads the layout/index.js and I doesnt even load the pages/index.js

But when I build or deploy it, it does the opposite thing, it shows the pages/index.js but not the layout/index.js

why does it behave different from development to build?

How can I get my code to work on heroku or netlify? It works locally fails when building.

Hello,

When adding an image to this template it builds correctly locally but not when I push it to Heroku or Netlify.

Here is my code.

I tried adding an image to the Header file under the first H1 tag.

Header

import React from 'react'
import PropTypes from 'prop-types'
import pedro from '../images/pedroprofile.png'

console.log(pedro)

const Header = props => (
  <header id="header" style={props.timeout ? { display: 'none' } : {}}>
    <div className="logo">
      <span className="icon fa-diamond" />
    </div>
    <div className="content">
      <div className="inner">
        <h1>Pedro LaTorre</h1>
    <span className="image main"> <img src={pedro} alt="" /></span>

    <p>You're Not Alone </p>
  </div>
</div>
<nav>
  <ul>
    <li>
      <a
        href="javascript:;"
        onClick={() => {
          props.onOpenArticle('intro')
        }}
      >
        About
      </a>
    </li>
    <li>
      <a
        href="javascript:;"
        onClick={() => {
          props.onOpenArticle('work')
        }}
      >
        Rest LA
      </a>
    </li>
    <li>
      <a
        href="javascript:;"
        onClick={() => {
          props.onOpenArticle('about')
        }}
      >
        Speaking
      </a>
    </li>
    <li>
      <a
        href="javascript:;"
        onClick={() => {
          props.onOpenArticle('contact')
        }}
      >
        Contact
      </a>
    </li>
  </ul>
</nav>

)

Header.propTypes = {
  onOpenArticle: PropTypes.func,
  route: PropTypes.object,
  timeout: PropTypes.bool,
}

export default Header
`

This is the deploy log that I receive:

12:21:46 PM: Build ready to start
12:21:47 PM: build-image version: 12783d4d177a66bec5a23ad1097ea7bd02931128
12:21:47 PM: buildbot version: 5a64b5cb0ce1ed3ba485935522483a4d39e15107
12:21:47 PM: Fetching cached dependencies
12:21:47 PM: Starting to download cache of 98.5MB
12:21:48 PM: Finished downloading cache in 554.11272ms
12:21:48 PM: Starting to extract cache
12:21:51 PM: Finished extracting cache in 3.274402692s
12:21:51 PM: Finished fetching cache in 3.975670134s
12:21:51 PM: Starting to prepare the repo for build
12:21:52 PM: Preparing Git Reference refs/heads/master
12:21:52 PM: Starting build script
12:21:52 PM: Installing dependencies
12:21:53 PM: Started restoring cached node version
12:21:55 PM: Finished restoring cached node version
12:21:56 PM: v8.14.0 is already installed.
12:21:56 PM: Now using node v8.14.0 (npm v6.4.1)
12:21:56 PM: Attempting ruby version 2.3.6, read from environment
12:21:57 PM: Using ruby version 2.3.6
12:21:57 PM: Using PHP version 5.6
12:21:57 PM: Started restoring cached node modules
12:21:57 PM: Finished restoring cached node modules
12:21:57 PM: Started restoring cached go cache
12:21:57 PM: Finished restoring cached go cache
12:21:57 PM: unset GOOS;
12:21:57 PM: unset GOARCH;
12:21:57 PM: export GOROOT='/opt/buildhome/.gimme/versions/go1.10.linux.amd64';
12:21:57 PM: export PATH="/opt/buildhome/.gimme/versions/go1.10.linux.amd64/bin:${PATH}";
12:21:57 PM: go version >&2;
12:21:57 PM: export GIMME_ENV='/opt/buildhome/.gimme/env/go1.10.linux.amd64.env';
12:21:58 PM: go version go1.10 linux/amd64
12:21:58 PM: Installing missing commands
12:21:58 PM: Verify run directory
12:21:58 PM: Executing user command: gatsby build
12:21:59 PM: success open and validate gatsby-configs — 0.009 s
12:21:59 PM: success load plugins — 0.147 s
12:22:00 PM: success onPreInit — 0.322 s
12:22:00 PM: success delete html and css files from previous builds — 0.005 s
12:22:00 PM: success initialize cache — 0.006 s
12:22:00 PM: success copy gatsby files — 0.020 s
12:22:00 PM: success onPreBootstrap — 0.011 s
12:22:00 PM: success source and transform nodes — 0.028 s
12:22:00 PM: success building schema — 0.204 s
12:22:00 PM: success createPages — 0.004 s
12:22:00 PM: success createPagesStatefully — 0.033 s
12:22:00 PM: success onPreExtractQueries — 0.000 s
12:22:00 PM: success update schema — 0.073 s
12:22:00 PM: success extract queries from components — 0.033 s
12:22:00 PM: success run graphql queries — 0.023 s — 6/6 271.09 queries/second
12:22:00 PM: success write out page data — 0.003 s
12:22:00 PM: success write out redirect data — 0.000 s
12:22:00 PM: done generating icons for manifest
12:22:00 PM: success onPostBootstrap — 0.239 s
12:22:00 PM: info bootstrap finished - 3.129 s
12:22:06 PM: error Generating JavaScript bundles failed
12:22:06 PM:
12:22:06 PM: Error: ./src/components/Header.js
12:22:06 PM: Module not found: Error: Can't resolve '../images/pedroprofile.png' in '/opt/b uild/repo/src/components'
12:22:06 PM: resolve '../images/pedroprofile.png' in '/opt/build/repo/src/components'
12:22:06 PM: using description file: /opt/build/repo/package.json (relative path: ./src/c omponents)
12:22:06 PM: Field 'browser' doesn't contain a valid alias configuration
12:22:06 PM: using description file: /opt/build/repo/package.json (relative path: ./src /images/pedroprofile.png)
12:22:06 PM: no extension
12:22:06 PM: Field 'browser' doesn't contain a valid alias configuration
12:22:06 PM: /opt/build/repo/src/images/pedroprofile.png doesn't exist
12:22:06 PM: .mjs
12:22:06 PM: Field 'browser' doesn't contain a valid alias configuration
12:22:06 PM: /opt/build/repo/src/images/pedroprofile.png.mjs doesn't exist
12:22:07 PM: .js
12:22:07 PM: Field 'browser' doesn't contain a valid alias configuration
12:22:07 PM: /opt/build/repo/src/images/pedroprofile.png.js doesn't exist
12:22:07 PM: .jsx
12:22:07 PM: Field 'browser' doesn't contain a valid alias configuration
12:22:07 PM: /opt/build/repo/src/images/pedroprofile.png.jsx doesn't exist
12:22:07 PM: .wasm
12:22:07 PM: Field 'browser' doesn't contain a valid alias configuration
12:22:07 PM: /opt/build/repo/src/images/pedroprofile.png.wasm doesn't exist
12:22:07 PM: .json
12:22:07 PM: Field 'browser' doesn't contain a valid alias configuration
12:22:07 PM: /opt/build/repo/src/images/pedroprofile.png.json doesn't exist
12:22:07 PM: as directory
12:22:07 PM: /opt/build/repo/src/images/pedroprofile.png doesn't exist
12:22:07 PM: [/opt/build/repo/src/images/pedroprofile.png]
12:22:07 PM: [/opt/build/repo/src/images/pedroprofile.png.mjs]
12:22:07 PM: [/opt/build/repo/src/images/pedroprofile.png.js]
12:22:07 PM: [/opt/build/repo/src/images/pedroprofile.png.jsx]
12:22:07 PM: [/opt/build/repo/src/images/pedroprofile.png.wasm]
12:22:07 PM: [/opt/build/repo/src/images/pedroprofile.png.json]
12:22:07 PM: @ ./src/components/Header.js 3:0-47 4:12-17 23:9-14
12:22:07 PM: @ ./src/pages/index.js
12:22:07 PM: @ ./.cache/async-requires.js
12:22:07 PM: @ ./.cache/production-app.js
12:22:07 PM:
12:22:07 PM: Caching artifacts
12:22:07 PM: Started saving node modules
12:22:07 PM: Finished saving node modules
12:22:07 PM: Started saving pip cache
12:22:07 PM: Finished saving pip cache
12:22:07 PM: Started saving emacs cask dependencies
12:22:07 PM: Finished saving emacs cask dependencies
12:22:07 PM: Started saving maven dependencies
12:22:07 PM: Finished saving maven dependencies
12:22:07 PM: Started saving boot dependencies
12:22:07 PM: Finished saving boot dependencies
12:22:08 PM: Started saving go dependencies
12:22:08 PM: Finished saving go dependencies
12:22:08 PM: Error running command: Build script returned non-zero exit code: 1
12:22:08 PM: Failing build: Failed to build site
12:22:08 PM: failed during stage 'building site': Build script returned non-zero exit code: 1
12:22:08 PM: Finished processing build request in 20.669637808s

When deployed onto gh-pages the the screens for mobile are not responsive

Running it locally is absoulutely fine but when deployed onto gh-pages, the site isn't responsive on mobile screens as expected

Expected Output:

Actual Output:

about page and contact page

the about page and contact page is blank on the deploy page. However, in development it works fine. I need help.
I don't understand what the issue is.

Thanks, in advance.

https://makeu.dance/

gatsby build issue

Hi,

I have cloned this repo and done npm i so all dependencies are there. When I run gatsby build and try to serve the public folder there is an issue with broken links. Has anyone experienced this or can help?

Posts are not rendered

If this starter suppose to render posts in /src/post, then it does not...

gatsby develop works (displays correctly), gatsby build no errors but site displays incorrectly

node v8.9.1
npm 5.5.1
unmodified https://github.com/ChangoMan/gatsby-starter-dimension

commands:
gatsby develop - all works and displays as expected
gatsby build - the site only displays black background (source shows as though the code looks fine)

neither 'develop' or 'build' throws any errors, so potentially environment?

fresh and clean windows 10 install + node + npm + git + npm install windows-build-tools -g

what could potentially be wrong?

thanks

Not working with Gatsby CLI 4.13.0

username@HOSTNAME:~/Gatsby$ gatsby new MySite https://github.com/codebushi/gatsby-starter-dimension
info Creating new site from git: https://github.com/codebushi/gatsby-starter-dimension.git

Cloning into 'MySite'...
remote: Enumerating objects: 69, done.
remote: Counting objects: 100% (69/69), done.
remote: Compressing objects: 100% (66/66), done.
remote: Total 69 (delta 3), reused 52 (delta 2), pack-reused 0
success Created starter directory layout
info Installing packages...

npm WARN deprecated [email protected]: No longer maintained. Use [lru-cache](http://npm.im/lru-cache) version 7.6 or higher, and provide an asynchronous `fetchMethod` option.
npm WARN deprecated [email protected]: See https://github.com/lydell/source-map-url#deprecated
npm WARN deprecated [email protected]: Please see https://github.com/lydell/urix#deprecated
npm WARN deprecated [email protected]: https://github.com/lydell/resolve-url#deprecated
npm WARN deprecated [email protected]: See https://github.com/lydell/source-map-resolve#deprecated
npm WARN deprecated [email protected]: The querystring API is considered Legacy. new code should use the URLSearchParams API instead.
npm WARN deprecated [email protected]: Please upgrade  to version 7 or higher.  Older versions may use Math.random() in certain circumstances, which is known to be problematic.  See https://v8.dev/blog/math-random for details.
npm WARN deprecated [email protected]: this library is no longer supported
npm WARN deprecated @hapi/[email protected]: This version has been deprecated and is no longer supported or maintained
npm WARN deprecated @hapi/[email protected]: This version has been deprecated and is no longer supported or maintained
npm WARN deprecated [email protected]: This loader has been deprecated. Please use eslint-webpack-plugin
npm WARN deprecated @hapi/[email protected]: Moved to 'npm install @sideway/address'
npm WARN deprecated [email protected]: babel-eslint is now @babel/eslint-parser. This package will no longer receive updates.
npm WARN deprecated [email protected]: The `subscriptions-transport-ws` package is no longer maintained. We recommend you use `graphql-ws` instead. For help migrating Apollo software to `graphql-ws`, see https://www.apollographql.com/docs/apollo-server/data/subscriptions/#switching-from-subscriptions-transport-ws    For general help using `graphql-ws`, see https://github.com/enisdenjo/graphql-ws/blob/master/README.md
npm WARN deprecated [email protected]: The querystring API is considered Legacy. new code should use the URLSearchParams API instead.
npm WARN deprecated @hapi/[email protected]: This version has been deprecated and is no longer supported or maintained
npm WARN deprecated [email protected]: Chokidar 2 does not receive security updates since 2019. Upgrade to chokidar 3 with 15x fewer dependencies
npm WARN deprecated [email protected]: request has been deprecated, see https://github.com/request/request/issues/3142
npm WARN deprecated [email protected]: Chokidar 2 does not receive security updates since 2019. Upgrade to chokidar 3 with 15x fewer dependencies
npm WARN deprecated @hapi/[email protected]: Switch to 'npm install joi'
npm WARN deprecated [email protected]: This SVGO version is no longer supported. Upgrade to v2.x.x.
npm WARN deprecated [email protected]: This version of tar is no longer supported, and will not receive security updates. Please upgrade asap.
npm WARN deprecated [email protected]: gatsby-recipes has been removed from gatsby/gatsby-cli >=4.5.0. Update to gatsby@latest/gatsby-cli@latest to use versions without gatsby-recipes. This package will no longer receive updates.
npm ERR! code 1
npm ERR! path /home/username/Gatsby/MySite/node_modules/node-sass
npm ERR! command failed
npm ERR! command sh -c node scripts/build.js
npm ERR! Building: /home/username/.nvm/versions/node/v16.14.2/bin/node /home/username/Gatsby/MySite/node_modules/node-gyp/bin/node-gyp.js rebuild --verbose --libsass_ext= --libsass_cflags= --libsass_ldflags= --libsass_library=
npm ERR! gyp info it worked if it ends with ok
npm ERR! gyp verb cli [
npm ERR! gyp verb cli   '/home/username/.nvm/versions/node/v16.14.2/bin/node',
npm ERR! gyp verb cli   '/home/username/Gatsby/MySite/node_modules/node-gyp/bin/node-gyp.js',
npm ERR! gyp verb cli   'rebuild',
npm ERR! gyp verb cli   '--verbose',
npm ERR! gyp verb cli   '--libsass_ext=',
npm ERR! gyp verb cli   '--libsass_cflags=',
npm ERR! gyp verb cli   '--libsass_ldflags=',
npm ERR! gyp verb cli   '--libsass_library='
npm ERR! gyp verb cli ]
npm ERR! gyp info using [email protected]
npm ERR! gyp info using [email protected] | linux | x64
npm ERR! gyp verb command rebuild []
npm ERR! gyp verb command clean []
npm ERR! gyp verb clean removing "build" directory
npm ERR! gyp verb command configure []
npm ERR! gyp verb check python checking for Python executable "python2" in the PATH
npm ERR! gyp verb `which` failed Error: not found: python2
npm ERR! gyp verb `which` failed     at getNotFoundError (/home/username/Gatsby/MySite/node_modules/which/which.js:13:12)
npm ERR! gyp verb `which` failed     at F (/home/username/Gatsby/MySite/node_modules/which/which.js:68:19)
npm ERR! gyp verb `which` failed     at E (/home/username/Gatsby/MySite/node_modules/which/which.js:80:29)
npm ERR! gyp verb `which` failed     at /home/username/Gatsby/MySite/node_modules/which/which.js:89:16
npm ERR! gyp verb `which` failed     at /home/username/Gatsby/MySite/node_modules/isexe/index.js:42:5
npm ERR! gyp verb `which` failed     at /home/username/Gatsby/MySite/node_modules/isexe/mode.js:8:5
npm ERR! gyp verb `which` failed     at FSReqCallback.oncomplete (node:fs:198:21)
npm ERR! gyp verb `which` failed  python2 Error: not found: python2
npm ERR! gyp verb `which` failed     at getNotFoundError (/home/username/Gatsby/MySite/node_modules/which/which.js:13:12)
npm ERR! gyp verb `which` failed     at F (/home/username/Gatsby/MySite/node_modules/which/which.js:68:19)
npm ERR! gyp verb `which` failed     at E (/home/username/Gatsby/MySite/node_modules/which/which.js:80:29)
npm ERR! gyp verb `which` failed     at /home/username/Gatsby/MySite/node_modules/which/which.js:89:16
npm ERR! gyp verb `which` failed     at /home/username/Gatsby/MySite/node_modules/isexe/index.js:42:5
npm ERR! gyp verb `which` failed     at /home/username/Gatsby/MySite/node_modules/isexe/mode.js:8:5
npm ERR! gyp verb `which` failed     at FSReqCallback.oncomplete (node:fs:198:21) {
npm ERR! gyp verb `which` failed   code: 'ENOENT'
npm ERR! gyp verb `which` failed }
npm ERR! gyp verb check python checking for Python executable "python" in the PATH
npm ERR! gyp verb `which` failed Error: not found: python
npm ERR! gyp verb `which` failed     at getNotFoundError (/home/username/Gatsby/MySite/node_modules/which/which.js:13:12)
npm ERR! gyp verb `which` failed     at F (/home/username/Gatsby/MySite/node_modules/which/which.js:68:19)
npm ERR! gyp verb `which` failed     at E (/home/username/Gatsby/MySite/node_modules/which/which.js:80:29)
npm ERR! gyp verb `which` failed     at /home/username/Gatsby/MySite/node_modules/which/which.js:89:16
npm ERR! gyp verb `which` failed     at /home/username/Gatsby/MySite/node_modules/isexe/index.js:42:5
npm ERR! gyp verb `which` failed     at /home/username/Gatsby/MySite/node_modules/isexe/mode.js:8:5
npm ERR! gyp verb `which` failed     at FSReqCallback.oncomplete (node:fs:198:21)
npm ERR! gyp verb `which` failed  python Error: not found: python
npm ERR! gyp verb `which` failed     at getNotFoundError (/home/username/Gatsby/MySite/node_modules/which/which.js:13:12)
npm ERR! gyp verb `which` failed     at F (/home/username/Gatsby/MySite/node_modules/which/which.js:68:19)
npm ERR! gyp verb `which` failed     at E (/home/username/Gatsby/MySite/node_modules/which/which.js:80:29)
npm ERR! gyp verb `which` failed     at /home/username/Gatsby/MySite/node_modules/which/which.js:89:16
npm ERR! gyp verb `which` failed     at /home/username/Gatsby/MySite/node_modules/isexe/index.js:42:5
npm ERR! gyp verb `which` failed     at /home/username/Gatsby/MySite/node_modules/isexe/mode.js:8:5
npm ERR! gyp verb `which` failed     at FSReqCallback.oncomplete (node:fs:198:21) {
npm ERR! gyp verb `which` failed   code: 'ENOENT'
npm ERR! gyp verb `which` failed }
npm ERR! gyp ERR! configure error
npm ERR! gyp ERR! stack Error: Can't find Python executable "python", you can set the PYTHON env variable.
npm ERR! gyp ERR! stack     at PythonFinder.failNoPython (/home/username/Gatsby/MySite/node_modules/node-gyp/lib/configure.js:484:19)
npm ERR! gyp ERR! stack     at PythonFinder.<anonymous> (/home/username/Gatsby/MySite/node_modules/node-gyp/lib/configure.js:406:16)
npm ERR! gyp ERR! stack     at F (/home/username/Gatsby/MySite/node_modules/which/which.js:68:16)
npm ERR! gyp ERR! stack     at E (/home/username/Gatsby/MySite/node_modules/which/which.js:80:29)
npm ERR! gyp ERR! stack     at /home/username/Gatsby/MySite/node_modules/which/which.js:89:16
npm ERR! gyp ERR! stack     at /home/username/Gatsby/MySite/node_modules/isexe/index.js:42:5
npm ERR! gyp ERR! stack     at /home/username/Gatsby/MySite/node_modules/isexe/mode.js:8:5
npm ERR! gyp ERR! stack     at FSReqCallback.oncomplete (node:fs:198:21)
npm ERR! gyp ERR! System Linux 5.10.102.1-microsoft-standard-WSL2
npm ERR! gyp ERR! command "/home/username/.nvm/versions/node/v16.14.2/bin/node" "/home/username/Gatsby/MySite/node_modules/node-gyp/bin/node-gyp.js" "rebuild" "--verbose" "--libsass_ext=" "--libsass_cflags=" "--libsass_ldflags=" "--libsass_library="
npm ERR! gyp ERR! cwd /home/username/Gatsby/MySite/node_modules/node-sass
npm ERR! gyp ERR! node -v v16.14.2
npm ERR! gyp ERR! node-gyp -v v3.8.0
npm ERR! gyp ERR! not ok
npm ERR! Build failed with error code: 1

npm ERR! A complete log of this run can be found in:

 ERROR

Command failed with exit code 1: npm install



  Error: Command failed with exit code 1: npm install

  - error.js:60 makeError
    [lib]/[gatsby-cli]/[execa]/lib/error.js:60:11


  - index.js:118 handlePromise
    [lib]/[gatsby-cli]/[execa]/index.js:118:26

  - task_queues:96 processTicksAndRejections
    node:internal/process/task_queues:96:5

  - init-starter.js:135 install
    [lib]/[gatsby-cli]/lib/init-starter.js:135:7

  - init-starter.js:202 clone
    [lib]/[gatsby-cli]/lib/init-starter.js:202:3


  - init-starter.js:343 initStarter
    [lib]/[gatsby-cli]/lib/init-starter.js:343:5

  - create-cli.js:460
    [lib]/[gatsby-cli]/lib/create-cli.js:460:9

checkbox isn't displayed

The checkbox is unusable, it isn't displayed at all.

Change the favicon?

New to gatsby. What's the best way to change up the favicon? I tried just adding a link tag but that didn't seem to work.

Lock files belong in git

Firstly, thanks for the work on this starter, it's awesome.

Just noticed that the lock files are excluded from git. I know yarn recommends keeping yarn.lock in git, and I imagine it's the same for npm. Happy to whip up a PR putting the yarn.lock file into the repo if you like. Or at least removing it from the .gitignore. I didn't realise at first that it wasn't included...