refactor(ui): link event-log disclosure with aria-controls
Add aria-controls to the right-rail event-log collapse toggle pointing at the log region, and title-case the settings label for consistency.
This commit is contained in:
@@ -31,6 +31,7 @@ export function RightRail() {
|
||||
<button
|
||||
type="button"
|
||||
aria-expanded={logOpen}
|
||||
aria-controls="right-rail-event-log"
|
||||
onClick={() => setLogOpen((prev) => !prev)}
|
||||
className="mb-3 flex w-full items-center justify-between font-semibold text-slate-400 text-xs tracking-wider uppercase hover:text-slate-300"
|
||||
>
|
||||
@@ -39,7 +40,7 @@ export function RightRail() {
|
||||
{logOpen ? '▾' : '▸'}
|
||||
</span>
|
||||
</button>
|
||||
{logOpen && <EventLog />}
|
||||
<div id="right-rail-event-log">{logOpen && <EventLog />}</div>
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
|
||||
@@ -84,7 +84,7 @@ export function SettingsPanel() {
|
||||
<div className="flex flex-col gap-2 rounded-xl border border-slate-800 bg-slate-900/40 p-5">
|
||||
<label className="flex cursor-pointer items-center justify-between gap-4">
|
||||
<div className="flex flex-col">
|
||||
<span className="font-semibold text-slate-200 text-sm">Show event log</span>
|
||||
<span className="font-semibold text-slate-200 text-sm">Show Event Log</span>
|
||||
<span className="text-slate-400 text-xs">
|
||||
Display the scrollable event log in the right rail and on mobile.
|
||||
</span>
|
||||
|
||||
Reference in New Issue
Block a user