0
Fork 0
mirror of https://github.com/withastro/astro.git synced 2025-01-20 22:12:38 -05:00
astro/.changeset/cold-crabs-arrive.md
Marco Campos 4afb5fe23c Feature: add support for shiki defaultColors option (#11341)
* feat: add shiki option for default color

* feat: propagate shiki option for default color to astro config

* feat: add tests for default color

* chore: add change set

* fix: add complete type to shiki default color config

* fix: remove unneeded heavy shiki theme from fixture

* fix: add literals to schema validation

Co-authored-by: Bjorn Lu <bjornlu.dev@gmail.com>

* Update .changeset/cold-crabs-arrive.md

Co-authored-by: Sarah Rainsberger <sarah@rainsberger.ca>

* feat: improve changeset

* grammar tweak

---------

Co-authored-by: Bjorn Lu <bjornlu.dev@gmail.com>
Co-authored-by: Sarah Rainsberger <sarah@rainsberger.ca>
2024-07-18 09:29:02 +01:00

32 lines
909 B
Markdown

---
'@astrojs/markdown-remark': minor
'astro': minor
---
Adds support for [Shiki's `defaultColor` option](https://shiki.style/guide/dual-themes#without-default-color).
This option allows you to override the values of a theme's inline style, adding only CSS variables to give you more flexibility in applying multiple color themes.
Configure `defaultColor: false` in your Shiki config to apply throughout your site, or pass to Astro's built-in `<Code>` component to style an individual code block.
```js title="astro.config.mjs"
import { defineConfig } from 'astro/config';
export default defineConfig({
markdown: {
shikiConfig: {
themes: {
light: 'github-light',
dark: 'github-dark',
},
defaultColor: false,
},
},
});
```
```astro
---
import { Code } from 'astro:components';
---
<Code code={`const useMyColors = true`} lang="js" defaultColor={false} />
```