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

Announce accessibility settings #18460

Merged
merged 9 commits into from May 7, 2024
Merged

Conversation

tidy-dev
Copy link
Contributor

@tidy-dev tidy-dev commented Apr 15, 2024

xref: https://github.com/github/desktop/issues/821

Description

This PR adds a banner to announce the new accessibility settings. It's purpose is to inform users of the settings especially those users who would find them more of a hinderance than a help and would desire to turn them off.

Screenshots

Showing banner that says, Check out the new accessibility settings to control the visibility of the link underlines and diff check marks.

Release notes

Notes: [Improved] Add banner to announce the accessibility settings.

@tidy-dev tidy-dev force-pushed the announce-accessibility-settings branch from 355e251 to 0d39aad Compare April 15, 2024 16:34
@tidy-dev tidy-dev marked this pull request as ready for review April 15, 2024 16:36
Comment on lines +79 to +83
// When zooming, give the banner more space to display.
@media (max-width: 960px) {
height: auto;
padding-top: var(--spacing-half);
padding-bottom: var(--spacing-half);
Copy link
Contributor Author

@tidy-dev tidy-dev Apr 15, 2024

Choose a reason for hiding this comment

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

I noticed that when I first tried to make message which was really long, the banner didn't handle text wrapping very well so I figured that meant zooming didn't wrap. This css just makes it so that when zoomed, there is not a height constraint so the banner will always be tall enough for the text. A concern would be if the banner got so tall it caused content below to be not visible, but this shouldn't happen as with the 30px in non-zoomed mode we are limiting the banner content to a one liner which wraps to three in the worst case.

Before:
Showing silicon machine message being clipped at 200% zoom

After:
Showing silicon machine message taking the space required to show all three lines of text

import { LinkButton } from '../lib/link-button'
import { setBoolean } from '../../lib/local-storage'

export const accessibilityBannerDismissed = 'accessibility-banner-dismissed'
Copy link
Member

Choose a reason for hiding this comment

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

Should we make this accessibilityBannerShown instead and automatically set it once we show it the first time? In other words should we require that the user explicitly dismiss the banner or are we fine with having shown it to them once?

Copy link
Contributor Author

Choose a reason for hiding this comment

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

user explicitly dismiss the banner

My thinking was explicitly dismiss it so that users don't miss it. Because if a user has no changes when they first open Desktop, they may not realize the implication of the settings on their day to day until they get into making some changes.

Other notes.. similar pattern we followed for the announcement about cherry-picking/re-ordering/squashing, the user had to dismiss to not see it again.

app/src/ui/app.tsx Show resolved Hide resolved
@tidy-dev tidy-dev requested a review from niik April 16, 2024 13:44
@tidy-dev tidy-dev added the accessibility Issues related to accessibility improvements label May 1, 2024
@tidy-dev tidy-dev merged commit 4f25c00 into development May 7, 2024
7 checks passed
@tidy-dev tidy-dev deleted the announce-accessibility-settings branch May 7, 2024 10:52
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
accessibility Issues related to accessibility improvements
Projects
None yet
Development

Successfully merging this pull request may close these issues.

None yet

2 participants