feat: add new styling and accessibility Skills#13261
Merged
Conversation
Surface the MCP server, llms.txt, AGENTS.md, and AI components package on the docs website so developers can discover AI-assisted development tooling.
Collaborator
|
🧹 Preview deployment cleaned up: https://pr-13261--ui5-webcomponents.netlify.app |
- Split "AI Development" into focused pages: CLI, MCP Server, and Skills - Add CLI page for project scaffolding and component generation - Add Skills page for Agent Skills - Add AI-Ready bullet to Introduction - Add bash/json Prism highlighting - Add styling Agent Skill (SKILL.md) - Renumber sidebar and fix broken links
ilhan007
changed the title
ilhan007
changed the title
styling Skill
- Add sidebar-sparkle class for highlighting new doc pages - Align NEW/EXP/DEPR component badges to consistent style - Vertically center all sidebar badges
Covers accessibility APIs, label-input relationships, invisible messaging, icon modes, high contrast themes, and tooltips.
ilhan007
changed the title
styling Skillstyling and accessibility Skills
Remove npx skills add instructions that don't work. Skills are auto-discovered in the repo and manually copied for external projects.
Skills are discoverable via npx skills add once the branch is merged to main.
Adds an "Ask AI" dropdown button to all doc page headers that lets users copy page content or open it in AI tools (Claude, ChatGPT, v0, GitHub Copilot) with a pre-filled prompt about the page being viewed. Component pages include a "View source" link to the GitHub source file.
Use float:right so the button consistently aligns next to the h1 on both component pages (synthetic title) and regular doc pages (title from markdown content). Remove the Layout swizzle.
ilhan007
added a commit
that referenced
this pull request
Mar 13, 2026
* docs: add AI Tooling page to documentation website Surface the MCP server, llms.txt, AGENTS.md, and AI components package on the docs website so developers can discover AI-assisted development tooling. * docs: align page title with sidebar label * docs: update * docs: restructure AI docs into CLI, MCP Server, Skills - Split "AI Development" into focused pages: CLI, MCP Server, and Skills - Add CLI page for project scaffolding and component generation - Add Skills page for Agent Skills - Add AI-Ready bullet to Introduction - Add bash/json Prism highlighting - Add styling Agent Skill (SKILL.md) - Renumber sidebar and fix broken links * docs: add NEW badge to MCP Server and Skills, align sidebar badges - Add sidebar-sparkle class for highlighting new doc pages - Align NEW/EXP/DEPR component badges to consistent style - Vertically center all sidebar badges * feat: add addCustomCSS as last resort in styling skill * feat: add accessibility Agent Skill Covers accessibility APIs, label-input relationships, invisible messaging, icon modes, high contrast themes, and tooltips. * docs: fix Skills page installation instructions Remove npx skills add instructions that don't work. Skills are auto-discovered in the repo and manually copied for external projects. * docs: restore npx skills add instructions Skills are discoverable via npx skills add once the branch is merged to main. * docs: fix GitHub org references from SAP/ui5-webcomponents to UI5/webcomponents * docs: improve homepage title and meta description * docs: refine addCustomCSS guidance in styling skill * fix: pin sidebar badges to header row in expanded categories * docs: add "Ask AI" dropdown to documentation pages Adds an "Ask AI" dropdown button to all doc page headers that lets users copy page content or open it in AI tools (Claude, ChatGPT, v0, GitHub Copilot) with a pre-filled prompt about the page being viewed. Component pages include a "View source" link to the GitHub source file. * fix: align Ask AI button with page title using float right Use float:right so the button consistently aligns next to the h1 on both component pages (synthetic title) and regular doc pages (title from markdown content). Remove the Layout swizzle.
Collaborator
|
🎉 This PR is included in version v2.21.0-rc.1 🎉 The release is available on v2.21.0-rc.1 Your semantic-release bot 📦🚀 |
Collaborator
|
🎉 This PR is included in version v2.21.0 🎉 The release is available on v2.21.0 Your semantic-release bot 📦🚀 |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
2 participants
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Summary
Adds Agent Skills that teach AI coding assistants how to work with UI5 Web Components:
styling— CSS shadow parts, custom states, CSS variables, tag-level styling, andaddCustomCSSas a last resortaccessibility— accessibility APIs (accessibleName,accessibleNameRef,accessibleDescription,accessibleRole,accessibilityAttributes), label-input relationships, invisible messaging, icon modes, high contrast theming, and tooltipsAdditionally, restructures the documentation website:
bashandjsonPrism languages in DocusaurusTest plan