Skip to content

[Web] Add descriptions to session join modes menu#24961

Merged
rudream merged 1 commit into
masterfrom
yassine/session-modes-redesign
Apr 26, 2023
Merged

[Web] Add descriptions to session join modes menu#24961
rudream merged 1 commit into
masterfrom
yassine/session-modes-redesign

Conversation

@rudream
Copy link
Copy Markdown
Contributor

@rudream rudream commented Apr 21, 2023

Purpose

This PR closes #21208
Note: The linked issue mentions a tooltip, however we decided that instead of having a tooltip, we would have a short description under each mode that explains it instead.

Adds a short description under each participant mode that briefly describes its abilities. Also, participant modes that you don't have access to are no longer hidden but are now instead greyed out and have a disclaimer.

Notes

This design slightly deviates from the figma mockup in order to keep it more consistent with the rest of our design system (see our popover menus for connecting to Nodes, Desktops or AWS Console Apps).

Demo

image image

image image

image image

Copy link
Copy Markdown
Collaborator

@zmb3 zmb3 left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Code looks fine, but the disabled state could use a little more contrast IMO.

I'm not an expert here though. If @roraback is good with it, then 🚢

Comment thread web/packages/teleport/src/Sessions/SessionList/SessionJoinBtn.tsx Outdated
@mcbattirola mcbattirola mentioned this pull request Apr 25, 2023
@rudream rudream force-pushed the yassine/session-modes-redesign branch from b9bafa6 to fd9856f Compare April 26, 2023 19:18
@rudream
Copy link
Copy Markdown
Contributor Author

rudream commented Apr 26, 2023

but the disabled state could use a little more contrast IMO.

@zmb3 After #25119 was merged, the opacity we use for disabled text increased (from 18% to 36%) which now gives that text more contrast.

image image

@roraback
Copy link
Copy Markdown
Contributor

Code looks fine, but the disabled state could use a little more contrast IMO.

I'm not an expert here though. If @roraback is good with it, then 🚢

Technically it's a bit below contrast ratios recommended by WCAG AA standard, but text for disabled options often is. I'm good with it as is.

@rudream rudream force-pushed the yassine/session-modes-redesign branch from fd9856f to 4c26c6f Compare April 26, 2023 20:03
@rudream rudream enabled auto-merge April 26, 2023 20:03
@rudream rudream added this pull request to the merge queue Apr 26, 2023
Merged via the queue into master with commit 4a2b422 Apr 26, 2023
@rudream rudream deleted the yassine/session-modes-redesign branch April 26, 2023 20:26
@public-teleport-github-review-bot
Copy link
Copy Markdown

@rudream See the table below for backport results.

Branch Result
branch/v13 Failed

@public-teleport-github-review-bot
Copy link
Copy Markdown

@rudream See the table below for backport results.

Branch Result
branch/v13 Failed

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Projects

None yet

Development

Successfully merging this pull request may close these issues.

[Web] Add tooltip to explain the different Moderated Session join modes

5 participants