From 641e8b12dfec50241b5b1cc366815db730bfb5f0 Mon Sep 17 00:00:00 2001
From: HiDeoo <494699+HiDeoo@users.noreply.github.com>
Date: Sat, 17 May 2025 14:01:15 +0200
Subject: [PATCH 1/3] docs: update examples

---
 docs/src/content/docs/examples/asides.mdx     |  65 +++--
 docs/src/content/docs/examples/badges.mdx     |  13 +-
 .../content/docs/examples/banner-splash.md    |   5 +-
 docs/src/content/docs/examples/banner.md      |   5 +-
 docs/src/content/docs/examples/cards.mdx      |  50 ++--
 .../src/content/docs/examples/code-blocks.mdx |  42 +++-
 docs/src/content/docs/examples/draft.md       |   3 +-
 docs/src/content/docs/examples/file-tree.mdx  |   3 +
 docs/src/content/docs/examples/hero.md        |  23 +-
 .../content/docs/examples/kitchen-sink.mdx    | 225 ++++++++++++++++++
 .../content/docs/examples/link-buttons.mdx    |  31 +--
 docs/src/content/docs/examples/markdown.md    |  43 ++--
 docs/src/content/docs/examples/steps.mdx      |  11 +-
 docs/src/content/docs/examples/tabs.mdx       |  21 +-
 14 files changed, 414 insertions(+), 126 deletions(-)
 create mode 100644 docs/src/content/docs/examples/kitchen-sink.mdx

diff --git a/docs/src/content/docs/examples/asides.mdx b/docs/src/content/docs/examples/asides.mdx
index 190f6e8..afaa763 100644
--- a/docs/src/content/docs/examples/asides.mdx
+++ b/docs/src/content/docs/examples/asides.mdx
@@ -1,68 +1,63 @@
 ---
 title: Asides
+pagefind: false
 ---
 
 ## Markdown asides
 
