Commit Graph

144 Commits

Author SHA1 Message Date
Aaron Jorbin 86be091aba CSS: Run grunt `precommit:css` to update CSS.
See: #58869.
Props peterwilsoncc.



Built from https://develop.svn.wordpress.org/trunk@56948


git-svn-id: http://core.svn.wordpress.org/trunk@56459 1a063a9b-81f0-0310-95a4-ce76da25c4cd
2023-10-16 21:48:24 +00:00
joedolson f99b282ca2 Upload: Fix misalignment of 'Copied' message.
Add `display: flex` to `.copy-to-clipboard-container` to fix alignment of elements within the container.

Props sujichandran14, oglekler, sarathar, huzaifaalmesbah, nicolefurlan, joemcgill, dkotter.
Fixes #58829.
Built from https://develop.svn.wordpress.org/trunk@56801


git-svn-id: http://core.svn.wordpress.org/trunk@56313 1a063a9b-81f0-0310-95a4-ce76da25c4cd
2023-10-08 18:21:23 +00:00
joedolson a194e4b762 Media: Fix Image rotation button overflow in translations.
Fix CSS to cover the image rotation button action text being longer than the Image Rotation menu toggle. Prevent the button text from overflowing the button. Follow-up to [56239].

Props kebbet.
Fixes #58877.
Built from https://develop.svn.wordpress.org/trunk@56282


git-svn-id: http://core.svn.wordpress.org/trunk@55794 1a063a9b-81f0-0310-95a4-ce76da25c4cd
2023-07-22 19:23:25 +00:00
desrosj bc4dbee940 General: Commit changes after running `precommit:css`.
The `{min|max}-device-pixel-ratio` syntax as a a non-standard CSS media feature that was used as an alternative to the now standard `resolution`. Prior to Safari 16.0, `-webkit-{min|max}-device-pixel-ratio` was needed to correctly support it.

This change is a result of the `caniuse-lite` update that was applied recently in [56065]. Though there were no changes to target browsers as a result of this update, it seems an upstream change identified these as unnecessary.

See #57856, #58869.
Props desrosj, joemcgill, isabel_brison.
Built from https://develop.svn.wordpress.org/trunk@56279


git-svn-id: http://core.svn.wordpress.org/trunk@55791 1a063a9b-81f0-0310-95a4-ce76da25c4cd
2023-07-21 18:06:28 +00:00
joedolson 7a703a1b0f Media: Fix admin image editor layout at intermediary widths.
Follow up to [56189], which resolved the initial problem but created new problems with control proximity on wide monitors. Change admin image editor panels to use flex so panels only occupy the space needed.

Props joedolson, sabernhardt, mikinc860.
Fixes #58692.
Built from https://develop.svn.wordpress.org/trunk@56242


git-svn-id: http://core.svn.wordpress.org/trunk@55754 1a063a9b-81f0-0310-95a4-ce76da25c4cd
2023-07-16 15:59:22 +00:00
joedolson 05ed63a728 Media: Improve layout of image rotation options panel.
Add visual affordance to expanded/collapsed states and move panel under the control rather than placing it next to the toggle, to prevent overflow with the save menu.

Props nithi22, deepakvijayan, antpb, joedolson.
Fixes #58756.
Built from https://develop.svn.wordpress.org/trunk@56239


git-svn-id: http://core.svn.wordpress.org/trunk@55751 1a063a9b-81f0-0310-95a4-ce76da25c4cd
2023-07-15 21:42:26 +00:00
joedolson 3648049e48 Media: Fix responsive views in image editor
Adjust breakpoints for mid-range responsive views to prevent the save panel from overflowing other sections.

Props wildworks, mikinc860, mukesh27, sabernhardt, dhrumilk.
Fixes #58692.
Built from https://develop.svn.wordpress.org/trunk@56189


git-svn-id: http://core.svn.wordpress.org/trunk@55701 1a063a9b-81f0-0310-95a4-ce76da25c4cd
2023-07-10 22:11:24 +00:00
joedolson 993e1093eb Administration: Fix visual regression in media search input.
Follow up to [r56023]. Improve handling of breakpoint between 782 and 1000px for media grid view & repair styles for media modal search input.

Props kebbet, joedolson.
Fixes #57949.
Built from https://develop.svn.wordpress.org/trunk@56026


