The current focus state for Olivero's search form is a "growing underline" effect (we have an outline in high contrast mode).

This is different than the theme's other form focus state. Is this okay? If not, what can we do to make it beautiful.

This is split off of #3153260: Standardize Olivero's focus states across all non-form controls

CommentFileSizeAuthor
Screenshot_1_8_21__8_58_AM.png97.69 KBmherchel

Comments

mherchel created an issue. See original summary.

bnjmnm’s picture

Issue tags: +stable blocker
andrewmacpherson’s picture

Issue tags: -stable blocker

This is different than the theme's other form focus state. Is this okay?

The issue we spun this off from was about bringing consistency to our focus styles. That's a very worthwhile aim, and the current style (underlining on focus) isn't consistent with the 4-sided outline proposed for everything else. So it's not okay, and we should improve this. It would be easy to miss the underline if you were expecting a 4-sided outline. Bear in mind that some users will have animation turned off, and therefore the "growing" underline won't attract attention.

Note that WCAG doesn't actually require consistent focus styles, and this technically passes both SC 2.4.7 Focus Visible and SC 1.4.11 Non-text Contrast. For that reason, this isn't really a stable blocker.

I think it's worth noting that the search box style (black background) is also inconsistent with other text inputs. Perhaps we could expand the scope of this to review the entire search component, in all states? Make it consistent with other form elements, as well as other focus styles.

andrewmacpherson’s picture

Issue summary: View changes
mgifford’s picture

Issue tags: +keyboard focus, +wcag247

tagging

Version: 9.2.x-dev » 9.3.x-dev

Drupal 9.2.0-alpha1 will be released the week of May 3, 2021, which means new developments and disruptive changes should now be targeted for the 9.3.x-dev branch. For more information see the Drupal core minor version schedule and the Allowed changes during the Drupal core release cycle.

mherchel’s picture

Version: 9.3.x-dev » 9.4.x-dev

Drupal 9.3.0-rc1 was released on November 26, 2021, which means new developments and disruptive changes should now be targeted for the 9.4.x-dev branch. For more information see the Drupal core minor version schedule and the Allowed changes during the Drupal core release cycle.

Version: 9.4.x-dev » 9.5.x-dev

Drupal 9.4.0-alpha1 was released on May 6, 2022, which means new developments and disruptive changes should now be targeted for the 9.5.x-dev branch. For more information see the Drupal core minor version schedule and the Allowed changes during the Drupal core release cycle.

Version: 9.5.x-dev » 10.1.x-dev

Drupal 9.5.0-beta2 and Drupal 10.0.0-beta2 were released on September 29, 2022, which means new developments and disruptive changes should now be targeted for the 10.1.x-dev branch. For more information see the Drupal core minor version schedule and the Allowed changes during the Drupal core release cycle.

Version: 10.1.x-dev » 11.x-dev

Drupal core is moving towards using a “main” branch. As an interim step, a new 11.x branch has been opened, as Drupal.org infrastructure cannot currently fully support a branch named main. New developments and disruptive changes should now be targeted for the 11.x branch, which currently accepts only minor-version allowed changes. For more information, see the Drupal core minor version schedule and the Allowed changes during the Drupal core release cycle.

Version: 11.x-dev » main

Drupal core is now using the main branch as the primary development branch. New developments and disruptive changes should now be targeted to the main branch.

Read more in the announcement.