A11Y: Fix screen reader access to user directory (#30499)

This commit is contained in:
Penar Musaraj 2024-12-30 16:10:00 -05:00 committed by GitHub
parent 429fc91b2e
commit 2ffcb94c8b
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
4 changed files with 16 additions and 6 deletions

View File

@ -1,17 +1,17 @@
<div class="directory-table__cell">
<div class="directory-table__cell" role="rowheader">
<UserInfo @user={{this.item.user}} />
</div>
{{#each this.columns as |column|}}
{{#if (directory-column-is-user-field column=column)}}
<div class="directory-table__cell--user-field">
<div class="directory-table__cell--user-field" role="cell">
<span class="directory-table__label">
<span>{{column.name}}</span>
</span>
{{directory-item-user-field-value item=this.item column=column}}
</div>
{{else}}
<div class="directory-table__cell">
<div class="directory-table__cell" role="cell">
<span class="directory-table__label">
<span>
{{#if column.icon}}
@ -27,7 +27,7 @@
{{/each}}
{{#if this.showTimeRead}}
<div class="directory-table__cell time-read">
<div class="directory-table__cell time-read" role="cell">
<span class="directory-table__label">
<span>{{i18n "directory.time_read"}}</span>
</span>

View File

@ -1,5 +1,6 @@
import Component from "@ember/component";
import {
attributeBindings,
classNameBindings,
classNames,
tagName,
@ -9,7 +10,10 @@ import { propertyEqual } from "discourse/lib/computed";
@tagName("div")
@classNames("directory-table__row")
@classNameBindings("me")
@attributeBindings("role")
export default class DirectoryItem extends Component {
role = "row";
@propertyEqual("item.user.id", "currentUser.id") me;
columns = null;
}

View File

@ -13,7 +13,11 @@
<div class="user-detail">
<div class="name-line">
{{#if this.includeLink}}
<a href={{this.userPath}} data-user-card={{@user.username}}>
<a
href={{this.userPath}}
data-user-card={{@user.username}}
role="heading"
>
<span class={{if this.nameFirst "name" "username"}}>
{{if this.nameFirst @user.name (format-username @user.username)}}
</span>

View File

@ -123,7 +123,9 @@
&__header,
&__body,
&__row {
display: contents; // we'll be able to remove this with subgrid support
display: grid;
grid-column: 1 / -1;
grid-template-columns: subgrid;
}
&__column-header,