git-svn-id: http://core.svn.wordpress.org/trunk@55538 1a063a9b-81f0-0310-95a4-ce76da25c4cd
2023-06-25 21:13:21 +00:00
joedolson abc3ea5422 Administration: Consistent positioning and size of search form.
Move the visual positioning of the posts search form into it's DOM position. Fixes an accessibility bug where the keyboard focus sequence did not match the visual order. Change the media search form in list view to match the format of other post views. Give search forms a consistent layout on mobile.

Props oglekler, sabernhardt, joedolson.
Fixes #57949.
Built from https://develop.svn.wordpress.org/trunk@56023


git-svn-id: http://core.svn.wordpress.org/trunk@55535 1a063a9b-81f0-0310-95a4-ce76da25c4cd
2023-06-25 17:21:28 +00:00
joedolson 9b15db20d3 Media: Update admin image editor design.
Significant restructure of the admin image editor interface, but no new functionality. Reorganize editing buttons into a common region at the top of the editor. Move image rotation tools into a pop-out menu. Add 180 degree rotation option. Add scale button to control group. Move sidebar tools next to the editing canvas to improve visual proximity between action and result. Enlarge editing canvas and crop handles. Separate activating crop functions from applying crop. Add numeric inputs for crop & scale values. 

A long term goal is to move undo/redo and cancel/save into the modal title bar, but that is not feasible without significant updates to the modal framework.

Props afercia, karmatosed, nrqsnchz, antpb, chaion07, costdev, peterwilsoncc, antpb, sabernhardt, prashantbhivsane, joedolson.
Fixes #50523.
Built from https://develop.svn.wordpress.org/trunk@55919


git-svn-id: http://core.svn.wordpress.org/trunk@55431 1a063a9b-81f0-0310-95a4-ce76da25c4cd
2023-06-14 20:42:27 +00:00
antpb d4c39df308 Media: Prevent scaling up of images in the Image Editor.
Previously, when scaling an image larger than the source size in the image edit states the image would silently fail the scaling action. This patch provides an error when someone attempts to scale an image larger than the source size while also disabling the button to initiate the action. 

Props brookedot, joedolson, markoheijnen, mikeschroder, desrosj, Mista-Flo, costdev.
Fixes #26381.

Built from https://develop.svn.wordpress.org/trunk@55859


git-svn-id: http://core.svn.wordpress.org/trunk@55371 1a063a9b-81f0-0310-95a4-ce76da25c4cd
2023-05-25 15:17:19 +00:00
joedolson 8c310381f2 Media: Prevent hidden overflow on uploaded image names.
Allow the image upload notification to expand height and display the full image name when uploaded. Primarily effects mobile devices, where the available space for image names is narrow.

Props sumitsingh.
Fixes #54812.
Built from https://develop.svn.wordpress.org/trunk@55091


git-svn-id: http://core.svn.wordpress.org/trunk@54624 1a063a9b-81f0-0310-95a4-ce76da25c4cd
2023-01-18 18:51:11 +00:00
joedolson ee24b9b733 Media: Change alt attribute field to textarea in media library.
Change the input field used for `alt` attributes in the media library views from a text input to a textarea. This gives users more flexibility in resizing the field for easier management of longer alt attributes. 

This patch includes a less-common use of `esc_attr` for a `textarea`. This is because the primary usage of the `alt` attribute will be escaped using `esc_attr`, and the value in editing should match the value output on the front end.

Props edent, sabernhardt, afercia, JavierCasares, audrasjb, joedolson.
Fixes #50066.
Built from https://develop.svn.wordpress.org/trunk@54243


git-svn-id: http://core.svn.wordpress.org/trunk@53802 1a063a9b-81f0-0310-95a4-ce76da25c4cd
2022-09-20 04:02:10 +00:00
joedolson fd9d7a7547 Media: Fix editing controls covering image edit region.
Move the editing control sidebar for mobile image editing below the image edit region so image is not obscured.

Props mor10, HristoK, certainstrings, joedolson.
Fixes #30154.
Built from https://develop.svn.wordpress.org/trunk@53162


git-svn-id: http://core.svn.wordpress.org/trunk@52751 1a063a9b-81f0-0310-95a4-ce76da25c4cd
2022-04-12 16:50:08 +00:00
joedolson 74395140ad Media: Move dismiss upload errors button after errors.
Change the button that dismissess upload errors so it appears after the relevant errors. Change button from icon-only to text-based. Removes ambiguity about what you are cancelling when using the control.

