Skip to content

Latest commit

 

History

History
99 lines (66 loc) · 7.36 KB

README.md

File metadata and controls

99 lines (66 loc) · 7.36 KB
Raw

@arshad/gatsby-themes

A collection of open source, well designed, highly customizable and 100% free Gatsby themes for blazing fast sites.

License PRs welcome! Follow @arshadcn

Themes

Flex

Demo Version

Flex is a Gatsby theme that lets you build your site by writing simple components inside Markdown files.

Phoenix

Demo Version

A Gatsby theme that bundles a blog, portfolio, photography and podcast. It uses Tailwind CSS for theming and includes code highlighting with Prism, RSS feed, a dark mode and great typography.

Architecture

All included themes are composed themes, which means they make use of multiple core themes for core types and a child theme for styles and latent component shadowing. This architecture allows themes to be flexible and customizable.

The following diagram shows an example of theme composition for @arshad/gatsby-theme-phoenix.

Theme composition

As you can see, you can easily swap @arshad/gatsby-theme-phoenix with your own theme and styles, keeping all functionality unchanged.

Core themes

The following core themes are available. They bundle core types and functionality. They include no styles and are meant to be consumed by other themes or sites. Use them to compose and build your own themes.

To learn more about theme composition, check out the official docs.

Name Version Description
@arshad/gatsby-theme-core Version Shared types and helpers for @arshad/gatsby-themes
@arshad/gatsby-theme-blog-core Version Adds a Post type that you can use to build a blog. Includes post excerpt, featured image, tags/categories and paginated pages.
@arshad/gatsby-theme-page-core Version Adds a Page type with MDX support. Includes code highlighting with prismjs.
@arshad/gatsby-theme-photo-core Version Adds a Photo type that you can use to build a photography site.
@arshad/gatsby-theme-podcast-core Version Adds a Podcast and PodcastEpisode types that you can use to build a podcast site. Podcast episodes are pulled from podcast feed.
@arshad/gatsby-theme-portfolio-core Version Adds a Project types that you can use to build a portfolio site.

Click on the theme page to learn more about the core theme and how to use it.

Usage

Browse our free themes or create your own. You can mix and match core themes to compose your Gatsby site.

Example

To build a portfolio site with a blog, run the following command in your site.

yarn add @arshad/gatsby-theme-portfolio-core @arshad/gatsby-theme-blog-core

Then enable the themes in your gatsby-config.js

// gatsby-config.js
...
  plugins: [
    `@arshad/gatsby-theme-blog-core`,
    `@arshad/gatsby-theme-portfolio-core`
  ]
...

To disable a core theme, run yarn remove @arshad/gatsby-theme-name and then remove it from your gatsby-config.js file.

Support

Need help? Create an issue on the main repo @arshad/gatsby-themes or ask me @arshadcn.

License

License