[legacy-framework] Add Theme UI recipe (including MDX!)

[tundera]

What are the changes and their implications?

This recipe adds Theme UI support to a blitz app. The implementation is based on the material-ui and chakra recipes. I've been using Theme UI pretty often this past year, mostly in Next.js projects. I've set this up a handful of times in Blitz, and it takes about a half hour each time to update/add the necessary files and packages. This recipe does the same configuration and setup for you automatically.

Progress 🏃

• Add base theme file [2020-10-19]
• Create injectInitializeColorMode method [2020-10-19]
• Import InitializeColorMode component in _document [2020-10-19]
• Create wrapComponentWithThemeProvider method [2020-10-19]
• Import base theme and ThemeProvider in _app [2020-10-19]
• MDX Layout components (see implementation)

Status

This is a work-in-progress with a couple outstanding issues. Working with jscodeshift methods for the first time, so any input is welcome!

Any other ideas or input is much appreciated 😀

Checklist

• Tests added for changes
• PR submitted to blitzjs.com for any user facing changes

[flybayer]

Thanks @tundera! I marked this as draft for better tracking. Click "Ready for Review" when ready :)

[flybayer]

Hey @tundera are you able to finish this?

[tundera]

@flybayer hey I think this is ready to go!

[flybayer]

@tundera Awesome, good job!!

@all-contributors add @tundera for code

[allcontributors]

@flybayer

I've put up a pull request to add @tundera! 🎉

[flybayer]

I changed the versions to be specific major version instead of latest to so a new major with breaking changes won't break this recipe.

[tundera]

Awesome!