Skip to content

Migrating

You can check the changelog file on GitHub for more detailed list of changes.

catalyst-blog v2.0.0

  • This was a breaking change to allow for better component architecture, remove the need for a featuredImage and add in a number of additional frontmatter fields, like socialImage.
  • Rewrite of the core blog theme to be more basic and act as as “data” theme with fewer presentational components. Less you have to undo as a developer, however if you were using version 1.0 or earlier a lot of the styles you would have had are gone. The good news however is that these styles can be easily added back in via component shadowing. You can look at gatsby-theme-catalyst-helium to see how this is done and copy those files and tweak to your liking.
  • If you have trouble migrating let me know and I will help out. v1.0 of this theme should work for a long time to come, so no rush.
  • You can see an example of this migration on my personal blog, https://github.com/ehowey/erichoweydev, if you look at the code you can see how the components are shadowed and the blog is implemented.

v1.0.0

  • Move your theme-ui file from src/gatsby-theme-catalyst-core/theme.js -> src/gatsby-plugin-theme-ui/index.js. No other change should be needed. This was done to be more in line with recommended best practice. There is now a ‘base theme’ for Theme-UI which is exported from gatsby-theme-catalyst-core. You can use this to write smaller and more condensed themes in the starters using the following syntax:
import { merge } from "theme-ui"
import { BaseTheme } from "gatsby-theme-catalyst-core"
export default merge(BaseTheme, {
// Modifications to the base theme go here. This is an example changing colors and using variants to change your navigation links. Uncomment the code below to see what happens.
})
  • Depreciated gatsby-theme-catalyst-writer in favor of gatsby-theme-catalyst-hydrogen. If you were using the writer theme it will continue to work, and should work for a long time to come. If you want to migrate to hydrogen then it will be possible with a little effort as the expected data structures from SANITY were unchanged. The main change you need to make is to ensure you have the same SANITY.io schema files in your site as in the theme as this is where the GraphQL query is generated from. If you are having trouble migrating please get in touch via issues and I will help you out.

  • This is technically not a breaking change but it could change your sites appearance. Base navigation link styles were simplified in the structural themes and then added back in for the presentational themes using variants in the Theme-UI file. You can see an example of this in gatsby-theme-catalyst-hydrogen if you would like to see how to do it on your site, look in gatsby-theme-catalyst-hydrogen/src/gatsby-plugin-theme-ui/index.js towards the end of the file.

Removal of isMobile Context and mobileMenuBreakpoint

These are depreciated and will stop working post v1.0. There was a perfomance issue with SSR and javascript that was causing a flash of unstyled content. I have reverted back to using normal media queries for changing to the mobile menu at the second breakpoint, 768px by default.

© 2020 Gatsby Theme Catalyst