Skip to content

Conversation

Copy link
Contributor

Copilot AI commented Dec 12, 2025

The "Learn more in our docs" link relied solely on color to indicate interactivity, violating WCAG 2.1 Level A (SC 1.4.1). Colorblind users couldn't distinguish it from normal text.

Changes

  • Added text-decoration: underline to .learnMoreColor class in website/src/components/gallery/ShowcaseTemplateSearch/styles.module.css
  • Applied to both light and dark theme variants
.learnMoreColor {
  color: #7160e8 !important;
  text-decoration: underline !important;
}

[data-theme="dark"] .learnMoreColor {
  color: #5649b0 !important;
  text-decoration: underline !important;
}

Screenshots

Before:
Before - no underline on link

After (Light Mode):
After - underlined link in light mode

After (Dark Mode):
After - underlined link in dark mode

cc @kristenwomack @haileyhuber8

Original prompt

This section details on the original issue you should resolve

<issue_title>No Underline or chevron is provided for the "Learn more in our Docs" link to differentiate it from normal text: A11y_Awesome AZD_Template Library_ Usability</issue_title>
<issue_description>GIT Hub Tags:
#A11yTCS; #A11ySev4; #Azure Developer CLI; #DesktopWeb; #A11yUsable; #P3_Awesome-AZD_Nov2024; #FTP; #Chromium Edge; #Win11; #CELA_P3; #WCP;

Environment and OS details:
Application name: Awesome AZD
URL: https://azure.github.io/awesome-azd/
Chromium Edge version: Version 130.0.2849.52 (Official build) (64-bit)

Repro Steps:
Launch the url https://azure.github.io/awesome-azd/ screen will get open.
Tab till "Learn More in our Docs" link.
Observe that Underline or chevron is provided for the "Learn more in our Docs" link to differentiate it from normal text or not.

Actual behavior:
No Underline or chevron is provided for the "Learn more in our Docs" link to differentiate it from normal text

Expected behavior:
Underline or chevron should be provided for the "Learn more in our Docs" link to differentiate it from normal text.

User Impact:
Color blind yours will face difficulty in differentiating the links from normal text if no underline or chevron provided for the links.

Attachment:

Image

<agent_instructions>Once you have finished these changes, please tag kristenwomack and haileyhuber8 to review.</agent_instructions>

Comments on the Issue (you are @copilot in this section)


💬 We'd love your input! Share your thoughts on Copilot coding agent in our 2 minute survey.

Co-authored-by: kristenwomack <5034778+kristenwomack@users.noreply.github.com>
Copilot AI changed the title [WIP] Fix missing underline and chevron for learn more link Add underline to "Learn more in our docs" link for accessibility Dec 12, 2025
Copilot AI requested a review from kristenwomack December 12, 2025 14:41
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

2 participants