From 539e494963f2d87013de98ba01258ea08b30bb1d Mon Sep 17 00:00:00 2001 From: Josh <49500097+JoshDFN@users.noreply.github.com> Date: Fri, 27 Feb 2026 02:32:24 -0800 Subject: [PATCH] Fix accessibility: contrast ratios and link labels Bump --text-ghost, --text-faint, --text-phantom to meet WCAG AA 4.5:1 contrast ratio. Add aria-label to GitHub icon links in footers and skill cards. --- src/components/BrowseTab.tsx | 2 +- src/layouts/SiteLayout.astro | 4 ++-- src/pages/skills/[slug]/index.astro | 4 ++-- src/styles/global.css | 6 +++--- 4 files changed, 8 insertions(+), 8 deletions(-) diff --git a/src/components/BrowseTab.tsx b/src/components/BrowseTab.tsx index 369f0c6..ce90f51 100644 --- a/src/components/BrowseTab.tsx +++ b/src/components/BrowseTab.tsx @@ -177,7 +177,7 @@ export default function BrowseTab({ skills }: Props) { e.stopPropagation()} - title="View on GitHub" + title="View on GitHub" aria-label={`View ${skill.name} on GitHub`} style={{ display: "flex", alignItems: "center", justifyContent: "center", width: "36px", height: "36px", borderRadius: "6px", diff --git a/src/layouts/SiteLayout.astro b/src/layouts/SiteLayout.astro index 19f0a81..1fbd0c7 100644 --- a/src/layouts/SiteLayout.astro +++ b/src/layouts/SiteLayout.astro @@ -78,8 +78,8 @@ const tabs = [ IC Skills — The API for building on the Internet Computer Built for the agent era - - + + diff --git a/src/pages/skills/[slug]/index.astro b/src/pages/skills/[slug]/index.astro index e43c9f7..e5aefb6 100644 --- a/src/pages/skills/[slug]/index.astro +++ b/src/pages/skills/[slug]/index.astro @@ -82,8 +82,8 @@ const jsonLd = JSON.stringify({ Built for the agent era - - + + diff --git a/src/styles/global.css b/src/styles/global.css index 2304338..76b63bd 100644 --- a/src/styles/global.css +++ b/src/styles/global.css @@ -27,9 +27,9 @@ --text-secondary: #ccc; --text-tertiary: #999; --text-muted: #777; - --text-faint: #6e6e6e; - --text-ghost: #5e5e5e; - --text-phantom: #444; + --text-faint: #7a7a7a; + --text-ghost: #717171; + --text-phantom: #5a5a5a; --text-sub: #ddd; --text-dim: #888; --text-soft: #aaa;