Add aria-label to playground tabs
ghstack-source-id: 1c23bbbb55c1582a03674897b57c5061b895be83 Pull Request resolved: https://github.com/facebook/react-forget/pull/2841
Lauren Tan committed
Apr 10, 2024 at 18:17 UTC
200b0f233378f8450fc3078c6200d56cc720f2ea
1 file changed
+4
compiler/apps/playground/components/TabbedWindow.tsx
+4
@@ -70,6 +70,8 @@ function TabbedWindowItem({
70
{isShow ? (
71
<div className="border-r" style={{ minWidth: 550, overflow: "hidden" }}>
72
<h2
73
+ title="Minimize tab"
74
+ aria-label="Minimize tab"
75
onClick={toggleTabs}
76
className="p-4 duration-150 ease-in border-b cursor-pointer border-grey-200 font-medium text-secondary hover:text-link"
77
>
@@ -80,6 +82,8 @@ function TabbedWindowItem({
82
) : (
83
<div className="relative items-center h-full px-1 py-6 align-middle border-r border-grey-200">
84
<button
85
+ title={`Expand compiler tab: ${name}`}
86
+ aria-label={`Expand compiler tab: ${name}`}
87
style={{ transform: "rotate(90deg) translate(-50%)" }}
88
onClick={toggleTabs}
89
className="flex-grow-0 w-5 transition-colors duration-150 ease-in font-medium text-secondary hover:text-link"