Remove inline CSS styling from tokens.mdx using Astro Starlight components

[Copilot]

Removes all inline styles and custom CSS from the tokens reference page, replacing them with clean markdown and Astro Starlight's CardGrid component for the ownership examples section.

Changes

• Import Starlight components: Added Card and CardGrid from @astrojs/starlight/components
• Token sections: Removed styled badges (<span style="...">) and wrapper divs (<div style="padding-left: 1.5rem;">) from all token reference sections, using clean markdown instead
• Ownership examples: Replaced styled grid divs with <CardGrid> containing two <Card title="..."> components for side-by-side comparison
• CLI/UI sections: Removed <div style="padding-left: 1.5rem;"> wrappers, using clean markdown
• Hash anchors: Preserved h3 headers for cross-reference links

Before:

### `GITHUB_TOKEN`
<span style="display: inline-block; padding: 0.2rem 0.65rem; border-radius: 9999px; background-color: #60a5fa; ...">Automatically set</span>

<div style="padding-left: 1.5rem;">
  Content...
</div>

After:

### `GITHUB_TOKEN`

**Automatically set** — GitHub Actions automatically provides this token...

Content...

Result: Zero inline styles, clean markdown structure, maintained functionality. The CardGrid component is used only for the ownership comparison section to provide a better layout than inline-styled divs.

---

💡 You can make Copilot smarter by setting up custom instructions, customizing its development environment and configuring Model Context Protocol (MCP) servers. Learn more Copilot coding agent tips in the docs.

[github-actions]

🔍 PR Triage Results

Category: docs | Risk: low | Priority: 15/100

Scores Breakdown

• Impact: 8/50 - Documentation styling improvement, minimal impact on functionality
• Urgency: 2/30 - WIP draft, very new (< 1 hour old), low urgency
• Quality: 5/20 - Draft PR with CI pending, incomplete checklist, basic description

📋 Recommended Action: defer

WIP draft PR for documentation styling. Wait for author to complete checklist and mark ready for review.

---

Triaged by PR Triage Agent on 2026-02-11T18:30:00Z - Run #21917749368

AI generated by PR Triage Agent

[pelikhan]

@copilot remove use of single cards elements for token section.

[Copilot]

Pull request overview

This PR refactors the Tokens reference documentation page to remove inline styling/custom layout markup and instead use Astro Starlight’s Card / CardGrid components for a more theme-consistent presentation.

Changes:

• Introduces Starlight Card/CardGrid components to present token reference sections as cards.
• Replaces inline-styled layout wrappers (padding-left divs, custom grid divs, styled badges) with markdown + Starlight components.
• Simplifies screenshot markup by removing custom wrapper elements and leaving plain <picture> blocks.

Comments suppressed due to low confidence (1)

docs/src/content/docs/reference/tokens.mdx:69

• In the ownership examples, the explanatory text is no longer semantically tied to the images (it used to be a caption block). Consider using <figure>/<figcaption> inside each Card (or otherwise marking the text as a caption) to preserve the image–caption relationship for accessibility.

<CardGrid>
  <Card title="User-owned repository">
    <picture>
      <source media="(prefers-color-scheme: dark)" srcSet="/gh-aw/images/user-owned_dark.png" />
      <img alt="User-owned repository example" src="/gh-aw/images/user-owned_light.png" />
    </picture>
    
    Avatar shows a personal profile icon, URL includes username
  </Card>

---

💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.

[Copilot]

The GitHub UI screenshot used to have an explicit caption (and role="note") but it’s now just a <picture> with no accompanying caption text. Consider wrapping this in a semantic <figure>/<figcaption> (or adding a short caption paragraph immediately after) so the context isn’t lost for screen-reader users and people skimming the page.

This issue also appears on line 61 of the same file.

[Copilot]

There are whitespace-only lines inside the <Card> bodies (e.g., between </picture> and the caption text). These can create noisy diffs and may trigger trailing-whitespace checks in some pipelines; consider removing the indentation-only blank lines.

[Copilot]

@copilot remove use of single cards elements for token section.

Removed all Card components from token sections. The CardGrid with two Cards for ownership examples is kept as it provides a cleaner side-by-side layout than styled divs. Fixed in cb720eb.

Warning

Firewall rules blocked me from connecting to one or more addresses (expand for details)

I tried to connect to the following addresses, but was blocked by firewall rules:

• telemetry.astro.build
  • Triggering command: /opt/hostedtoolcache/node/24.13.0/x64/bin/node node /home/REDACTED/.npm/_npx/aa98e6899c6baff3/node_modules/.bin/astro build (dns block)

If you need me to access, download, or install something from one of these locations, you can either:

• Configure Actions setup steps to set up my environment, which run before the firewall is enabled
• Add the appropriate URLs or hosts to the custom allowlist in this repository's Copilot coding agent settings (admins only)