https://github.com/astrolicious/astro-theme-provider

Author themes for Astro like a normal project and export your work as an integration for others to use
https://github.com/astrolicious/astro-theme-provider

Last synced: 5 days ago
JSON representation

Author themes for Astro like a normal project and export your work as an integration for others to use

• Host: GitHub
• URL: https://github.com/astrolicious/astro-theme-provider
• Owner: astrolicious
• License: unlicense
• Created: 2023-09-18T15:33:22.000Z (over 1 year ago)
• Default Branch: main
• Last Pushed: 2025-02-07T23:11:44.000Z (13 days ago)
• Last Synced: 2025-02-14T04:24:57.010Z (7 days ago)
• Language: TypeScript
• Homepage: https://astro-theme-provider.netlify.app/
• Size: 6.9 MB
• Stars: 35
• Watchers: 4
• Forks: 2
• Open Issues: 23
• Metadata Files:
  • Readme: README.md
  • Contributing: CONTRIBUTING.md
  • License: LICENSE

Awesome Lists containing this project

README

        
# `astro-theme-provider`

[![npm version](https://img.shields.io/npm/v/astro-theme-provider?labelColor=red&color=grey)](https://www.npmjs.com/package/astro-theme-provider)

![beta](https://img.shields.io/badge/Beta-orange)

Author themes for Astro like a normal project and export your work as an integration for others to use

### [Documentation](https://astro-theme-provider.netlify.app)

### [Theme Template](https://github.com/astrolicious/astro-theme-provider-template)

### Contributing

- [Contributing Guide](https://github.com/astrolicious/astro-theme-provider/blob/main/CONTRIBUTING.md)

- [Discord Channel](https://chat.astrolicious.dev)

- [Discussions](https://github.com/astrolicious/astro-theme-provider/discussions)

- [Issues](https://github.com/astrolicious/astro-theme-provider/issues)

### Example

**Authoring a Theme**:

```

package/

├── public/

├── src/

│   ├── assets/

│   ├── components/

│   ├── layouts/

│   ├── pages/

│   └── styles/

├── index.ts

└── package.json

```

```ts

// package/index.ts

import defineTheme from 'astro-theme-provider';

import { z } from 'astro/zod'

export default defineTheme({

  schema: z.object({

    title: z.string(),

  })

})

```

**Using a Theme**:

```ts

// astro.config.mjs

import { defineConfig } from 'astro/config';

import Blog from 'blog-theme';

export default defineConfig({

  integrations: [

    Blog({

      config: {

        title: "My Blog"

      },

      pages: {

        '/404': false, // Toggle routes off

        '/blog': '/projects', // Overwrite routes

      },

      overrides: {

        components: {

          Hero: './src/Custom.astro' // Overwrite theme assets

        },

        styles: [

          "./src/custom.css" // Add custom stylesheets

        ],

      },

    }),

  ],

});

```