For a number of years, the "Available Widgets" section has been off-limits for
keyboard users. Now it can be used also with the keyboard. This change introduces
also some improvements for assistive technologies.
- makes the widget toggles focusable and adds an `aria-expanded` attribute to indicate their state
- improves the toggles labelling to clarify context (add/edit)
- changes the controls to choose a sidebar from list items to buttons
- adds an `aria-label` attribute to the buttons to clarify their purpose
- adds an `aria-pressed` attribute to the buttons to indicate which one is selected
- improves color contrast of the selected button
- uses a `wp.a11y.speak()` message to announce to screen reader users when a widget has been added to a sidebar
- moves focus back to the toggle button when closing a widget
See #40677.
Built from https://develop.svn.wordpress.org/trunk@42794
git-svn-id: http://core.svn.wordpress.org/trunk@42624 1a063a9b-81f0-0310-95a4-ce76da25c4cd
This pattern occurs a handful of times across the codebase:
`<div class="foo<?php if ( $bar ) { echo ' baz'; } ?>">`
Unfortunately, it doesn't really play nicely with `phpcbf`, so all instances need to be removed in preperation for auto code formatting.
See #41057.
Built from https://develop.svn.wordpress.org/trunk@42217
git-svn-id: http://core.svn.wordpress.org/trunk@42046 1a063a9b-81f0-0310-95a4-ce76da25c4cd
- uses button elements for the toggles
- uses `aria-expanded` on the toggles to communicate to assistive technologies the panels expanded/collapsed state
- adds the "circular focus" style to the toggles to give users a clear indication of the currently focused element
- standardizes CSS class names to `.toggle-indicator` and `.handlediv` as these names are already used across the admin for similar controls
Props monikarao, xavortm, mihai2u, Kopepasah.
Fixes#37013.
Built from https://develop.svn.wordpress.org/trunk@41621
git-svn-id: http://core.svn.wordpress.org/trunk@41456 1a063a9b-81f0-0310-95a4-ce76da25c4cd
* Mark a widget as dirty when a field input triggers a `change` or `input` event; clear dirty state when widget is successfully saved.
* Disable Save button and re-label "Saved" when widget not dirty.
* Show AYS dialog when leaving widgets admin screen with unsaved changes.
* When widgets are dirty, expand all unsaved widgets at AYS check and focus on first one.
* Change "Close" link to "Done"; hide link when widget is dirty and reveal when saved.
* The "Done" link persistently appears in the Customizer even after making a change (when the widget is dirty) because changes are autosaved into the changeset.
* Prevent saving widget when form fails `checkValidity`.
* Fix frequency of triggering of `change` event on the rich Text widget's `textarea` limited now to when there are actual changes.
* Add a class of `widget-dirty` to widget containers when the widget has unsaved changes.
Props westonruter, timmydcrawford, melchoyce.
Fixes#41610, #23120.
Built from https://develop.svn.wordpress.org/trunk@41352
git-svn-id: http://core.svn.wordpress.org/trunk@41185 1a063a9b-81f0-0310-95a4-ce76da25c4cd
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
Introduces some consistency in the usage of the button CSS classes, fixes the
focus style for accessibility and responsiveness of the buttons.
- Adds the `button` class to all primary buttons make them responsive
- Removes all `secondary-button` classes and replaces it with button when needed. `button-secondary` shouldn't be used and exists just for backward compatibility reasons
- Replaces classes inside `submit_button()` with a shorthand for some buttons, and use an empty string for the default `button` class. Passing `button` is unnecessary
- Adjusts `get_submit_button()` to remove empty items
Props iseulde, dimchik, chris_d2d, mhowell, afercia.
Fixes#27314, #37138, #37448.
Built from https://develop.svn.wordpress.org/trunk@38672
git-svn-id: http://core.svn.wordpress.org/trunk@38615 1a063a9b-81f0-0310-95a4-ce76da25c4cd
The Menu Customizer feature includes a performance technique whereby the controls for nav menu items are only embedded into the DOM once the containing menu section is expanded. This commit implements the same DOM deferral for widgets but goes a step further than just embedding the controls once the widget area's Customizer section is expanded: it also defers the embedding of the widget control's form until the widget is expanded, at which point the `widget-added` event also fires to allow any additional widget initialization to be done. The deferred DOM embedding can speed up initial load time by 10x or more. This DOM deferral also yields a reduction in overall memory usage in the browser process.
Includes changes to `wp_widget_control()` to facilitate separating out the widget form from the surrounding accordion container; also includes unit tests for this previously-untested function. Also included are initial QUnit tests (finally) for widgets in the Customizer.
Fixes#33901.
Built from https://develop.svn.wordpress.org/trunk@34563
git-svn-id: http://core.svn.wordpress.org/trunk@34527 1a063a9b-81f0-0310-95a4-ce76da25c4cd
* `wp-activate.php` and `wp-admin/themes.php` don't need the closing PHP tag
* Switch single quotes for HTML attribute values to double in a few places
* Convert `include_once file.php` syntax to `include_once( 'file.php' )`
* Add access modifiers to methods/members in: `_WP_List_Table_Compat`, `Walker_Nav_Menu_Edit`, `Walker_Nav_Menu_Checklist`, `WP_Screen`, `Walker_Category_Checklist`
* `edit_user()` doesn't need to import the `$wpdb` global
* `wp_list_widgets()` doesn't need to import the `$sidebars_widgets` global
* switch/endswitch syntax is not supported in Hack
* A `<ul>` in `wp-admin/users.php` is unclosed
See #27881.
Built from https://develop.svn.wordpress.org/trunk@28500
git-svn-id: http://core.svn.wordpress.org/trunk@28326 1a063a9b-81f0-0310-95a4-ce76da25c4cd
- Make dropping a widget easier by preventing the source sidebar from resizing while the widget is being dragged.
- Move widgets dropped on closed sidebars to the top. UI Sortable places them randomly near the bottom.
- Fix possible regression in wp_list_widget_controls(), add an optional argument to output the sidebar name inside the sortable container.
- Updated styles for sidebar description and widget-hover class.
Part props shaunandrews, fixes#25952.
Built from https://develop.svn.wordpress.org/trunk@26426
git-svn-id: http://core.svn.wordpress.org/trunk@26326 1a063a9b-81f0-0310-95a4-ce76da25c4cd
* A cleaner UI, with a simpler design for available and inactive widgets, and more emphasis on your sidebars.
* Available widgets and sidebars expand to two columns at larger screen sizes making it easier to manage sites with lots of sidebars.
* New dropzone indicator for empty sidebars.
Props shaunandrews, joen, iammattthomas.
Built from https://develop.svn.wordpress.org/trunk@26140
git-svn-id: http://core.svn.wordpress.org/trunk@26051 1a063a9b-81f0-0310-95a4-ce76da25c4cd