Props ComputerGuru, melchoyce, vdwijngaert, alexislloyd, joedolson, shaunandrews, sabernhardt.
Fixes #42979.

Built from https://develop.svn.wordpress.org/trunk@52196


git-svn-id: http://core.svn.wordpress.org/trunk@51788 1a063a9b-81f0-0310-95a4-ce76da25c4cd
2021-11-17 15:56:03 +00:00
ryelle c11fbdc7ae Coding Standards: Apply coding standards on CSS.
Remove units when the value is zero. Combine redundant values in shorthand declarations.
This was generated with `stylelint --fix` and a custom config (see #53866).

Props ankitmaru, audrasjb, pbiron, ayeshrajans, hareesh-pillai, netweb, mukesh27.
Fixes #53866.


Built from https://develop.svn.wordpress.org/trunk@51727


git-svn-id: http://core.svn.wordpress.org/trunk@51333 1a063a9b-81f0-0310-95a4-ce76da25c4cd
2021-09-02 22:18:00 +00:00
antpb b2c449b1ec Media: Improve upload page media item layout on smaller screens.
This allows smaller screens to wrap error messages and other uploader media item elements in a more readable way.

Props joedolson sabernhardt, Presskopp.
See #51754.


Built from https://develop.svn.wordpress.org/trunk@51195


git-svn-id: http://core.svn.wordpress.org/trunk@50804 1a063a9b-81f0-0310-95a4-ce76da25c4cd
2021-06-22 04:26:58 +00:00
Sergey Biryukov b1666e78fb Media: Replace `basename()` usage on media upload screen with `wp_basename()` for better multibyte filenames support.
Includes minor code layout fixes for better readability.

Follow-up to [44785], [51023].

See #51754.
Built from https://develop.svn.wordpress.org/trunk@51030


git-svn-id: http://core.svn.wordpress.org/trunk@50639 1a063a9b-81f0-0310-95a4-ce76da25c4cd
2021-05-26 14:24:57 +00:00
antpb e2e8120fa6 Media: Add button in media upload page for copying the media url.
Adds a button to the media upload page to make copying the url possible on the same page when a media item upload is successful.

Props anotia, ryokuhi, Mista-Flo, lukecarbis, antpb, claytoncollie, shaunandrews, joedolson.
Fixes #51754.


Built from https://develop.svn.wordpress.org/trunk@51023


git-svn-id: http://core.svn.wordpress.org/trunk@50632 1a063a9b-81f0-0310-95a4-ce76da25c4cd
2021-05-26 01:40:58 +00:00
joedolson 9b6710c43c Media: Remove infinite scroll from media library and modal.
Replace infinitely autoloading behavior on scroll with a user-controlled load more button. Fix a long standing accessibility issue in the media library. Infinite scroll poses a wide range of problems for accessibility, usability, and performance.

This change modifies the library to load 40 items in the initial view, with a load more button to load the next 40 items and a button to move focus from the load more region to the first of the most recently added items.

The text for communicating the jump target was broadly discussed, agreeing that the text incorporated here would most concisely and clearly convey the purpose of the button, and any further detail is learnable from use.
 
Props afercia, adamsilverstein, joedolson, audrasjb, francina 
Fixes #50105. See #40330. 
Built from https://develop.svn.wordpress.org/trunk@50829


git-svn-id: http://core.svn.wordpress.org/trunk@50438 1a063a9b-81f0-0310-95a4-ce76da25c4cd
2021-05-07 23:19:03 +00:00
ryelle fed21a9863 Administration: Standardize colors used in CSS to a single palette.
This is part of a larger project in cleaning up core's admin CSS. This collapses all colors used in the CSS to one of 12 blues, greens, reds, and yellows, 13 grays, pure black, and pure white. The colors are perceptually uniform from light to dark, half of each range has a 4.5 or higher contrast against white, the other half has a 4.5 or higher contrast against black.

Standardizing on this set of colors will help contributors make consistent, accessible design decisions. The full color palette can be seen here: https://codepen.io/ryelle/full/WNGVEjw

Props notlaura, danfarrow, kburgoine, drw158, audrasjb, Joen, hedgefield, ibdz, melchoyce.
See #49999.


Built from https://develop.svn.wordpress.org/trunk@50025


git-svn-id: http://core.svn.wordpress.org/trunk@49726 1a063a9b-81f0-0310-95a4-ce76da25c4cd
2021-01-26 18:54:59 +00:00
antpb 64beb3ee49 Media: Removes duplicate alignment fix for browser uploader.
See #41648

Built from https://develop.svn.wordpress.org/trunk@49555


git-svn-id: http://core.svn.wordpress.org/trunk@49293 1a063a9b-81f0-0310-95a4-ce76da25c4cd
2020-11-09 23:43:07 +00:00
antpb 4f2e88a574 Media: Adjusts alignment of file name text in browser uploader.
Sets a defined size for text alongside the media browser uploader button fixing alignment on popular browsers.

Props krupajnanda, mikeschroder, aaroncampbell, lucagrandicelli, andraganescu, samful, sabernhardt, andystitt829, kburgoine.
Fixes #41648

Built from https://develop.svn.wordpress.org/trunk@49553


git-svn-id: http://core.svn.wordpress.org/trunk@49291 1a063a9b-81f0-0310-95a4-ce76da25c4cd
2020-11-09 23:34:09 +00:00
antpb 9901c9a48d Media: Adjust box-sizing for audio players.
Fix cropped container around playhead time in audio player.

Props ravipatel, sabernhardt, audrasjb, SergeyBiryukov, 
Fixes #51685

Built from https://develop.svn.wordpress.org/trunk@49550


git-svn-id: http://core.svn.wordpress.org/trunk@49288 1a063a9b-81f0-0310-95a4-ce76da25c4cd
2020-11-09 19:34:08 +00:00
Helen Hou-Sandí 7636806a52 Media: Fix styling for MediaElement player in media modal.
Fixes #43640.

Built from https://develop.svn.wordpress.org/trunk@49343


git-svn-id: http://core.svn.wordpress.org/trunk@49103 1a063a9b-81f0-0310-95a4-ce76da25c4cd
2020-10-27 19:40:04 +00:00
Sergey Biryukov 4bb4107f50 General: Use correct value for the `speak` property in various CSS files.
Follow-up to [49263].

Props hareesh-pillai.
Fixes #51622.
Built from https://develop.svn.wordpress.org/trunk@49309


git-svn-id: http://core.svn.wordpress.org/trunk@49071 1a063a9b-81f0-0310-95a4-ce76da25c4cd
2020-10-26 02:25:09 +00:00
Sergey Biryukov 2cbcc5d548 Media: Make the "Copy URL" button implementation more consistent with other instances in core:
* Make the "Copied!" text green.
* Make the button verbiage clear that it's copied "to clipboard".

Props garrett-eclipse, mukesh27.
Fixes #51355.
Built from https://develop.svn.wordpress.org/trunk@49064


git-svn-id: http://core.svn.wordpress.org/trunk@48826 1a063a9b-81f0-0310-95a4-ce76da25c4cd
2020-09-27 20:48:05 +00:00
Andrea Fercia afa6bb4f1a Accessibility: Improve color contrast for the blue links `:hover` state.
For a number of years, WordPress has been using a `#00a0d2` blue shade for the links `:hover` state. This blue shade doesn't have a sufficient color contrast with the various (too many) background colors used in the admin interface.

The new `#006799` blue shade is part of the official WordPress color palette and does have a sufficient color contrast with most of the admin backgrounds.

Props ryokuhi, audrasjb, joedolson, mapk.
See #47682.

Built from https://develop.svn.wordpress.org/trunk@48368


git-svn-id: http://core.svn.wordpress.org/trunk@48137 1a063a9b-81f0-0310-95a4-ce76da25c4cd
2020-07-07 10:11:05 +00:00
Andrea Fercia 45d19872fc Accessibility: Media: Fix the Image Editor mismatching keyboard focus order and visual reading order.
Swaps the DOM order of the two main columns within the admin Image Editor.

When the sequence in which content is presented affects its meaning and the navigation sequences affect meaning or operation, visual order and DOM order must match. See WCAG 2.1 Success Criterion 1.3.2 Meaningful Sequence and Success Criterion 2.4.3 Focus Order.

Props sabernhardt, anevins, audrasjb, afercia.
Fixes #47136.

Built from https://develop.svn.wordpress.org/trunk@48265


git-svn-id: http://core.svn.wordpress.org/trunk@48034 1a063a9b-81f0-0310-95a4-ce76da25c4cd
2020-07-01 14:29:01 +00:00
Andrea Fercia eebf187963 Accessibility: Media: Add a "Copy URL" button to the attachment File URL fields.
For a number of years, various screens in the WordPress admin provided users with a readonly input field to copy the attachment file URL. Manually copying from a readonly field is an annoying task at best even for mouser users. It's a usability and accessibility issue at the same time. 
These fields now have a new "Copy URL" button that is easy to use and accessible to everyone.

Props theolg, markdubois, vabrashev, sajjad67, xkon, nrqsnchz, melchoyce, audrasjb, afercia.
See #41612, #50322, #50335.
Fixes #48463.

Built from https://develop.svn.wordpress.org/trunk@48232


git-svn-id: http://core.svn.wordpress.org/trunk@48001 1a063a9b-81f0-0310-95a4-ce76da25c4cd
2020-06-30 13:16:04 +00:00
Sergey Biryukov c30fd0b54d Media: Improve the appearance of image editor on small and medium screens.
This prevents the main area of Edit Media screen from being pushed down too far.

Props sabernhardt, afercia, fierevere, sathyapulse, mikeschroder, johnbillion.
Fixes #48780. See #47136.
Built from https://develop.svn.wordpress.org/trunk@47418


git-svn-id: http://core.svn.wordpress.org/trunk@47205 1a063a9b-81f0-0310-95a4-ce76da25c4cd
2020-03-03 17:21:05 +00:00
John Blackbourn da52485cf1 Editor: Revert a fix for incorrect usage of ID attributes on custom fields.
This reverts [47222] due to compatibility issues with plugins which are using the `#poststuff` selector.

See #46964
Built from https://develop.svn.wordpress.org/trunk@47410


git-svn-id: http://core.svn.wordpress.org/trunk@47197 1a063a9b-81f0-0310-95a4-ce76da25c4cd
2020-03-03 00:37:06 +00:00
Andrea Fercia d1054fcb48 Accessibility: Improve readability by removing unnecessary italic font style.
Per Web Content Accessibility Guidelines 2.0, big chunks of italic text should be avoided.
Same applies to UI controls, since they're meant to be comfortably readable by the largest possible audience, e.g.: label elements.

Removes italic font style from:
- the Quick Edit / Bulk Edit forms
- the Recovery Mode plugin error details
- the Image Editor inline help

Props birgire, audrasjb, SergeyBiryukov, melchoyce, estelaris, sabernhardt, xkon, nrqsnchz, afercia.
See #47327.

Built from https://develop.svn.wordpress.org/trunk@47304


git-svn-id: http://core.svn.wordpress.org/trunk@47104 1a063a9b-81f0-0310-95a4-ce76da25c4cd
2020-02-18 15:32:09 +00:00
joedolson 61ce35440c Editor: Fix incorrect usage of ID attributes on custom fields.
Repeated containers used for custom fields have duplicate ID attributes. Duplicate IDs are incorrect HTML, and will also cause unexpected results when trying to manipulate using JS. Duplicate IDs are changed to matching classes; CSS & JS updated to match. 

Props jankimoradiya, audrasjb, donmhico, afercia.
Fixes #46964.

Built from https://develop.svn.wordpress.org/trunk@47222


git-svn-id: http://core.svn.wordpress.org/trunk@47022 1a063a9b-81f0-0310-95a4-ce76da25c4cd
2020-02-09 19:41:07 +00:00
Sergey Biryukov dd47d5aa81 Media: Use consistent width for Scale and Crop inputs.
Follow-up to [46359].

Props sabernhardt, audrasjb.
Fixes #48907.
Built from https://develop.svn.wordpress.org/trunk@46856


git-svn-id: http://core.svn.wordpress.org/trunk@46656 1a063a9b-81f0-0310-95a4-ce76da25c4cd
2019-12-09 16:23:02 +00:00
Sergey Biryukov 49007e52bc Build/Test Tools: Add banner to RTL CSS and minified JS files.
Patches occasionally come in on generated files. We should be kind to new contributors and give them a hint that these files are auto-generated.

This is a follow-up to [41271], which added the banner to minified CSS files.

Fixes #48424. See #30666.
Built from https://develop.svn.wordpress.org/trunk@46589


git-svn-id: http://core.svn.wordpress.org/trunk@46386 1a063a9b-81f0-0310-95a4-ce76da25c4cd
2019-10-26 00:17:07 +00:00
Andrea Fercia e9065659f4 Accessibility: Improve and modernize user interface controls for better contrast: Further improvements to input heights and alignments.
- improves input fields height in the customizer
- improves input fields height for Internet Explorer 11
- improves input fields height in the Image Editor
- improves alignment of selects and buttons in the privacy policy pages
- makes the search themes fields font-size consistent

Props garrett-eclipse, afercia.
See #47477.

Built from https://develop.svn.wordpress.org/trunk@46419


git-svn-id: http://core.svn.wordpress.org/trunk@46217 1a063a9b-81f0-0310-95a4-ce76da25c4cd
2019-10-07 13:20:03 +00:00
Andrea Fercia 1f3d583825 Accessibility: Media: Improve the search media field labelling.
Visible `<label>` elements benefit all users. The `placeholder` attribute should not be used as a replacement for visible labels.
Instead, it's supposed to be used only for a short hint to aid users with data entry e.g. a sample value or a brief description of the expected format.

Screen readers may not announce a `placeholder` attribute at all. Other users may suffer from the lack of a visible label and a placeholder used as replacement, for example:

- users with cognitive disabilities may have trouble remembering what the filled field does
- speech recognition users cannot see the name they can speak to set focus on the field
- low-vision users with high text-size may not be able to see the whole placeholder even when it's visible, if its value is clipped by the edge of the input

Props anevins, audrasjb, karmatosed, azaozz, SergeyBiryukov, afercia.
See #40331.
Fixes #47138.

Built from https://develop.svn.wordpress.org/trunk@46418


git-svn-id: http://core.svn.wordpress.org/trunk@46216 1a063a9b-81f0-0310-95a4-ce76da25c4cd
2019-10-07 12:43:03 +00:00
antpb 6531c237e7 Media: Prevents clipping of text when scaling image edit screen.
This reapplies [46354] clean as the previous commit had remnants of an unrelated patch.

Props sabernhardt, audrasjb, afercia.
See #47115.

Built from https://develop.svn.wordpress.org/trunk@46359


git-svn-id: http://core.svn.wordpress.org/trunk@46158 1a063a9b-81f0-0310-95a4-ce76da25c4cd
2019-09-30 17:56:57 +00:00
antpb 247e7eb7d5 Media: Revert [46354] preventing bad clipping of text in image details page.
See #47115.

Built from https://develop.svn.wordpress.org/trunk@46355


git-svn-id: http://core.svn.wordpress.org/trunk@46154 1a063a9b-81f0-0310-95a4-ce76da25c4cd
2019-09-30 17:12:59 +00:00
antpb 7c8028febf Media: Prevents clipping of text when scaling image edit screen.
Props sabernhardt, audrasjb, afercia.
See #47115.

Built from https://develop.svn.wordpress.org/trunk@46354


git-svn-id: http://core.svn.wordpress.org/trunk@46153 1a063a9b-81f0-0310-95a4-ce76da25c4cd
2019-09-30 16:34:58 +00:00
Andrea Fercia 8ef586a897 Accessibility: Improve and modernize user interface controls: Make the secondary buttons border blue.
Props drw158, youknowriad, kjellr, melchoyce, talldanwp, audrasjb.
See #34904.

Built from https://develop.svn.wordpress.org/trunk@46344


git-svn-id: http://core.svn.wordpress.org/trunk@46143 1a063a9b-81f0-0310-95a4-ce76da25c4cd
2019-09-29 21:53:57 +00:00
Andrea Fercia 66dd6814e7 Media: Restore the original Image Editor columns layout after [46326].
Fixes #47116.

Built from https://develop.svn.wordpress.org/trunk@46331


git-svn-id: http://core.svn.wordpress.org/trunk@46130 1a063a9b-81f0-0310-95a4-ce76da25c4cd
2019-09-26 20:37:57 +00:00
Andrea Fercia 93dd6d907a Accessibility: Media: Make the Image Editor buttons text visible.
User interface controls that use only icons aren't ideal for many users. 

Universal icons are rare. Icons must communicate meaning but their actual meaning varies depending on many factors including the users cultural background.
Moreover, users with cognitive impairments and speech recognition users need interface controls with visible text to be able to operate them.

- shortens some of the buttons text to: Rotate left, Rotate right, Flip vertical, Flip horizontal
- moves the Undo and Redo buttons underneath the main buttons group

Props nrqsnchz, melchoyce, karmatosed, sabernhardt, mikeschroder.
Fixes #47116.

Built from https://develop.svn.wordpress.org/trunk@46326


git-svn-id: http://core.svn.wordpress.org/trunk@46125 1a063a9b-81f0-0310-95a4-ce76da25c4cd
2019-09-26 17:16:57 +00:00
Andrea Fercia 165ac34260 Accessibility: Improve and modernize user interface controls for better contrast. Fifth part: Common form controls.
Props anevins, melchoyce, audrasjb, kjellr.
Fixes #47153.

Built from https://develop.svn.wordpress.org/trunk@46247


git-svn-id: http://core.svn.wordpress.org/trunk@46059 1a063a9b-81f0-0310-95a4-ce76da25c4cd
2019-09-23 16:21:58 +00:00
Andrea Fercia 271f45072d Accessibility: Improve and modernize user interface controls for better contrast. Second part: tables, meta boxes, and other user interface elements.
Introduces better contrast for borders of the following user interface elements:
- Tables
- Screen Options and Help 
- Admin notices
- Welcome panel
- Meta boxes (post boxes)
- Cards
- Health Check accordions and headings
- Theme and Plugin upload forms

Props kjellr, melchoyce, karmatosed, audrasjb.
Fixes #48101.

Built from https://develop.svn.wordpress.org/trunk@46242


git-svn-id: http://core.svn.wordpress.org/trunk@46054 1a063a9b-81f0-0310-95a4-ce76da25c4cd
2019-09-23 15:10:59 +00:00
Andrea Fercia 340fd28d82 Accessibility: Improve focus management in the Media Views.
- keeps focus management only where necessary to avoid focus losses
- removes focus management where a specific user workflow was assumed
- makes the "Attachment Details" navigation buttons really disabled when there are no next or previous attachments
- adds inline comments to clarify all the usages of focus()

Fixes #43169.

Built from https://develop.svn.wordpress.org/trunk@45524


git-svn-id: http://core.svn.wordpress.org/trunk@45335 1a063a9b-81f0-0310-95a4-ce76da25c4cd
2019-06-12 21:03:52 +00:00
Andrea Fercia 6a9bcaeaa9 Accessibility: Improve accessibility of all the media views form controls.
- changes the media views form controls to have explicitly associated labels with for/id attributes
- adds a few missing labels / aria-labels
- improves a few existing labels / aria-labels
- improves semantics in a few places, by adding visually hidden headings, fieldset + legend elements, aria-describedby attributes
- improves the image custom size input fields and their labelling
- adds `role="status"` to the "saved" indicator so that status messages are announced to assistive technologies
- swaps the columns source order in the image details template, to make visual and DOM order match
- swaps the "Replace" and "Back" buttons source order in the Replace Image view, to make visual and DOM order match
- gallery settings: move checkbox label to the right: checkboxes are supposed to have labels on the right
- merge similar strings, unified to "Drop files to upload" (removed "Drop files here", and "Drop files anywhere to upload")
- makes the "upload-ui" consistent across the media views
- hides the IE 11 "X" `::-ms-clear` button in the Insert from URL field, as it conflicts with the uploading spinner
- adds comments to all the media templates to clarify their usage
- slightly increases vertical spacing between form fields in the media sidebar
- removes some CSS selectors introduced as backwards compatibility for WordPress pre-4.4
- removes some CSS still targeting Internet Explorer 7 and 8

Fixes #47141.
Fixes #47122.

Built from https://develop.svn.wordpress.org/trunk@45499


git-svn-id: http://core.svn.wordpress.org/trunk@45310 1a063a9b-81f0-0310-95a4-ce76da25c4cd
2019-06-07 20:45:02 +00:00
Andrea Fercia d5333b9593 Fix the media player controls bar width in the media views.
Props vaishalipanchal, chetan200891.
Fixes #47457.

Built from https://develop.svn.wordpress.org/trunk@45497


git-svn-id: http://core.svn.wordpress.org/trunk@45308 1a063a9b-81f0-0310-95a4-ce76da25c4cd
2019-06-07 13:29:52 +00:00
Sergey Biryukov baa2cd69b8 Media: Restore correct arrow direction in RTL in Attachment Details modal.
Reverts [29264]. As we now have a build task to replace dashicons for RTL, the CSS rules no longer worked as expected and had the opposite effect.

Props ramiy, SergeyBiryukov.
Fixes #46289.
Built from https://develop.svn.wordpress.org/trunk@45495


git-svn-id: http://core.svn.wordpress.org/trunk@45306 1a063a9b-81f0-0310-95a4-ce76da25c4cd
2019-06-06 01:25:52 +00:00