Links used as UI controls that behave like buttons, should be buttons.
- changes the widgets "toggle", "Delete", and "Close" links to buttons
- uses `aria-expanded` to announce the state of the toggle buttons
- increases a bit the clickable area of the toggle
- ensures the "circular focus" doesn't get cut-off in some browsers by centering the toggle arrows
- uses a `<span>` element with an `aria-hidden` attribute to hide CSS generated font icons from assistive technologies
- standardizes on `.toggle-indicator:before` rather than `:after`
- changes two `#f00` reds in `#dc3232`, see #35622Fixes#31476.
Built from https://develop.svn.wordpress.org/trunk@40480
git-svn-id: http://core.svn.wordpress.org/trunk@40356 1a063a9b-81f0-0310-95a4-ce76da25c4cd
The Toolbar search field, when the Toolbar is displayed on the frontend, might
inherit CSS properties from the active Theme stylesheet. For example, this
happened with Twenty Seventeen that sets `display: block;` on all the input
fields. Thus, there's the need to reset some CSS properties to avoid inheritance.
Props @sagarprajapati.
Fixes#40313.
Built from https://develop.svn.wordpress.org/trunk@40418
git-svn-id: http://core.svn.wordpress.org/trunk@40316 1a063a9b-81f0-0310-95a4-ce76da25c4cd
For better accessibility, expandable panels should be placed immediately after
the control that expands them. This change moves the Media Library inline
uploader up, right after the "Add New" button, also introducing consistency with
the Plugin and Theme uploaders.
Adds a proper ARIA role on the button and an `aria-expanded` attribute to give
better feedback to assistive technologies users about the uploader's expanded state.
Improves the focus handling when closing the uploader, improves the focus style
and color contrast ratio of the uploader "close" button.
Props mantismamita, karmatosed, adamsilverstein, afercia.
Fixes#37188.
Built from https://develop.svn.wordpress.org/trunk@40359
git-svn-id: http://core.svn.wordpress.org/trunk@40266 1a063a9b-81f0-0310-95a4-ce76da25c4cd
After [40059] the CSS class `button-link` uses `text-align: left` by default.
This change now requires to limit as much as possible the use of `button-link`
to controls that should really look like links and to explicitly set
`text-align: center` in a few other cases.
Fixes#39983.
Built from https://develop.svn.wordpress.org/trunk@40358
git-svn-id: http://core.svn.wordpress.org/trunk@40265 1a063a9b-81f0-0310-95a4-ce76da25c4cd
Updates `.button-link` adding color and underline to make link-like buttons look
like links by default. Introduces `.button-link-delete` as a modifier, stackable
CSS class for red button-links.
Props Cheffheid, afercia.
See #34242.
Fixes#35126.
Built from https://develop.svn.wordpress.org/trunk@40052
git-svn-id: http://core.svn.wordpress.org/trunk@39989 1a063a9b-81f0-0310-95a4-ce76da25c4cd
When sections of the media modal are hidden out of view, their controls may be
still focusable and actionable. This completely hides these sections to avoid
unnecessary tab stops and potential confusion for assistive technology users.
Props SergeyBiryukov, afercia.
Fixes#30599.
Built from https://develop.svn.wordpress.org/trunk@39529
git-svn-id: http://core.svn.wordpress.org/trunk@39469 1a063a9b-81f0-0310-95a4-ce76da25c4cd
* Use `postMessage` transport for header image settings by default when video headers are supported, and thus `the_custom_header_markup()` will necessarily be used (and thus a selective refresh partial will be available).
* Ensure that `the_custom_header_markup()` always outputs a container element in the customizer preview even if the header is empty.
* Ensure that edit shortcut appearing for custom header does not get positioned off-screen.
Props bradyvercher, westonruter.
See #38639.
Fixes#38737.
Built from https://develop.svn.wordpress.org/trunk@39227
git-svn-id: http://core.svn.wordpress.org/trunk@39167 1a063a9b-81f0-0310-95a4-ce76da25c4cd
Removes the `.customize-partial-edit-shortcut-left-margin` class which was not effective on some themes, created a worse experience for other themes, and which did not recalculate when the preview was reflowed or resized. Now some small-width media queries are added to handle common cases while more dramatic issues can be handled by the theme. Also renames `Partial.positionEditShortcut()`to `Partial.addEditShortcutToPlacement()` which is a more accurate description of its function.
Props sirbrillig, sstoqnov.
See #38651, #27403.
Built from https://develop.svn.wordpress.org/trunk@39202
git-svn-id: http://core.svn.wordpress.org/trunk@39142 1a063a9b-81f0-0310-95a4-ce76da25c4cd
Currently, the "Collapse menu" item is not focusable and keyboard users can't collapse/expand the admin menu. This aims to fix it so that screen readers no longer announce it as a clickable but it remains unfocusable and thus unusable. So it's now a button.
Quoting joedolson at WordCamp Chicago 2014:
"If it's supposed to act like a button, it should be a button."
Also includes a grunt:precommit run that picked up some postcss changes to src/wp-includes/css/customize-preview.css
Fixes#29958.
Props ajercia, ipm-frommen for an iterative patch, valendesigns for an iterative patch, GaryJ for feedback, joedolson for feedback, helen for feedback
Built from https://develop.svn.wordpress.org/trunk@39141
git-svn-id: http://core.svn.wordpress.org/trunk@39081 1a063a9b-81f0-0310-95a4-ce76da25c4cd
CSS generated content is going to be rendered for speech output more and more in
the next future. When it's not intended to be available for speech output, for
example with font icons, then special care should be used to hide it from
assistive technologies. At the moment, the only reliable way to do this is making
use of a wrapper element and set `aria-hidden="true"` on it.
Fixes#37513.
Built from https://develop.svn.wordpress.org/trunk@38984
git-svn-id: http://core.svn.wordpress.org/trunk@38927 1a063a9b-81f0-0310-95a4-ce76da25c4cd
* Edit shortcuts show initially for a moment and then fade away so as to not get in the way of the preview.
* Visibility of edit shortcuts is toggled by clicking/touching anywhere inert in the document.
* Implements UI for mobile and touch devices which do not support shift-click.
* Adds `editShortcutVisibility` state.
* Adds new methods to `wp.customize.selectiveRefresh.Partial` for managing edit shortcuts.
Incorporates aspects of the Customize Direct Manipulation feature plugin.
Props sirbrillig, mattwiebe, celloexpressions, melchoyce, westonruter, afercia.
Fixes#27403.
Built from https://develop.svn.wordpress.org/trunk@38967
git-svn-id: http://core.svn.wordpress.org/trunk@38910 1a063a9b-81f0-0310-95a4-ce76da25c4cd
When Open Sans was in use, the `300`, `400`, and `600` weights were loaded. `400` is the equivalent of `normal`; however, `bold` is equivalent to `700`, not `600`. With the move to system fonts, we need to be specific rather than relying on the lack of a `700` weight. Not all system fonts include a `600` weight; in those instances, they will use the `bold`/`700` weight.
The WordPress CSS Coding Standards have been updated accordingly.
props coderste.
see #36753.
Built from https://develop.svn.wordpress.org/trunk@37740
git-svn-id: http://core.svn.wordpress.org/trunk@37705 1a063a9b-81f0-0310-95a4-ce76da25c4cd
Also use 'back-compat' in some inline comments where backward compatibility is the subject and shorthand feels more natural.
Note: 'backwards compatibility/compatibile' can also be considered correct, though it's primary seen in regular use in British English.
Props ocean90.
Fixes#36835.
Built from https://develop.svn.wordpress.org/trunk@37431
git-svn-id: http://core.svn.wordpress.org/trunk@37397 1a063a9b-81f0-0310-95a4-ce76da25c4cd
Rejoice, for your admins will feel more native to your surrounding computing environment and likely load faster, especially when offline, as they no longer have to talk to The Google Overlord.
At the time of introduction in 3.8, there were not good system fonts common to all platforms at the time. In the years since, Windows, Android, OS X, iOS, Firefox OS, and various flavors of Linux have all gotten their own (good) system UI fonts.
There will definitely be visual bugs, mainly around alignment and spacing; these should be documented and reported on the ticket and fixed more atomically so that our current and future selves have a better understanding of what happened and why.
The style remains registered, as it is almost certainly in use by themes and plugins.
props mattmiklic.
see #36753.
Built from https://develop.svn.wordpress.org/trunk@37361
git-svn-id: http://core.svn.wordpress.org/trunk@37327 1a063a9b-81f0-0310-95a4-ce76da25c4cd
