github withastro/starlight @astrojs/starlight@0.36.0

21 hours ago

Minor Changes

  • #3427 c3b2d0f Thanks @delucis! - Fixes styling of labels that wrap across multiple lines in <Tabs> component

    ⚠️ Potentially breaking change: Tab labels now have a narrower line-height and additional vertical padding. If you have custom CSS targetting the <Tabs> component, you may want to double check the visual appearance of your tabs when updating.

    If you want to preserve the previous styling, you can add the following custom CSS to your site:

    .tab > [role='tab'] {
      line-height: var(--sl-line-height);
      padding-block: 0;
    }
  • #3380 3364af3 Thanks @HiDeoo! - Makes head entry parsing stricter in Starlight config and content frontmatter.

    ⚠️ Potentially breaking change: Previously Starlight would accept a head entry for a meta tag defining some content which generates invalid HTML as <meta> is a void element which cannot have any child nodes. Now, it is an error to define a meta tag including some content.

    If you see errors after updating, look for head entries in the Starlight configuration in the astro.config.mjs file or in the frontmatter of your content files that include a content property for a meta tag. To fix the error, move the content property to the attrs object with at least an additional attribute to identify the kind of metadata it represents:

    head: {
      tag: 'meta',
    - content: 'foo',
      attrs: {
        name: 'my-meta',
    +   content: 'foo',
      },
    },
  • #3340 2018c31 Thanks @HiDeoo! - Adds missing vertical spacing between Markdown content and UI Framework components using client directives.

    ⚠️ Potentially breaking change: By default, Starlight applies some vertical spacing (--sl-content-gap-y) between Markdown content blocks. This change introduces similar spacing between Markdown content blocks and UI Framework components using client directives which was not present before.

    If you were relying on the previous behavior, you can manually override the spacing by manually specifying the top margin on the component using custom CSS, e.g. by relying on a CSS class to target the component.

    .my-custom-component {
      margin-top: 0;
    }

Patch Changes

  • #3423 a0d0670 Thanks @andersk! - Fixes HTML validity in sidebar groups by ensuring <summary> is the first child of <details>

Don't miss a new starlight release

NewReleases is sending notifications on new releases.