This changes the CSS for Site Health headers to use flexbox, which helps ensure the text is vertically aligned center and consistently spaced in both the Status and Info tabs. It also fixes an issue where the loading spinner GIF was cut off on smaller screens (originally reported in #47203.
Props Presskopp, odminstudios, kjellr, afercia, desrosj, hedgefield, ianbelanger, xavortm.
Fixes#47063.
git-svn-id: https://develop.svn.wordpress.org/trunk@45322 602fd350-edb4-49c9-b593-d223f7449a82
This change removes redundant CSS properties for different health check statuses in favor of utilizing the `.dashicons` class already in Core to define them more consistently. This also fixes the vertical alignment issues.
Props chetan200891, Clorith, desrosj.
Fixes#46940.
git-svn-id: https://develop.svn.wordpress.org/trunk@45309 602fd350-edb4-49c9-b593-d223f7449a82
Use final image URLs and fix a bug in IE11 where images were being cut off.
Props afercia, SergeyBiryukov, ianbelanger, desrosj, audrasjb.
See #46901.
git-svn-id: https://develop.svn.wordpress.org/trunk@45287 602fd350-edb4-49c9-b593-d223f7449a82
- The About page now uses a CSS grid to layout its design, making the page’s structure more obvious and hopefully easier for contributors in the future.
- Removes some code that is no longer used (such as videos, mejs elements, etc.).
- Update images.
- Unnecessary HTML is removed from a string on the page. This was a regression.
- Only users with the correct capability should be instructed to check their site status.
- Fixes the placement of commas.
Reviewed by melchoyce, afercia, jeremyfelt, and desrosj.
Props ryelle, melchoyce, cathibosco1, man4toman, SergeyBiryukov, afercia, ramiy, kjellr, tellyworth, earnjam, andreamiddleton, marybaum.
See #46901.
git-svn-id: https://develop.svn.wordpress.org/trunk@45278 602fd350-edb4-49c9-b593-d223f7449a82
This change restores About page tab heights and fixes bugs with the tab bottom border caused by [44905] and [45243].
Reviewed by SergeyBiryukov and desrosj.
Props ixkaito, ianbelanger, afercia, SergeyBiryukov.
See #46901.
Fixes#47075.
git-svn-id: https://develop.svn.wordpress.org/trunk@45276 602fd350-edb4-49c9-b593-d223f7449a82
This changes includes placeholder images for now, they'll be replaced by the final images before final release.
Props chanthaboune, melchoyce, karmatosed, pento, marybaum, birgire, earnjam, andreamiddleton.
See #46901.
git-svn-id: https://develop.svn.wordpress.org/trunk@45271 602fd350-edb4-49c9-b593-d223f7449a82
This change adds missing actions for several tests. This ensures that the user is provided with a next step, whenever possible.
Also, change the URL displayed in the WordPress.org communication test description to `api.wordpress.org` for accuracy.
Props: garrett-eclipse, Clorith, vaishalipanchal.
Fixes#46734.
git-svn-id: https://develop.svn.wordpress.org/trunk@45170 602fd350-edb4-49c9-b593-d223f7449a82
Label badges for each Site Health test currently display in either red, orange, or green, regardless of if the test passed or failed. This is confusing, as seeing red labels in the “Passed Test” section could alarm users (when really everything is OK and no action is required), and seeing green labels in the “Failed Tests” section would not appropriately encourage the user to take appropriate action.
This change makes several improvements to the label badges:
- Always right align the badges for consistent display.
- Remove background fill for badges. Instead, use a border.
- Use a consistent styling for all tests (passed and failed).
- The text color no longer uses true black (#000000).
- The `.badge.pink` CSS definition has been switched to `.badge.purple`, and the definitions for blue, gray, and green have also been updated to more closely follow the official WordPress color palette.
Props: pbiron, garrett-eclipse, hedgefield, Clorith, xkon, melchoyce, mdwolinski, alexdenning.
Fixes#46623.
git-svn-id: https://develop.svn.wordpress.org/trunk@45169 602fd350-edb4-49c9-b593-d223f7449a82
Brings parity with the changes for the Media Views introduced in [44900].
- moves the alt text field to the top as first field
- adds an explanatory text with a link pointing to the W3C "alt decision tree" tutorial
- adds `aria-describedby` to target the explanatory text
- adjusts the CSS and indentation
Props chetan200891.
Fixes#46875.
git-svn-id: https://develop.svn.wordpress.org/trunk@45158 602fd350-edb4-49c9-b593-d223f7449a82
The right padding added in [44895] needs to be set only on the input fields in the Reset Password screen and exclude other login screens.
Amends [44895].
Fixes#42853.
git-svn-id: https://develop.svn.wordpress.org/trunk@45157 602fd350-edb4-49c9-b593-d223f7449a82
This changeset introduces several changes around usability when recovery mode is active:
* Display a notice in the admin clarifying that the user is in recovery mode.
* Use a highlight color for the admin bar link to exit recovery mode.
* Exit recovery mode automatically when logging out.
* Include a recovery mode indicator in the title tag.
Props aandrewdixon, azaozz, dhanukanuwan, flixos90, henrywright, karmatosed, mapk, melchoyce, spacedmonkey, TimothyBlynJacobs, tinkerbelly.
See #46608.
git-svn-id: https://develop.svn.wordpress.org/trunk@45117 602fd350-edb4-49c9-b593-d223f7449a82
- removes the definition list and uses the markup from the ARIA Authoring Practices example
- removes incorrect ARIA roles
- avoids ARIA landmark regions proliferation
Props mukesh27 for the initial patch.
Fixes#46714.
git-svn-id: https://develop.svn.wordpress.org/trunk@45087 602fd350-edb4-49c9-b593-d223f7449a82
Avoids the Site Health pages header layout to break when the Hello Dolly plugin or other floated content is printed out at the top of the page.
Props xkon.
Fixes#46650.
git-svn-id: https://develop.svn.wordpress.org/trunk@45072 602fd350-edb4-49c9-b593-d223f7449a82
The previous method for copying the debug report to the clipboard involved having a hidden `<textarea>`, but this shows up in screen readers and can't be reliably hidden.
To work around this, the button now uses the `clipboard.js` library, which automatically handles browser differences in the Clipboard API, and can load the text to copy from a `data-` attribute on the button.
Props pento, hedgefield, afercia.
Fixes#46647.
git-svn-id: https://develop.svn.wordpress.org/trunk@45044 602fd350-edb4-49c9-b593-d223f7449a82
The Site Health score indicator isn't exactly a "progress bar" and shouldn't use ARIA roles and properties related to progress bars. Also, some browser / screen reader combinations don't announce the score properly.
- removes any ARIA
- adds a screen-reader-text "Current health score:"
- adds `role="img" aria-hidden="true" focusable="false"` to the SVG
- reduces CSS specificity simplifying unnecessary overqualified selectors
- fixes the syntax for ::after and ::before (double colon)
Fixes#46621.
git-svn-id: https://develop.svn.wordpress.org/trunk@45041 602fd350-edb4-49c9-b593-d223f7449a82
The Site Health tool serves two purposes:
- Provide site owners with information to improve the performance, reliability, and security of their site.
- Collect comprehensive debug information about the site.
By encouraging site owners to maintain their site and adhere to modern best practices, we ultimately improve the software hygeine of both the WordPress ecosystem, and the open internet as a whole.
Props Clorith, hedgefield, melchoyce, xkon, karmatosed, jordesign, earnjam, ianbelanger, wpscholar, desrosj, pedromendonca, peterbooker, jcastaneda, garyj, soean, pento, timothyblynjacobs, zodiac1978, dgroddick, garrett-eclipse, netweb, tobifjellner, pixolin, afercia, joedolson, birgire.
See #46573.
git-svn-id: https://develop.svn.wordpress.org/trunk@44986 602fd350-edb4-49c9-b593-d223f7449a82
Using the new fatal handler introduced in [44962], an email is sent to the admin when a fatal error occurs. This email includes a secret link to enter recovery mode. When clicked, the link will be validated and on success a cookie will be placed on the client, enabling recovery mode for that user. This functionality is executed early before plugins and themes are loaded, in order to be unaffected by potential fatal errors these might be causing.
When in recovery mode, broken plugins and themes will be paused for that client, so that they are able to access the admin backend despite of these errors. They are notified about the broken extensions and the errors caused, and can then decide whether they would like to temporarily deactivate the extension or fix the problem and resume the extension.
A link in the admin bar allows the client to exit recovery mode.
Props timothyblynjacobs, afragen, flixos90, nerrad, miss_jwo, schlessera, spacedmonkey, swissspidy.
Fixes#46130, #44458.
git-svn-id: https://develop.svn.wordpress.org/trunk@44973 602fd350-edb4-49c9-b593-d223f7449a82
Introduce a dedicated 'Formats' drop-down filter as a replacement.
Keep the icons as a simple visual indicator of the post format for now.
Props afercia, melchoyce, GaryJ, chiaralovelaces, SergeyBiryukov.
Fixes#35497.
git-svn-id: https://develop.svn.wordpress.org/trunk@44961 602fd350-edb4-49c9-b593-d223f7449a82
This change ensures that the values of time and date fields for comments and posts (both Classic Editor and quick edit) are consistently aligned in the center of the input fields. The block editor already enforces this alignment separately.
Props birgire, jainnidhi, melchoyce.
Fixes#43675.
git-svn-id: https://develop.svn.wordpress.org/trunk@44945 602fd350-edb4-49c9-b593-d223f7449a82
- standardizes the Comment count string to `%s Comment in moderation', '%s Comments in moderation` so it can be bulk-updated
- adds the string as visually hidden text in the admin menu
- introduces an `updateInModerationText` JS simple function, responsible to correctly update all the related text using the data from the AJAX response
- adds a visually hidden text "1 Privacy Policy update" to the Privacy menu items count
- adds/improves translators comments
Changes that apply to all the count bubbles (Updates, plugins, etc.)
- makes the bubbles and their text slightly bigger
- improves the active menu item bubble contrast by changing the background color to red (option 2 in the screenshot attached in a previous comment)
Props adamsoucie, afercia.
Fixes#33030.
git-svn-id: https://develop.svn.wordpress.org/trunk@44924 602fd350-edb4-49c9-b593-d223f7449a82
Some "visual tabs" in the WordPress admin used links wrapped in a `h2` heading. While these tabs look like ARIA tabs, they're just navigation menus and should be marked-up as such to be correctly exposed to assistive technologies.
- changes the wrapping `<h2>` to a `<nav>` element: worth reminding `<nav>` elements also define ARIA landmarks
- adds an `aria-label` to the `<nav>` elements so they can be distinguished from other `<nav>` elements in the page
- adjusts the headings level in the Credits page
Props audrasjb, afercia.
Fixes#43398.
git-svn-id: https://develop.svn.wordpress.org/trunk@44905 602fd350-edb4-49c9-b593-d223f7449a82
Old browsers didn't support the HTML placeholder attribute. For a number of years, `<label>` elements have been used in a few places in WordPress to emulate placeholders. It's time to improve semantics and interaction, use real placeholders when possible, and clean up some JavaScript.
- Quick Draft widget: it now uses visible `<label>` elements and a real `placeholder` attribute
- removes the related JavaScript
- Post title:
- keeps the "prompt" label for backwards compatibility
- improves the JavaScript to make the "prompt" label stay visible on focus and disappear when typing, like real placeholder do
- changes the post "prompt" text from "Enter title here" to "Add title" for consistency with the Block Editor
- cleans-up some CSS
Props Cheffheid, afercia.
Fixes#42390.
git-svn-id: https://develop.svn.wordpress.org/trunk@44896 602fd350-edb4-49c9-b593-d223f7449a82
- makes the "Cancel" button always visible: this allows to generate a new password also on small screens
- moves focus back to the Generate Password button when closing the form
- changes the password reset show/hide button from a clickable `<span>` element to a real `<button>` element
- improves the CSS
Props janak007, afercia.
Fixes#42853.
git-svn-id: https://develop.svn.wordpress.org/trunk@44895 602fd350-edb4-49c9-b593-d223f7449a82
`<button>` elements are natively interactive, supported by any assistive technology, and must be used instead of non-semantic, non-accessible `<div>` elements.
Also, this change aligns the Media Widgets and the Customizer site icon and site logo controls with the design pattern used in the new Block Editor for similar controls.
Props ramonopoly, welcher, afercia.
Fixes#43151.
git-svn-id: https://develop.svn.wordpress.org/trunk@44796 602fd350-edb4-49c9-b593-d223f7449a82
Jonathan Desrosiers