WordPress.org

Make WordPress Core

Opened 11 months ago

Closed 6 months ago

#44699 closed defect (bug) (fixed)

Twenty Seventeen: Comment form cookies consent checkbox has no focus style

Reported by: afercia Owned by: laurelfulford
Milestone: 5.0.2 Priority: normal
Severity: normal Version:
Component: Bundled Theme Keywords: has-screenshots has-patch fixed-5.0
Focuses: accessibility Cc:

Description

In Twenty Seventeen, the new checkbox in the comments form to consent to cookies has no focus style at all. While the other fields use a slightly darker border (see the field "Website|" in the screenshot below), the there's no specific focus style for checkboxes.

The outline is reset to 0 so, at least in Chrome, Safari, and Opera on mac, there's no indication of focus on the checkbox. Firefox applies some native style.

Seems Twenty Sixteen and Fifteen are OK, as they apply some focus style to checkboxes.

Attachments (5)

Twenty 17 Screen Shot 2018-08-02 at 09.03.18.png (41.9 KB) - added by afercia 11 months ago.
#44699.diff (462 bytes) - added by pratikthink 11 months ago.
Twenty-seventeen-firefox-with-patch.png (29.1 KB) - added by laurelfulford 6 months ago.
Twenty Seventeen - Firefox with patch applied
twenty-seventeen-safari-with-patch.png (22.6 KB) - added by laurelfulford 6 months ago.
Twenty Seventeen - Safari with patch applied
twenty-seventeen-opera-with-patch.png (22.9 KB) - added by laurelfulford 6 months ago.
Twenty Seventeen - Opera with patch applied

Download all attachments as: .zip

Change History (20)

@pratikthink
11 months ago

#1 @pratikthink
11 months ago

  • Keywords has-patch added

#2 @audrasjb
9 months ago

  • Keywords ui-feedback added

I tested the patch and it looks ok on my side.

Adding ui-feedback but I think it can probably lands in 4.9.9.

This ticket was mentioned in Slack in #accessibility by afercia. View the logs.


9 months ago

#4 @jameskockelbergh
9 months ago

Well spotted @afercia

#5 @pento
9 months ago

  • Milestone changed from 4.9.9 to 5.0.1

This ticket was mentioned in Slack in #design by karmatosed. View the logs.


7 months ago

#7 @boemedia
7 months ago

  • Keywords ui-feedback removed

As there's a working (and tested) patch and it seems this doesn't need direct design feedback, the design team thinks this one's good to go :)

#8 @laurelfulford
7 months ago

  • Owner set to laurelfulford
  • Status changed from new to reviewing

#9 @pento
6 months ago

  • Milestone changed from 5.0.1 to 5.0.2

@laurelfulford
6 months ago

Twenty Seventeen - Firefox with patch applied

@laurelfulford
6 months ago

Twenty Seventeen - Safari with patch applied

@laurelfulford
6 months ago

Twenty Seventeen - Opera with patch applied

#10 @laurelfulford
6 months ago

  • Status changed from reviewing to accepted

Thanks for the report, @afercia, and for the patch, @pratikthink!

This update looks good to me, as long as the difference is visually sufficient -- I'm not really an expert there :) @afercia do you mind taking a peek at the screenshots I've attached, and confirming? I'd really appreciate your expertise on this!

#11 @afercia
6 months ago

@laurelfulford @pratikthink thanks! Looks good to me, as it replicates the native Firefox focus style.

#12 @laurelfulford
6 months ago

Thanks for confirming, @afercia! Based on that, I think this one is good to go.

#13 @laurelfulford
6 months ago

  • Resolution set to fixed
  • Status changed from accepted to closed

In 44204:

Twenty Seventeen: Add focus style to cookies consent checkbox.

To improve accessibility, the cookies content checkbox in the comment form needed some visible indication when it’s in focus.

Props pratikthink, afercia.
Fixes #44699.

#14 @laurelfulford
6 months ago

  • Keywords fixed-5.0 added
  • Resolution fixed deleted
  • Status changed from closed to reopened

Reopening and marking fixed-5.0 so that this can be properly merged into trunk.

#15 @desrosj
6 months ago

  • Resolution set to fixed
  • Status changed from reopened to closed

In 44307:

Twenty Seventeen: Bug Fixes.

  • Remove unnecessary ol styles from editor. Twenty Seventeen was designed with bolded numbers for its ordered list styles. This was removed from the theme prior to launch, but it was left in the editor styles, so it needed to be removed there, too.
  • To improve accessibility, the cookies content checkbox in the comment form needed some visible indication when it’s in focus.
  • Twenty Seventeen’s editor styles contained an Internet Explorer 8 specific fix that stopped images from being scalable in the editor in other browsers. Since the editor no longer supports IE8, this fix can safely be removed.
  • Fix the font-family used for Simplified Chinese (zh_CN) in the block editor CSS.

Props mmaumio, edpittol, pratikthink, afercia, audrasjb, mihaivalentin, subrataemfluence, vaishalipanchal, ze3kr, laurelfulford.

Merges [44203-44205] and [44235] into trunk.

Fixes #44775, #44699, #39738, #45408.

Note: See TracTickets for help on using tickets.