WordPress.org
Get WordPress

Make WordPress Core

Opened 9 years ago

Closed 8 years ago

Last modified 7 years ago

#38674 closed enhancement (fixed)

Semantic elements for non-link links: update-core.php (show/hide hidden updates)

Reported by: cheffheid's profile Cheffheid Owned by: afercia's profile afercia
Milestone: 5.1 Priority: normal
Severity: normal Version:
Component: Administration Keywords: semantic-buttons has-patch has-screenshots commit
Focuses: ui, accessibility, javascript Cc:

Description

This toggle is a link with simply href="#". Should be a button.

Related: #26504, #35126

Attachments (3)

38674.patch​ (608 bytes) - added by Cheffheid 9 years ago.
markup update, no style changes
38674.1.patch​ (1.6 KB) - added by Cheffheid 9 years ago.
Markup update, full styles update
38674.diff​ (1.8 KB) - added by afercia 8 years ago.

Download all attachments as: .zip

Change History (14)

#1 @Cheffheid
9 years ago

Much like #38671, I'll make two patches. One that relies on .button-link and one that's its own entity with styles included.

@Cheffheid
9 years ago

markup update, no style changes

@Cheffheid
9 years ago

Markup update, full styles update

This ticket was mentioned in ​Slack in #accessibility by afercia. ​View the logs.
9 years ago

#3 @afercia
9 years ago

  • Milestone changed from Awaiting Review to Future Release
  • Version trunk deleted

#4 @afercia
9 years ago

  • Keywords semantic-buttons added

This ticket was mentioned in ​Slack in #accessibility by audrasjb. ​View the logs.
8 years ago

#6 @afercia
8 years ago

  • Keywords has-patch added
  • Milestone changed from Future Release to 5.0

#7 @audrasjb
8 years ago

Hi,
Tested on 4.9.4.
The patch looks good to me.

Cheers,
Jb

#8 @afercia
8 years ago

  • Keywords has-screenshots added

For reference, this link-that-should-be-a-button appears only when the site language is other than en-US and there is a core update. At that point, users have the ability to hide updates:

https://cldup.com/zQ-FISuJEC.png

Once updates are hidden, a link to toggle the hidden updates visibility appears: this link should be a button:

https://cldup.com/YCEYr47cXe.png

https://cldup.com/s5j8Z-BKZS.png

@afercia
8 years ago

#9 @afercia
8 years ago

  • Keywords commit added
  • Owner set to afercia
  • Status changed from new to assigned

Looking back at this, I think the link should be a button and also look like a button. There's no reason why it should look like a link, as it just toggles the visibility of the hidden updates container.

38674.diff​ also adds an aria-expanded attribute, improves the distance between the buttons, and fixes the toggle animation "jump" due to the top margin on the animated div.

Some testing would be nice.

Screenshot:

https://cldup.com/Et-WD-fqb4.png

#10 @afercia
8 years ago

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

In 42785:

Accessibility: Change the "Show / Hide dismissed updates" link to a button.

For better accessibility and semantics, user interface controls that perform an
action should be buttons. Links should exclusively be used for navigation.
Also, adds an aria-expanded attribute to communicate the expandable panel state
and improves the buttons spacing.

Props Cheffheid, audrasjb, afercia.
Fixes #38674.

#11 @pento
7 years ago

  • Milestone changed from 5.0 to 5.1
Note: See TracTickets for help on using tickets.