+Asides rendered with the [custom Markdown syntax](https://starlight.astro.build/guides/authoring-content/#asides) using a pair of triple colons `:::` to wrap your content.
+
 :::note
 
-Donec sollicitudin dolor et sollicitudin [efficitur](#_). Nullam semper posuere lacinia.
+A `note` aside with a [link](#_) in the content.
 
 :::
 
 :::tip
 
-Donec sollicitudin dolor et sollicitudin [efficitur](#_). Nullam semper posuere lacinia.
+A `tip` aside with a [link](#_) in the content.
 
 :::
 
 :::caution
 
-Donec sollicitudin dolor et sollicitudin [efficitur](#_). Nullam semper posuere lacinia.
+A `caution` aside with a [link](#_) in the content.
 
 :::
 
 :::danger
 
-Donec sollicitudin dolor et sollicitudin [efficitur](#_). Nullam semper posuere lacinia.
+A `danger` aside with a [link](#_) in the content.
 
 :::
 
 ## Component asides
 
+Asides rendered with the [`<Aside>` component](https://starlight.astro.build/components/asides/).
+
 import { Aside } from '@astrojs/starlight/components'
 
-<Aside>
-  Donec sollicitudin dolor et sollicitudin [efficitur](#_). Nullam semper
-  posuere lacinia.
-</Aside>
+<Aside>A `note` aside with a [link](#_) in the content.</Aside>
 
-<Aside type="tip">
-  Donec sollicitudin dolor et sollicitudin [efficitur](#_). Nullam semper
-  posuere lacinia.
-</Aside>
+<Aside type="tip">A `tip` aside with a [link](#_) in the content.</Aside>
 
 <Aside type="caution">
-  Donec sollicitudin dolor et sollicitudin [efficitur](#_). Nullam semper
-  posuere lacinia.
+  A `caution` aside with a [link](#_) in the content.
 </Aside>
 
-<Aside type="danger">
-  Donec sollicitudin dolor et sollicitudin [efficitur](#_). Nullam semper
-  posuere lacinia.
-</Aside>
+<Aside type="danger">A `danger` aside with a [link](#_) in the content.</Aside>
 
-## With content
+## Asides with content
 
 :::note
 
-Some code:
+A code block:
 
 ```js
 const foo = 'bar'
 ```
 
-Some `inline` code
+A sentence with some `inline` code followed by an horizontal rule.
 
 ---
 
@@ -80,9 +75,9 @@ A table:
 A disclosure:
 
 <details>
-<summary>Nullam nec posuere lorem.</summary>
+<summary>The summary of the disclosure</summary>
 
-Aenean tempor, orci eget ullamcorper luctus, nisl turpis pharetra mauris, sit amet tristique elit orci et sem. Aenean odio purus, suscipit quis accumsan in, blandit at ex.
+The content of the [disclosure](https://starlight.astro.build/guides/authoring-content/#details) that can use any other Markdown syntax.
 
 </details>
 
@@ -90,13 +85,13 @@ Aenean tempor, orci eget ullamcorper luctus, nisl turpis pharetra mauris, sit am
 
 :::tip
 
-Some code:
+A code block:
 
 ```js
 const foo = 'bar'
 ```
 
-Some `inline` code
+A sentence with some `inline` code followed by an horizontal rule.
 
 ---
 
@@ -114,9 +109,9 @@ A table:
 A disclosure:
 
 <details>
-<summary>Nullam nec posuere lorem.</summary>
+<summary>The summary of the disclosure</summary>
 
-Aenean tempor, orci eget ullamcorper luctus, nisl turpis pharetra mauris, sit amet tristique elit orci et sem. Aenean odio purus, suscipit quis accumsan in, blandit at ex.
+The content of the [disclosure](https://starlight.astro.build/guides/authoring-content/#details) that can use any other Markdown syntax.
 
 </details>
 
@@ -124,13 +119,13 @@ Aenean tempor, orci eget ullamcorper luctus, nisl turpis pharetra mauris, sit am
 
 :::caution
 
-Some code:
+A code block:
 
 ```js
 const foo = 'bar'
 ```
 
-Some `inline` code
+A sentence with some `inline` code followed by an horizontal rule.
 
 ---
 
@@ -148,9 +143,9 @@ A table:
 A disclosure:
 
 <details>
-<summary>Nullam nec posuere lorem.</summary>
+<summary>The summary of the disclosure</summary>
 
-Aenean tempor, orci eget ullamcorper luctus, nisl turpis pharetra mauris, sit amet tristique elit orci et sem. Aenean odio purus, suscipit quis accumsan in, blandit at ex.
+The content of the [disclosure](https://starlight.astro.build/guides/authoring-content/#details) that can use any other Markdown syntax.
 
 </details>
 
@@ -158,13 +153,13 @@ Aenean tempor, orci eget ullamcorper luctus, nisl turpis pharetra mauris, sit am
 
 :::danger
 
-Some code:
+A code block:
 
 ```js
 const foo = 'bar'
 ```
 
-Some `inline` code
+A sentence with some `inline` code followed by an horizontal rule.
 
 ---
 
@@ -182,9 +177,9 @@ A table:
 A disclosure:
 
 <details>
-<summary>Nullam nec posuere lorem.</summary>
+<summary>The summary of the disclosure</summary>
 
-Aenean tempor, orci eget ullamcorper luctus, nisl turpis pharetra mauris, sit amet tristique elit orci et sem. Aenean odio purus, suscipit quis accumsan in, blandit at ex.
+The content of the [disclosure](https://starlight.astro.build/guides/authoring-content/#details) that can use any other Markdown syntax.
 
 </details>
 
diff --git a/docs/src/content/docs/examples/badges.mdx b/docs/src/content/docs/examples/badges.mdx
index 2237882..3053394 100644
--- a/docs/src/content/docs/examples/badges.mdx
+++ b/docs/src/content/docs/examples/badges.mdx
@@ -1,11 +1,14 @@
 ---
 title: Badges
+pagefind: false
 ---
 
+Badges rendered with the [`<Badge>` component](https://starlight.astro.build/components/badges/).
+
 import { Badge } from '@astrojs/starlight/components'
 
-<Badge text="New" variant="tip" size="small" />
-<Badge text="Deprecated" variant="caution" size="medium" />
-<Badge text="Rapide" variant="note" size="large" />
-<Badge text="200" variant="success" />
-<Badge text="Experimental" variant="danger" />
+- <Badge text="New" variant="tip" size="small" />
+- <Badge text="Deprecated" variant="caution" size="medium" />
+- <Badge text="Demo" variant="note" size="large" />
+- <Badge text="200" variant="success" />
+- <Badge text="Experimental" variant="danger" />
diff --git a/docs/src/content/docs/examples/banner-splash.md b/docs/src/content/docs/examples/banner-splash.md
index c937121..81496d7 100644
--- a/docs/src/content/docs/examples/banner-splash.md
+++ b/docs/src/content/docs/examples/banner-splash.md
@@ -1,9 +1,10 @@
 ---
 title: Banner - Splash
+pagefind: false
 template: splash
 banner:
   content: |
-    Aenean eleifend, felis quis <a href="https://example.com">faucibus</a> lobortis, nunc erat interdum turpis, quis consectetur orci mauris eget leo.
+    A <a href="https://starlight.astro.build/reference/frontmatter/#banner">banner</a> displaying an announcement at the top of the page that can include HTML for links or other content.
 ---
 
-A page using the splash template with a banner.
+A page using the [`splash` template](https://starlight.astro.build/reference/frontmatter/#template) with a [banner](https://starlight.astro.build/reference/frontmatter/#banner).
diff --git a/docs/src/content/docs/examples/banner.md b/docs/src/content/docs/examples/banner.md
index cc8883e..0f8131d 100644
--- a/docs/src/content/docs/examples/banner.md
+++ b/docs/src/content/docs/examples/banner.md
@@ -1,8 +1,9 @@
 ---
 title: Banner
+pagefind: false
 banner:
   content: |
-    Aenean eleifend, felis quis <a href="https://example.com">faucibus</a> lobortis, nunc erat interdum turpis, quis consectetur orci mauris eget leo.
+    A <a href="https://starlight.astro.build/reference/frontmatter/#banner">banner</a> displaying an announcement at the top of the page that can include HTML for links or other content.
 ---
 
-A page with a banner
+A page with a [banner](https://starlight.astro.build/reference/frontmatter/#banner).
diff --git a/docs/src/content/docs/examples/cards.mdx b/docs/src/content/docs/examples/cards.mdx
index 3d9c867..62e6707 100644
--- a/docs/src/content/docs/examples/cards.mdx
+++ b/docs/src/content/docs/examples/cards.mdx
@@ -1,49 +1,59 @@
 ---
 title: Cards
+pagefind: false
 ---
 
 import { Card, CardGrid, LinkCard } from '@astrojs/starlight/components'
 
-## Single card
+## Card
 
-<Card title="In consectetur diam">
-  Donec sollicitudin dolor et sollicitudin efficitur. Nullam semper posuere
-  lacinia.
+A card rendered with the [`<Card>` component](https://starlight.astro.build/components/cards/).
+
+<Card title="Card title">
+  The content of the card that can use any other Markdown syntax.
 </Card>
 
-## Cards in a grid
+## Card grid
+
+Cards rendered with the [`<Card>` component](https://starlight.astro.build/components/cards/) wrapped with the [`<CardGrid>` component](https://starlight.astro.build/components/card-grids/).
 
 <CardGrid>
-  <Card title="Lorem" icon="star">
-    Fusce ornare ante est.
+  <Card title="Card title" icon="star">
+    The content of the card.
   </Card>
-  <Card title="Ipsum" icon="moon">
-    Suspendisse ac tincidunt.
+  <Card title="Card title" icon="moon">
+    The content of the card.
   </Card>
 </CardGrid>
 
-## Staggered cards in a grid
+## Staggered card grid
+
+[Staggered](https://starlight.astro.build/components/card-grids/#stagger-cards) cards rendered with the [`<Card>` component](https://starlight.astro.build/components/cards/) wrapped with the [`<CardGrid>` component](https://starlight.astro.build/components/card-grids/).
 
 <CardGrid stagger>
-  <Card title="Lorem" icon="star">
-    Fusce ornare ante est.
+  <Card title="Card title" icon="star">
+    The content of the card.
   </Card>
-  <Card title="Ipsum" icon="moon">
-    Suspendisse ac tincidunt.
+  <Card title="Card title" icon="moon">
+    The content of the card.
   </Card>
 </CardGrid>
 
-## Single link card
+## Link card
+
+A link card rendered with the [`<LinkCard>` component](https://starlight.astro.build/components/link-cards/).
 
 <LinkCard
-  title="In consectetur diam"
-  description="Donec sollicitudin dolor et sollicitudin efficitur"
+  title="Link title"
+  description="The description of the link."
   href="#_"
 />
 
-## Link cards in a grid
+## Link card grid
+
+Link cards rendered with the [`<LinkCard>` component](https://starlight.astro.build/components/link-cards/) wrapped with the [`<CardGrid>` component](https://starlight.astro.build/components/card-grids/).
 
 <CardGrid>
-  <LinkCard title="Fusce ornare ante est" href="#_" />
-  <LinkCard title="Suspendisse ac tincidunt" href="#_" />
+  <LinkCard title="Link title" href="#_" />
+  <LinkCard title="Link title" href="#_" />
 </CardGrid>
diff --git a/docs/src/content/docs/examples/code-blocks.mdx b/docs/src/content/docs/examples/code-blocks.mdx
index 3dc9775..f6d29b6 100644
--- a/docs/src/content/docs/examples/code-blocks.mdx
+++ b/docs/src/content/docs/examples/code-blocks.mdx
@@ -1,21 +1,28 @@
 ---
 title: Code Blocks
+pagefind: false
 ---
 
 ## Markdown code block
 
+Code block rendered with the [Markdown syntax](https://starlight.astro.build/guides/authoring-content/#code-blocks) using three backticks <code>```</code> at the start and end.
+
 ```js
 const foo = 'bar'
 ```
 
 ## `<Code>` component
 
+Code block rendered with the [`<Code>` component](https://starlight.astro.build/components/code/).
+
 import { Code } from '@astrojs/starlight/components'
 
 <Code code="const foo = 'bar'" lang="js" />
 
 ## Text markers
 
+Code blocks with some [text markers](https://expressive-code.com/key-features/text-markers/).
+
 ```js {2}
 function test() {
   const foo = 'bar'
@@ -28,8 +35,31 @@ function test() {
 }
 ```
 
+### Labels
+
+Code blocks with some [text markers](https://expressive-code.com/key-features/text-markers/) and [labels](https://expressive-code.com/key-features/text-markers/#adding-labels-to-line-markers).
+
+{/* prettier-ignore-start */}
+```astro title="example.astro" {"1. Keep the existing icon.":5-6} del={"2. Remove the button.":8-9} ins={"3. Add a link.":11-12}
+---
+import { Icon } from '@astrojs/starlight/components';
+---
+
+
+<Icon name="seti:lock" />
+
+
+<button type="button">Login</button>
+
+
+<a href="/login/">Login</a>
+```
+{/* prettier-ignore-end */}
+
 ## Diff
 
+Code block combining [syntax highlighting with `diff`-like syntax](https://expressive-code.com/key-features/text-markers/#combining-syntax-highlighting-with-diff-like-syntax).
+
 ```diff lang="js"
   function test() {
 -   const foo = 'bar'
@@ -37,15 +67,19 @@ function test() {
   }
 ```
 
-## File name
+## Editor frame
+
+Code block with a [file name](https://expressive-code.com/key-features/frames/#code-editor-frames) in the editor frame.
 
 ```js
 // test.js
 const foo = 'bar'
 ```
 
-## Terminal window
+## Terminal frame
+
+Code block with a [terminal frame](https://expressive-code.com/key-features/frames/#terminal-frames).
 
-```bash title="Doing something…"
-pnpm run thing
+```bash title="Build something…"
+pnpm run build
 ```
diff --git a/docs/src/content/docs/examples/draft.md b/docs/src/content/docs/examples/draft.md
index 53eb781..c844d14 100644
--- a/docs/src/content/docs/examples/draft.md
+++ b/docs/src/content/docs/examples/draft.md
@@ -1,6 +1,7 @@
 ---
 title: Draft
+pagefind: false
 draft: true
 ---
 
-This is a draft.
+A [draft](https://starlight.astro.build/reference/frontmatter/#draft) page not included in production builds.
diff --git a/docs/src/content/docs/examples/file-tree.mdx b/docs/src/content/docs/examples/file-tree.mdx
index 654dc43..165a929 100644
--- a/docs/src/content/docs/examples/file-tree.mdx
+++ b/docs/src/content/docs/examples/file-tree.mdx
@@ -1,7 +1,10 @@
 ---
 title: File Tree
+pagefind: false
 ---
 
+A structure of a directory rendered with the [`<FileTree>` component](https://starlight.astro.build/components/file-tree/).
+
 import { FileTree } from '@astrojs/starlight/components'
 
 <FileTree>
diff --git a/docs/src/content/docs/examples/hero.md b/docs/src/content/docs/examples/hero.md
index 5d8aa93..0f5a75e 100644
--- a/docs/src/content/docs/examples/hero.md
+++ b/docs/src/content/docs/examples/hero.md
@@ -1,24 +1,25 @@
 ---
 title: Hero
+pagefind: false
 template: splash
-editUrl: false
-prev: false
-next: false
 hero:
-  title: Lorem Ipsum
-  tagline: Lorem ipsum dolor sit amet, consectetur adipiscing elit.
+  title: Hero title
+  tagline: A tagline for the hero section.
   image:
     file: ../../../assets/hero.webp
   actions:
-    - text: Phasellus tincidunt
-      link: /getting-started/
+    - text: Primary action
+      link: '#_'
       icon: right-arrow
       variant: primary
-    - text: Vestibulum
-      link: /getting-started/
+    - text: Secondary action
+      link: '#_'
       icon: right-arrow
       variant: secondary
-    - text: Morbi in
-      link: /getting-started/
+    - text: Minimal action
+      link: '#_'
       icon: external
+      variant: minimal
 ---
+
+A page using the [`splash` template](https://starlight.astro.build/reference/frontmatter/#template) with a [`hero`](https://starlight.astro.build/reference/frontmatter/#banner) component at the top.
diff --git a/docs/src/content/docs/examples/kitchen-sink.mdx b/docs/src/content/docs/examples/kitchen-sink.mdx
new file mode 100644
index 0000000..e8fd88c
--- /dev/null
+++ b/docs/src/content/docs/examples/kitchen-sink.mdx
@@ -0,0 +1,225 @@
+---
+title: Kitchen sink
+pagefind: false
+sidebar:
+  order: 1
+  badge: Demo
+---
+
+A page with a wide variety of different [Markdown syntax](https://starlight.astro.build/guides/authoring-content/) or [components](https://starlight.astro.build/components/using-components/) to show how these look together.
+See the following pages for individual examples.
+
+## Asides
+
+:::note
+A `:::note` or `<Aside type="note">` aside with a [link](#_) in the content.
+:::
+
+:::tip
+A `:::tip` or `<Aside type="tip">` aside with a [link](#_) in the content.
+:::
+
+:::caution
+A `:::caution` or `<Aside type="caution">` aside with a [link](#_) in the content.
+:::
+
+:::danger
+A `:::danger` or `<Aside type="danger">` aside with a [link](#_) in the content.
+:::
+
+## Badges
+
+import { Badge } from '@astrojs/starlight/components'
+
+- <Badge text="New" variant="tip" size="small" />
+- <Badge text="Deprecated" variant="caution" size="medium" />
+- <Badge text="Demo" variant="note" size="large" />
+- <Badge text="200" variant="success" />
+- <Badge text="Experimental" variant="danger" />
+
+## Blockquotes
+
+> The content of the quote can use **any** other Markdown syntax.
+
+## Cards
+
+import { Card } from '@astrojs/starlight/components'
+
+<Card title="Card title">
+  The content of the card that can use any other Markdown syntax.
+</Card>
+
+### Card grid
+
+import { CardGrid } from '@astrojs/starlight/components'
+
+<CardGrid>
+  <Card title="Card title" icon="star">
+    The content of the card.
+  </Card>
+  <Card title="Card title" icon="moon">
+    The content of the card.
+  </Card>
+</CardGrid>
+
+### Link card
+
+import { LinkCard } from '@astrojs/starlight/components'
+
+<LinkCard
+  title="Link title"
+  description="The description of the link."
+  href="#_"
+/>
+
+### Link card grid
+
+<CardGrid>
+  <LinkCard title="Link title" href="#_" />
+  <LinkCard title="Link title" href="#_" />
+</CardGrid>
+
+## Details
+
+<details>
+<summary>The summary of the disclosure</summary>
+
+The content of the [disclosure](https://starlight.astro.build/guides/authoring-content/#details) that can use any other Markdown syntax.
+
+</details>
+
+## Code Blocks
+
+```astro title="example.astro" {7} ins="insertions" del="deletions"
+---
+// A code block example
+---
+
+<p>A paragraph with a variable: {Astro.props.foo}</p>
+
+With highlighted content. Including insertions or deletions.
+```
+
+### Diff
+
+```diff lang="js"
+  function test() {
+-   const foo = 'bar'
++   const foo = 'baz'
+  }
+```
+
+### Labels
+
+{/* prettier-ignore-start */}
+```astro title="example.astro" {"1. Keep the existing icon.":5-6} del={"2. Remove the button.":8-9} ins={"3. Add a link.":11-12}
+---
+import { Icon } from '@astrojs/starlight/components'
+---
+
+
+<Icon name="seti:lock" />
+
+
+<button type="button">Login</button>
+
+
+<a href="/login/">Login</a>
+```
+{/* prettier-ignore-end */}
+
+### Terminal frame
+
+```bash title="Build something…"
+pnpm run build
+```
+
+## File Tree
+
+import { FileTree } from '@astrojs/starlight/components'
+
+<FileTree>
+
+- astro.config.mjs an **important** file
+- package.json
+- README.md
+- src
+  - components
+    - **Header.astro**
+  - …
+- pages/
+
+</FileTree>
+
+## Link Buttons
+
+import { LinkButton } from '@astrojs/starlight/components'
+
+<LinkButton href="#_" icon="rocket">
+  Primary
+</LinkButton>
+<LinkButton href="#_" variant="secondary" icon="external">
+  Secondary
+</LinkButton>
+<LinkButton href="#_" variant="minimal" icon="external">
+  Minimal
+</LinkButton>
+
+## Steps
+
+import { Steps } from '@astrojs/starlight/components'
+
+<Steps>
+
+1. The first step of the guide that can use **any** other Markdown syntax.
+
+   ```js
+   const foo = 'bar'
+   ```
+
+2. A second and final step.
+
+</Steps>
+
+## Tabs
+
+import { Tabs, TabItem } from '@astrojs/starlight/components'
+
+<Tabs>
+
+<TabItem label="npm" icon="seti:npm">
+
+```sh
+npm install starlight-theme-rapide
+```
+
+</TabItem>
+
+<TabItem label="pnpm" icon="pnpm">
+
+```sh
+pnpm add starlight-theme-rapide
+```
+
+</TabItem>
+
+<TabItem label="Yarn" icon="seti:yarn">
+
+```sh
+yarn add starlight-theme-rapide
+```
+
+</TabItem>
+
+</Tabs>
+
+## Tables
+
+| Column 1 | Column 2 | Column 3 | Column 4 |
+| -------- | -------- | -------- | -------- |
+| Cell 1-1 | Cell 1-2 | Cell 1-3 | Cell 1-4 |
+| Cell 2-1 | Cell 2-2 | Cell 2-3 | Cell 2-4 |
+| Cell 3-1 | Cell 3-2 | Cell 3-3 | Cell 3-4 |
+| Cell 4-1 | Cell 4-2 | Cell 4-3 | Cell 4-4 |
+| Cell 5-1 | Cell 5-2 | Cell 5-3 | Cell 5-4 |
+| Cell 6-1 | Cell 6-2 | Cell 6-3 | Cell 6-4 |
diff --git a/docs/src/content/docs/examples/link-buttons.mdx b/docs/src/content/docs/examples/link-buttons.mdx
index 429bcf1..d95643a 100644
--- a/docs/src/content/docs/examples/link-buttons.mdx
+++ b/docs/src/content/docs/examples/link-buttons.mdx
@@ -1,31 +1,32 @@
 ---
 title: Link Buttons
+pagefind: false
 ---
 
 import { LinkButton } from '@astrojs/starlight/components'
 
 ## No icons
 
-<LinkButton href="/getting-started/">Get started</LinkButton>
-<LinkButton href="https://starlight.astro.build/" variant="secondary">
-  Related: Starlight
+Link buttons rendered with the [`<LinkButton>` component](https://starlight.astro.build/components/link-buttons/).
+
+<LinkButton href="#_">Primary</LinkButton>
+<LinkButton href="#_" variant="secondary">
+  Secondary
 </LinkButton>
-<LinkButton href="https://docs.astro.build/" variant="minimal">
-  Related: Astro
+<LinkButton href="#_" variant="minimal">
+  Minimal
 </LinkButton>
 
 ## With icons
 
-<LinkButton href="/getting-started/" icon="rocket">
-  Get started
+Link buttons rendered with the [`<LinkButton>` component](https://starlight.astro.build/components/link-buttons/) and [an icon](https://starlight.astro.build/components/link-buttons/#add-icons-to-link-buttons).
+
+<LinkButton href="#_" icon="rocket">
+  Primary
 </LinkButton>
-<LinkButton
-  href="https://starlight.astro.build/"
-  variant="secondary"
-  icon="external"
->
-  Related: Starlight
+<LinkButton href="#_" variant="secondary" icon="external">
+  Secondary
 </LinkButton>
-<LinkButton href="https://docs.astro.build/" variant="minimal" icon="external">
-  Related: Astro
+<LinkButton href="#_" variant="minimal" icon="external">
+  Minimal
 </LinkButton>
diff --git a/docs/src/content/docs/examples/markdown.md b/docs/src/content/docs/examples/markdown.md
index 3434493..19e02e5 100644
--- a/docs/src/content/docs/examples/markdown.md
+++ b/docs/src/content/docs/examples/markdown.md
@@ -1,40 +1,41 @@
 ---
 title: Markdown
+pagefind: false
 ---
 
 ## Heading 2
 
-Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed eu ante elementum, ultrices massa ut, ornare lacus. Praesent iaculis, ex ac pellentesque malesuada, arcu mi imperdiet purus, et molestie neque leo quis felis. Nunc et odio bibendum, vestibulum elit sit amet, viverra lorem.
+Some text content used as a placeholder for the purpose of this example page. The content is not meant to be meaningful or relevant, but rather to preview how the page will look with actual content.
 
 ### Heading 3
 
-Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed eu ante elementum, ultrices massa ut, ornare lacus. Praesent iaculis, ex ac pellentesque malesuada, arcu mi imperdiet purus, et molestie neque leo quis felis. Nunc et odio bibendum, vestibulum elit sit amet, viverra lorem.
+Some text content used as a placeholder for the purpose of this example page. The content is not meant to be meaningful or relevant, but rather to preview how the page will look with actual content.
 
 #### Heading 4
 
-Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed eu ante elementum, ultrices massa ut, ornare lacus. Praesent iaculis, ex ac pellentesque malesuada, arcu mi imperdiet purus, et molestie neque leo quis felis. Nunc et odio bibendum, vestibulum elit sit amet, viverra lorem.
+Some text content used as a placeholder for the purpose of this example page. The content is not meant to be meaningful or relevant, but rather to preview how the page will look with actual content.
 
 ##### Heading 5
 
-Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed eu ante elementum, ultrices massa ut, ornare lacus. Praesent iaculis, ex ac pellentesque malesuada, arcu mi imperdiet purus, et molestie neque leo quis felis. Nunc et odio bibendum, vestibulum elit sit amet, viverra lorem.
+Some text content used as a placeholder for the purpose of this example page. The content is not meant to be meaningful or relevant, but rather to preview how the page will look with actual content.
 
 ###### Heading 6
 
-Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed eu ante elementum, ultrices massa ut, ornare lacus. Praesent iaculis, ex ac pellentesque malesuada, arcu mi imperdiet purus, et molestie neque leo quis felis. Nunc et odio bibendum, vestibulum elit sit amet, viverra lorem.
+Some text content used as a placeholder for the purpose of this example page. The content is not meant to be meaningful or relevant, but rather to preview how the page will look with actual content.
 
 ## Styling text
 
-Fusce imperdiet, **tellus** ornare tempor _cursus_, tellus ipsum fringilla ~~quam~~, in venenatis neque augue vitae **_turpis_**. Nulla sed neque volutpat, eleifend purus <sub>sit amet</sub>, porttitor nisi. Ut id sodales lorem. Suspendisse <sup>auctor</sup> augue nisl, sed placerat enim porttitor at. Etiam eu ipsum suscipit, egestas ante non, eleifend nulla.
+Some text content with some **bold** text, _italic_ text, ~~strikethrough~~ text, and some **_bold italic_** text. Some text can also be displayed as <sub>subscript</sub> or <sup>superscript</sup>.
 
 ## Quoting text
 
-Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla in enim sem.
+Some text content can be quoted using the `>` character.
 
-> Mauris dictum augue augue, ut accumsan tellus convallis ut. Nam vitae libero vestibulum, feugiat mi rhoncus, imperdiet dui. In eros diam, sagittis ultrices dolor ac, ultrices cursus sapien. Morbi fringilla porta purus, sed interdum urna luctus vitae.
+> The content of the quote can use **any** other Markdown syntax.
 
-## Quoting code
+## Code
 
-Curabitur congue ac `enim` id hendrerit.
+Code can be displayed `inline` or in a code block.
 
 ```js
 const foo = 'bar'
@@ -42,17 +43,17 @@ const foo = 'bar'
 
 ## Links
 
-Fusce tincidunt urna at [ultricies](#_) sollicitudin.
+Some text content with a [link](#_) to another page.
 
 ## Lists
 
-- Lorem
-- Ipsum
-  - Dolor
-  - Sit
-- Amet
-  1. Consectetur
-  2. Adipiscing
+- List items
+- can
+  - be
+  - nested
+- and
+  1. be
+  2. numbered
 
 ## Tables
 
@@ -67,9 +68,11 @@ Fusce tincidunt urna at [ultricies](#_) sollicitudin.
 
 ## Details
 
+Details (also known as “disclosures” or “accordions”) can be used to hide content that is not immediately relevant.
+
 <details>
-<summary>Nullam nec posuere lorem.</summary>
+<summary>The summary of the disclosure</summary>
 
-Aenean tempor, orci eget ullamcorper luctus, nisl turpis pharetra mauris, sit amet tristique elit orci et sem. Aenean odio purus, suscipit quis accumsan in, blandit at ex.
+The content of the [disclosure](https://starlight.astro.build/guides/authoring-content/#details) that can use any other Markdown syntax.
 
 </details>
diff --git a/docs/src/content/docs/examples/steps.mdx b/docs/src/content/docs/examples/steps.mdx
index 2f13960..87f18b8 100644
--- a/docs/src/content/docs/examples/steps.mdx
+++ b/docs/src/content/docs/examples/steps.mdx
@@ -1,28 +1,31 @@
 ---
 title: Steps
+pagefind: false
 ---
 
+A numbered list of tasks used to create a step-by-step guide rendered with the [`<Steps>` component](https://starlight.astro.build/components/steps/).
+
 import { Steps } from '@astrojs/starlight/components'
 
 <Steps>
 
-1. Lorem ipsum dolor sit amet, consectetur adipiscing elit.
+1. The first step of the guide that can use **any** other Markdown syntax.
 
    ```js
    const foo = 'bar'
    ```
 
-2. Aenean nisi sem, maximus at fringilla a, tempor non diam.
+2. A second step with a nested list of tasks.
 
    <Steps>
 
-   1. Lorem ipsum dolor sit amet, consectetur adipiscing elit.
+   1. A nested step of the guide that can use **any** other Markdown syntax.
 
       ```js
       const foo = 'bar'
       ```
 
-   2. Aenean nisi sem, maximus at fringilla a, tempor non diam.
+   2. And a final step.
 
    </Steps>
 
diff --git a/docs/src/content/docs/examples/tabs.mdx b/docs/src/content/docs/examples/tabs.mdx
index 2f8b5fb..550f425 100644
--- a/docs/src/content/docs/examples/tabs.mdx
+++ b/docs/src/content/docs/examples/tabs.mdx
@@ -1,21 +1,28 @@
 ---
 title: Tabs
+pagefind: false
 ---
 
 import { Tabs, TabItem } from '@astrojs/starlight/components'
 
+## No icons
+
+A tabbed interface rendered with the [`<Tabs>` and `<TabItem>` components](https://starlight.astro.build/components/tabs/).
+
 <Tabs>
-  <TabItem label="Lorem">
-    Lorem ipsum dolor sit amet, consectetur adipiscing elit. Fusce ornare ante
-    est, eget molestie arcu euismod eu. Suspendisse ac tincidunt tellus, sed
-    vehicula eros.
+  <TabItem label="A tab">
+    The first tab content that can use **any** other Markdown syntax.
   </TabItem>
-  <TabItem label="Ipsum">
-    Nam condimentum, lorem eget scelerisque pellentesque, arcu sapien fringilla
-    ligula, eget dictum lectus odio in mi.
+  <TabItem label="Another tab">
+    The content of the second tab that can also use **any** other Markdown
+    syntax.
   </TabItem>
 </Tabs>
 
+## With icons
+
+A tabbed interface rendered with the [`<Tabs>` and `<TabItem>` components](https://starlight.astro.build/components/tabs/) and [icons](https://starlight.astro.build/components/tabs/#add-icons-to-tabs).
+
 <Tabs>
 
 <TabItem label="npm" icon="seti:npm">

From 6f5527671fca3eace44ded422310360925ade722 Mon Sep 17 00:00:00 2001
From: HiDeoo <494699+HiDeoo@users.noreply.github.com>
Date: Sat, 17 May 2025 14:03:35 +0200
Subject: [PATCH 2/3] docs: update homepage

---
 docs/src/content/docs/index.mdx | 11 ++++++-----
 1 file changed, 6 insertions(+), 5 deletions(-)

diff --git a/docs/src/content/docs/index.mdx b/docs/src/content/docs/index.mdx
index 4cb6801..0531703 100644
--- a/docs/src/content/docs/index.mdx
+++ b/docs/src/content/docs/index.mdx
@@ -20,11 +20,11 @@ hero:
   image:
     html: '⚡'
   actions:
-    - text: Getting Started
+    - text: Get started
       link: /getting-started/
       icon: rocket
     - text: Examples
-      link: /examples/asides/
+      link: /examples/kitchen-sink/
       icon: right-arrow
       variant: minimal
 ---
@@ -34,15 +34,16 @@ import { Card, CardGrid } from '@astrojs/starlight/components'
 ## Next steps
 
 <CardGrid stagger>
-  <Card title="Install the plugin" icon="puzzle">
+  <Card title="Install the theme" icon="puzzle">
     Check the [getting started guide](/getting-started/) for installation
     instructions.
   </Card>
-  <Card title="Configure the plugin" icon="rocket">
+  <Card title="Configure the theme" icon="rocket">
     Edit your config in the `astro.config.mjs` file.
   </Card>
   <Card title="Preview the theme" icon="seti:image">
-    Check out the [examples](/examples/asides/) to see the theme in action.
+    Check out the [example pages](/examples/kitchen-sink/) to see the theme in
+    action.
   </Card>
   <Card title="Read the docs" icon="open-book">
     Learn more in the [Starlight Rapide Docs](/getting-started/).

From 9fd12ac62b6c45cc1134c95e813a609e944bbdb2 Mon Sep 17 00:00:00 2001
From: HiDeoo <494699+HiDeoo@users.noreply.github.com>
Date: Sat, 17 May 2025 14:06:36 +0200
Subject: [PATCH 3/3] docs: update customization page

---
 docs/src/content/docs/customization.mdx | 6 +++---
 1 file changed, 3 insertions(+), 3 deletions(-)

diff --git a/docs/src/content/docs/customization.mdx b/docs/src/content/docs/customization.mdx
index 9f45c41..e7f1592 100644
--- a/docs/src/content/docs/customization.mdx
+++ b/docs/src/content/docs/customization.mdx
@@ -5,7 +5,7 @@ description: Learn how to customize your Starlight site and the Starlight Rapide
 
 ## Custom CSS
 
-To customize the styles applied to your Starlight site when using the Starlight Rapide theme, you can providing additional CSS files to modify or extend the Starlight and the Starlight Rapide theme default styles.
+To customize the styles applied to your Starlight site when using the Starlight Rapide theme, you can provide additional CSS files to modify or extend the Starlight and Starlight Rapide theme default styles.
 
 [Learn more about custom CSS in the Starlight documentation.](https://starlight.astro.build/guides/css-and-tailwind/#custom-css-styles)
 
@@ -13,9 +13,9 @@ To customize the styles applied to your Starlight site when using the Starlight
 
 Like Starlight, the Starlight Rapide theme uses [cascade layers](https://developer.mozilla.org/en-US/docs/Learn/CSS/Building_blocks/Cascade_layers) internally to manage the order of its styles.
 This ensures a predictable CSS order and allows for simpler overrides.
-Any custom unlayered CSS will override the default styles from the `starlight` and `rapide` layers.
+Any custom unlayered CSS will override the default styles from Starlight and the Starlight Rapide theme.
 
-If you are using cascade layers, you can use [`@layer`](https://developer.mozilla.org/en-US/docs/Web/CSS/@layer) in your [custom CSS](https://starlight.astro.build/guides/css-and-tailwind/#custom-css-styles) to define the order of precedence for different layers relative to the Starlight and Starlight Rapide theme styles:
+If you are using cascade layers, you can use [`@layer`](https://developer.mozilla.org/en-US/docs/Web/CSS/@layer) in your [custom CSS](https://starlight.astro.build/guides/css-and-tailwind/#custom-css-styles) to define the order of precedence for different layers relative to styles from the `starlight` and `rapide` layers:
 
 ```css "starlight" "rapide"
 /* src/styles/custom.css */