jlengstorf / authoring-gatsby-themes

Hi. I’m Jason. I build lots of demos on this account and the @learnwithjason organization. Most of them are built live on Learn With Jason, a live-streamed pair programming show where super smart people join to teach us something new in 90 minutes.

I help dev tooling companies tell better stories and build stronger communities through creative media and strategy consulting. For more information about me (and a whole lot of shenanigans), check out jason.energy.

I have been booped on the nose 41 times.

You can boop my nose by running npx boop-jasons-nose. (I built this with @gr2m on an episode of Learn With Jason.)

authoring-gatsby-themes's Issues

Styles on theme not applied

Description

Following the course posted on egghead.io all goes well until part 13.

Following the steps on how to consume a theme into a gatsby application i've ran into some issues with the styles not being applied.

Steps to reproduce

• Created a new folder called theme-test
• Ran yarn init -y
• Added the dependencies @jlengstorf/gatsby-theme-events, gatsby, react, react-dom
• As i have gatsby-cli installed and updated i skipped the step
• Created a gatsby-config.js with the following content:

module.exports={
    plugins:[
        '@jlengstorf/gatsby-theme-events'
    ]
}

• Issued gatsby develop and it yelds the following result:
  

• Continued on with the course to the final lesson.

• Following the instructions on the final lesson to override the color the following folder structure was created:

| theme-test
  |src
    |@jlengstorf
       |gatsby-theme-events
          theme.js

• Added the following to theme.js file:

import {theme as BaseTheme} from '@jlengstorf/gatsby-theme-events/src/theme'

export const theme={
    ...BaseTheme,
    colors:{
        ...BaseTheme.colors,
        primary:'blue'
    }
}

• Restarted the development server and it should show me a header styled with the color blue but i'm presented with the same result as above.

• The odd thing is that overriding the whole component via component shadowing works. Created src\@jlengstorf\gatsby-theme-events\components\layout.js with the following contents:

import React from 'react';

export default ({children})=>(<>{children}</>)

• Restarted the server and i'm presented with the following:
  

Feel free to provide feedback
Thanks in advance

Gatsby should not be in dependency in gatsby-theme-events

It's already in devDependency. I don't think you need to put it in dependency since users might want to install newer versions

https://github.com/jlengstorf/authoring-gatsby-themes/blob/master/gatsby-theme-events/package.json#L25

Lesson 9 - Query Error within the templates category.js

Following the course posted on egghead.io all goes well until part 9.

Steps to reproduce
Starting after lesson 8, setup the config and node files to accept options. At this point I start to receive the warning that the GraphQL query in the non-page component will not be run.

Note—I switched the terminology from events to categories, which you'll see in the console info I post below. That's just the naming, everything else has been the same.