openclaw/openclaw.ai
1
0
Fork 0
mirror of https://github.com/openclaw/openclaw.ai.git synced 2026-07-15 12:25:40 -04:00
Code Issues 7 Packages Projects Releases Wiki Activity

[PR #18] [MERGED] a11y: resolve testimonial keyboard trap and implement skip logic #22

New Issue
Closed
opened 2026-02-15 17:17:16 -05:00 by yindo · 0 comments
yindo commented 2026-02-15 17:17:16 -05:00
Owner
Copy Link
Copy Source

📋 Pull Request Information

Original PR: https://github.com/openclaw/openclaw.ai/pull/18
Author: @wilfriedladenhauf
Created: 1/27/2026
Status: ✅ Merged
Merged: 1/27/2026
Merged by: @thewilloftheshadow

Base: main ← Head: a11y/fix-testimonial-keyboard-trap-a11y-utility-classes

📝 Commits (3)

  • 8593776 a11y: resolve testimonial keyboard trap and implement skip logic
  • dfe4232 fix: keep testimonials clickable
  • 11d2d8f fix: keep testimonials clickable (#18) (thanks @wilfriedladenhauf)

📊 Changes

2 files changed (+44 additions, -2 deletions)

View changed files

📝 CHANGELOG.md (+4 -0)
📝 src/pages/index.astro (+40 -2)

📄 Description

🛠️ Accessibility Improvements: Resolving the "Keyboard Toll"

📋 Overview
This PR addresses a significant accessibility (a11y) issue in the Testimonials section. Previously, keyboard and screen-reader users were forced to tab through 50+ individual testimonial links before reaching the "Quick Start" section.

🚀 Key Changes

  1. Implemented inert on Testimonial Track
    Added the inert attribute to the .testimonials-track.

Benefit: This completely removes the scrolling marquee from the focus order. Keyboard users now skip the "toll" and move directly to installation instructions.

  1. Enhanced "View all" Context
    Updated the /shoutouts link to include a visually hidden descriptive label.

  2. Added A11y Utility Classes
    Introduced a standard .sr-only class to the stylesheet.

  3. System-Level Motion Support
    Added a prefers-reduced-motion media query.

Benefit: Respects users with vestibular/motion sensitivities by instantly disabling starfield, nebula, and marquee animations based on their OS settings.

  1. Improved Focus States
    Implemented custom :focus-visible logic using the project's --cyan-bright variable.

more contrast / higher visibiliy on focus style:

image
  • Added .sr-only utility for screen-reader-only context
  • Implemented inert on .testimonials-track to prevent redundant keyboard tabbing
  • Enhanced "View all" link with descriptive hidden text for better navigation context
  • Added focus-visible styles to provide clear visual indicators for keyboard users
  • Added prefers-reduced-motion media query to respect system-level motion preferences

🔄 This issue represents a GitHub Pull Request. It cannot be merged through Gitea due to API limitations.

## 📋 Pull Request Information **Original PR:** https://github.com/openclaw/openclaw.ai/pull/18 **Author:** [@wilfriedladenhauf](https://github.com/wilfriedladenhauf) **Created:** 1/27/2026 **Status:** ✅ Merged **Merged:** 1/27/2026 **Merged by:** [@thewilloftheshadow](https://github.com/thewilloftheshadow) **Base:** `main` ← **Head:** `a11y/fix-testimonial-keyboard-trap-a11y-utility-classes` --- ### 📝 Commits (3) - [`8593776`](https://github.com/openclaw/openclaw.ai/commit/859377634c2496f72d79a64995dbd24bf78b69a8) a11y: resolve testimonial keyboard trap and implement skip logic - [`dfe4232`](https://github.com/openclaw/openclaw.ai/commit/dfe423227066b7ac5fafbbf6a7214ebde203f95c) fix: keep testimonials clickable - [`11d2d8f`](https://github.com/openclaw/openclaw.ai/commit/11d2d8ffad48092a9f030442806299cffde276a9) fix: keep testimonials clickable (#18) (thanks @wilfriedladenhauf) ### 📊 Changes **2 files changed** (+44 additions, -2 deletions) <details> <summary>View changed files</summary> 📝 `CHANGELOG.md` (+4 -0) 📝 `src/pages/index.astro` (+40 -2) </details> ### 📄 Description 🛠️ Accessibility Improvements: Resolving the "Keyboard Toll" 📋 Overview This PR addresses a significant accessibility (a11y) issue in the Testimonials section. Previously, keyboard and screen-reader users were forced to tab through 50+ individual testimonial links before reaching the "Quick Start" section. 🚀 Key Changes 1. Implemented inert on Testimonial Track Added the inert attribute to the .testimonials-track. Benefit: This completely removes the scrolling marquee from the focus order. Keyboard users now skip the "toll" and move directly to installation instructions. 2. Enhanced "View all" Context Updated the /shoutouts link to include a visually hidden descriptive label. 3. Added A11y Utility Classes Introduced a standard .sr-only class to the stylesheet. 4. System-Level Motion Support Added a prefers-reduced-motion media query. Benefit: Respects users with vestibular/motion sensitivities by instantly disabling starfield, nebula, and marquee animations based on their OS settings. 5. Improved Focus States Implemented custom :focus-visible logic using the project's --cyan-bright variable. --- more contrast / higher visibiliy on focus style: <img width="914" height="292" alt="image" src="https://github.com/user-attachments/assets/c290c2ee-66a6-44db-be86-1483ba345342" /> --- - Added `.sr-only` utility for screen-reader-only context - Implemented `inert` on `.testimonials-track` to prevent redundant keyboard tabbing - Enhanced "View all" link with descriptive hidden text for better navigation context - Added `focus-visible` styles to provide clear visual indicators for keyboard users - Added `prefers-reduced-motion` media query to respect system-level motion preferences --- <sub>🔄 This issue represents a GitHub Pull Request. It cannot be merged through Gitea due to API limitations.</sub>
yindo added the pull-request label 2026-02-15 17:17:16 -05:00
yindo closed this issue 2026-02-15 17:17:16 -05:00
Sign in to join this conversation.
No Branch/Tag Specified
Branches Tags
Labels
Clear labels
pull-request
Mirrored from GitHub Pull Request
No Label pull-request
Milestone
No items
No Milestone
Projects
Clear projects
No project
Assignees
Clear assignees
yindo
No Assignees
1 Participants
Notifications
Due Date
No due date set.
Dependencies

No dependencies set.

Reference: openclaw/openclaw.ai#22
Delete Branch "%!s()"

Deleting a branch is permanent. Although the deleted branch may continue to exist for a short time before it actually gets removed, it CANNOT be undone in most cases. Continue?