Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[MA-16]: MM-61578:Ensure all interactive functionality is operable with the keyboard #18

Open
wants to merge 1 commit into
base: master
Choose a base branch
from
Open
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
Original file line number Diff line number Diff line change
Expand Up @@ -157,13 +157,14 @@ exports[`components/AddGroupsToChannelModal should match when renderOption is ca
<div
className="more-modal__actions"
>
<div
<button
aria-label="Add groups to channel"
className="more-modal__actions--round"
>
<i
className="icon icon-plus"
/>
</div>
</button>
</div>
</div>
`;
Expand Down Expand Up @@ -206,13 +207,14 @@ exports[`components/AddGroupsToChannelModal should match when renderOption is ca
<div
className="more-modal__actions"
>
<div
<button
aria-label="Add groups to channel"
className="more-modal__actions--round"
>
<i
className="icon icon-plus"
/>
</div>
</button>
</div>
</div>
`;
Expand Down Expand Up @@ -255,13 +257,14 @@ exports[`components/AddGroupsToChannelModal should match when renderOption is ca
<div
className="more-modal__actions"
>
<div
<button
aria-label="Add groups to channel"
className="more-modal__actions--round"
>
<i
className="icon icon-plus"
/>
</div>
</button>
</div>
</div>
`;
Original file line number Diff line number Diff line change
Expand Up @@ -216,9 +216,12 @@ export class AddGroupsToChannelModal extends React.PureComponent<Props, State> {
</div>
</div>
<div className='more-modal__actions'>
<div className='more-modal__actions--round'>
<button
className='more-modal__actions--round'
aria-label='Add groups to channel'
>
<i className='icon icon-plus'/>
</div>
</button>
</div>
</div>
);
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -196,13 +196,14 @@ exports[`components/AddGroupsToTeamModal should match when renderOption is calle
<div
className="more-modal__actions"
>
<div
<button
aria-label="Add groups to team"
className="more-modal__actions--round"
>
<i
className="icon icon-plus"
/>
</div>
</button>
</div>
</div>
`;
Expand Down Expand Up @@ -247,13 +248,14 @@ exports[`components/AddGroupsToTeamModal should match when renderOption is calle
<div
className="more-modal__actions"
>
<div
<button
aria-label="Add groups to team"
className="more-modal__actions--round"
>
<i
className="icon icon-plus"
/>
</div>
</button>
</div>
</div>
`;
Original file line number Diff line number Diff line change
Expand Up @@ -223,9 +223,12 @@ export class AddGroupsToTeamModal extends React.PureComponent<Props, State> {
</div>
</div>
<div className='more-modal__actions'>
<div className='more-modal__actions--round'>
<button
className='more-modal__actions--round'
aria-label='Add groups to team'
>
<i className='icon icon-plus'/>
</div>
</button>
</div>
</div>
);
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -56,11 +56,14 @@ const MultiSelectOption = React.forwardRef(({
</div>
</div>
<div className='more-modal__actions'>
<div className='more-modal__actions--round'>
<button
className='more-modal__actions--round'
aria-label={`Select Option ${option.label}`}
>
<i
className='icon icon-plus'
/>
</div>
</button>
</div>
</div>
);
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -135,11 +135,14 @@ export class AddUsersToTeamModal extends React.PureComponent<Props, State> {
</div>
</div>
<div className='more-modal__actions'>
<div className='more-modal__actions--round'>
<button
className='more-modal__actions--round'
aria-label='Add users to team'
>
<i
className='icon icon-plus'
/>
</div>
</button>
</div>
</div>
);
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -137,11 +137,14 @@ export class AddUsersToRoleModal extends React.PureComponent<Props, State> {
</div>
</div>
<div className='more-modal__actions'>
<div className='more-modal__actions--round'>
<button
className='more-modal__actions--round'
aria-label='Add users to role'
>
<i
className='icon icon-plus'
/>
</div>
</button>
</div>
</div>
);
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -408,13 +408,9 @@ export class ChannelInviteModal extends React.PureComponent<Props, State> {
{displayName}
{option.is_bot && <BotTag/>}
{isGuest(option.roles) && <GuestTag className='popoverlist'/>}
{displayName === option.username ?
null :
<UsernameSpan
className='ml-2 light'
>
{'@'}{option.username}
</UsernameSpan>
{displayName === option.username ? null : <UsernameSpan className='ml-2 light'>
{'@'}{option.username}
</UsernameSpan>
}
<UserMappingSpan
className='light'
Expand All @@ -425,11 +421,14 @@ export class ChannelInviteModal extends React.PureComponent<Props, State> {
</div>
</div>
<div className='more-modal__actions'>
<div className='more-modal__actions--round'>
<button
className='more-modal__actions--round'
aria-label='Add channel to invite'
>
<i
className='icon icon-plus'
/>
</div>
</button>
</div>
</div>
);
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -186,9 +186,12 @@ export class ChannelSelectorModal extends React.PureComponent<Props, State> {
</div>
</div>
<div className='more-modal__actions'>
<div className='more-modal__actions--round'>
<button
className='more-modal__actions--round'
aria-label='Select channel'
>
<i className='icon icon-plus'/>
</div>
</button>
</div>
</div>
);
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -33,13 +33,14 @@ exports[`ListItem should match snapshot when rendering GroupChannel 1`] = `
<div
className="more-modal__actions"
>
<div
<button
aria-label="Add option undefined"
className="more-modal__actions--round"
>
<i
className="icon icon-plus"
/>
</div>
</button>
</div>
</div>
`;
Expand All @@ -62,13 +63,14 @@ exports[`ListItem should match snapshot when rendering user 1`] = `
<div
className="more-modal__actions"
>
<div
<button
aria-label="Add option undefined"
className="more-modal__actions--round"
>
<i
className="icon icon-plus"
/>
</div>
</button>
</div>
</div>
`;
Original file line number Diff line number Diff line change
Expand Up @@ -75,9 +75,12 @@ const ListItem = React.forwardRef((props: Props, ref?: React.Ref<HTMLDivElement>
}

<div className='more-modal__actions'>
<div className='more-modal__actions--round'>
<button
className='more-modal__actions--round'
aria-label={`Add option ${option.label}`}
>
<i className='icon icon-plus'/>
</div>
</button>
</div>
</div>
);
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -190,9 +190,12 @@ export class TeamSelectorModal extends React.PureComponent<Props, State> {
</div>
</div>
<div className='more-modal__actions'>
<div className='more-modal__actions--round'>
<button
className='more-modal__actions--round'
aria-label={`Select team ${option.label}`}
>
<i className='fa fa-plus'/>
</div>
</button>
</div>
</div>
);
Expand Down
5 changes: 3 additions & 2 deletions webapp/channels/src/sass/components/_modal.scss
Original file line number Diff line number Diff line change
Expand Up @@ -933,9 +933,10 @@
display: none;
width: 32px;
height: 32px;
line-height: 32px;
padding: 0;
border: none;
opacity: 0.75;
text-align: center;
text-align: center
}

.more-modal__right {
Expand Down
Loading