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

Fix tab navigation for InputWithCopy #18009

Merged
merged 3 commits into from
Jun 23, 2023
Merged

Conversation

filiptronicek
Copy link
Member

@filiptronicek filiptronicek commented Jun 21, 2023

Description

Addresses accessibility concerns over the Copy button in the <InputWithCopy> component.

This is how it looks like focused:
image

Related Issue(s)

A part of #16724.

Documentation

Preview status

Gitpod was successfully deployed to your preview environment.

Build Options

Build
  • /werft with-werft
    Run the build with werft instead of GHA
  • leeway-no-cache
  • /werft no-test
    Run Leeway with --dont-test
Publish
  • /werft publish-to-npm
  • /werft publish-to-jb-marketplace
Installer
  • analytics=segment
  • with-dedicated-emulation
  • workspace-feature-flags
    Add desired feature flags to the end of the line above, space separated
Preview Environment
  • /werft with-local-preview
    If enabled this will build install/preview
  • /werft with-preview
  • /werft with-large-vm
  • /werft with-gce-vm
    If enabled this will create the environment on GCE infra
  • with-integration-tests=all
    Valid options are all, workspace, webapp, ide, jetbrains, vscode, ssh

@filiptronicek filiptronicek requested a review from a team June 21, 2023 20:15
@filiptronicek filiptronicek requested a review from gtsiolis as a code owner June 21, 2023 20:15
@github-actions github-actions bot added the team: webapp Issue belongs to the WebApp team label Jun 21, 2023
@filiptronicek filiptronicek self-assigned this Jun 21, 2023
@filiptronicek filiptronicek marked this pull request as draft June 21, 2023 20:16
@roboquat roboquat added size/S and removed size/XS labels Jun 21, 2023
@@ -55,6 +55,11 @@
button {
@apply cursor-pointer px-4 py-2 my-auto bg-green-600 dark:bg-green-700 hover:bg-green-700 dark:hover:bg-green-600 text-gray-100 dark:text-green-100 text-sm font-medium rounded-md focus:outline-none focus:ring transition ease-in-out;
}
button.reset {
Copy link
Member Author

Choose a reason for hiding this comment

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

This class will be useful in scenarios like this where we use buttons purely for semantics and a11y

Copy link
Member

@geropl geropl left a comment

Choose a reason for hiding this comment

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

Code LGTM, thank you @filiptronicek ! 🙏

I could not test in the preview, though, so you/somebody else might want to double check.

@roboquat roboquat merged commit 32e01b8 into main Jun 23, 2023
@roboquat roboquat deleted the ft/fix-focus-inputwithcopy branch June 23, 2023 07:27
@roboquat roboquat added deployed: webapp Meta team change is running in production deployed Change is completely running in production labels Jun 23, 2023
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
aspect: accessibility component: dashboard deployed: webapp Meta team change is running in production deployed Change is completely running in production size/S team: webapp Issue belongs to the WebApp team
Projects
None yet
Development

Successfully merging this pull request may close these issues.

3 participants