Skip to content

Commit 859681f

Browse files
committed
refactor(dashboard): add role and aria-labels to ActivityLandscape chart for screen reader support
1 parent c449e64 commit 859681f

1 file changed

Lines changed: 10 additions & 2 deletions

File tree

components/dashboard/ActivityLandscape.tsx

Lines changed: 10 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -58,13 +58,21 @@ export default function ActivityLandscape({ data }: { data: ActivityData[] }) {
5858
</div>
5959

6060
{/* Graph */}
61-
<div className="h-[200px] w-full flex items-end justify-between gap-[2px] relative">
61+
<div
62+
className="h-[200px] w-full flex items-end justify-between gap-[2px] relative"
63+
role="img"
64+
aria-label="Activity chart showing commit frequency over time"
65+
>
6266
{displayData.map((day, i) => {
6367
const heightPercent = Math.max((day.count / maxCount) * 100, 3);
6468
const isHigh = day.intensity >= 3;
6569

6670
return (
67-
<div key={i} className="relative flex-1 flex items-end group/bar h-full">
71+
<div
72+
key={i}
73+
className="relative flex-1 flex items-end group/bar h-full"
74+
aria-label={`${day.date}: ${day.count} commits`}
75+
>
6876
{/* Tooltip */}
6977
<div className="absolute -top-11 left-1/2 -translate-x-1/2 bg-[#111] border border-[rgba(255,255,255,0.1)] px-2.5 py-1.5 rounded-md opacity-0 group-hover/bar:opacity-100 transition-opacity duration-150 pointer-events-none z-20 flex flex-col items-center whitespace-nowrap shadow-xl">
7078
<span className="text-[10px] text-[#A1A1AA]">{day.date}</span>

0 commit comments

Comments
 (0)