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
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
- changes the "X" links in buttons, improves their color contrast ratio and focus style
- adds screen reader text "Remove item: + tagname"
- uses `wp.a11y.speak()` to give screen reader users feedback when adding/removing tags
- makes the `tagcloud-link` toggle a button, with an `aria-expanded` attribute to indicate the tag cloud collapsed/expanded state
- changes colors for the autocomplete highlighted option in order to have a better color contrast ratio
- reduces the font size for the autocomplete on Press This
- removes CSS related to the old `suggest.js` from Press This
Props joedolson, cgrymala, azaozz, afercia.
Fixes#27555.
Built from https://develop.svn.wordpress.org/trunk@38880
git-svn-id: http://core.svn.wordpress.org/trunk@38823 1a063a9b-81f0-0310-95a4-ce76da25c4cd
Removes contents for sections and panels from being logically nested (in the DOM) in order to eliminate many issues related to using `margin-top` hacks. The element containing the link to expand the content element for panels and sections is now a sibling element to its content element: the content is removed from being nested at initialization. The content element is now available in a `contentContainer` property whereas the head element (containing the link to open the construct) is in a `headContainer` property. The existing `container` property is now a jQuery collection that contains both of these elements. Since the head element is no longer in an ancestor element to the `content` element, the `aria-owns` property is now used to maintain the relationship between the `headContainer` and the `contentContainer`. These changes are also accompanied by an improvement to the animation performance for the sliding panes.
Props delawski, celloexpressions.
Fixes#34391.
Fixes#34344.
Fixes#35947.
Built from https://develop.svn.wordpress.org/trunk@38648
git-svn-id: http://core.svn.wordpress.org/trunk@38591 1a063a9b-81f0-0310-95a4-ce76da25c4cd
- adds "Apply Filters" and "Clear" at the end of the form
- changes the "Feature Filter", "Apply Filters", "Clear", and "Edit" links in `<button>` elements
- removes a leftover from [27963]
- clarifies one button text and adds an `aria-label` attribute
- adds a `wp.a11y.speak()` message when clicking on "Apply Filters" and no features are selected
Fixes#38086.
Built from https://develop.svn.wordpress.org/trunk@38640
git-svn-id: http://core.svn.wordpress.org/trunk@38583 1a063a9b-81f0-0310-95a4-ce76da25c4cd
The `submitdelete` CSS class is used in various places across the admin for some
"red" action links. It is worth simplifying this rule for further improvements
related to color contrast.
- simplifies a non-standard styling for the "Remove/Cancel" links in the Menus screen
- underlines all the "Move to trash/Delete" red links in all the Publish meta boxes
- fixes CSS classes usage for all the Publish meta boxes primary buttons
- fixes broken layout for the old Link Manager publish meta box
Props karmatosed, hugobaeta, monikarao, afercia.
Fixes#37969, #37018. See #37448, #37138, #27314.
Built from https://develop.svn.wordpress.org/trunk@38616
git-svn-id: http://core.svn.wordpress.org/trunk@38559 1a063a9b-81f0-0310-95a4-ce76da25c4cd
This change restores only the margin and padding styles for the `.update-message` class when used by plugins in the context of adding arbitrary rows to the list table. The inline-update colors and icon styles were not restored, expressly with a wide variety of plugin use-cases in mind.
Props ovann86, rahulsprajapati, ocean90, DrewAPicture.
Props helen for review.
See #37504.
Built from https://develop.svn.wordpress.org/trunk@38237
git-svn-id: http://core.svn.wordpress.org/trunk@38178 1a063a9b-81f0-0310-95a4-ce76da25c4cd
When doing a bulk update, if there are failures the user needs to know about that. This makes it clearer that you can click on the notification to see more details, especially for screen reader users.
Fixes#37510.
Props juhise, Ankit K Gupta, afercia, jorbin, ocean90.
Built from https://develop.svn.wordpress.org/trunk@38185
git-svn-id: http://core.svn.wordpress.org/trunk@38126 1a063a9b-81f0-0310-95a4-ce76da25c4cd
* Remove title attributes.
* Show "Install Now" and "Details" links if the importer isn't installed yet.
* Show a "Run Importer" link if the importer is installed. It also handles activation if the plugin isn't activated.
* Add `aria-label` attributes to each link.
* Unify the importer descriptions to make them independent from the plugin state. The API was changed in [meta3690].
* Adjust JavaScript callbacks for ajaxified importer installs.
Props afercia, swissspidy, ocean90.
See #24766.
Fixes#35191.
Built from https://develop.svn.wordpress.org/trunk@38075
git-svn-id: http://core.svn.wordpress.org/trunk@38016 1a063a9b-81f0-0310-95a4-ce76da25c4cd
UI controls that "do something" on a page shouldn't be links. This link behaves
like a toggle to expand the uploader panel and should be a `button` element with
an aria-expanded attribute. Also:
- improves consistency with the Plugin uploader
- keeps the themes list visible when the uploader is open
- displays a notice when JavaScript is off
- adds some `hide-if-no-js` CSS classes
- removes the `themes.router.navigate()` "upload" route: seems unnecessary and breaks history
Fixes#35457.
Built from https://develop.svn.wordpress.org/trunk@37742
git-svn-id: http://core.svn.wordpress.org/trunk@37707 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
Gone are the days of isolation and feelings of "meh", brought on by The Bleak Screen of Sadness. For a shiny knight has arrived to usher our plugins and themes along their arduous journey of installation, updates, and the inevitable fate of ultimate deletion.
Props swissspidy, adamsilverstein, mapk, afragen, ocean90, ryelle, j-falk, michael-arestad, melchoyce, DrewAPicture, AdamSoucie, ethitter, pento, dd32, kraftbj, Ipstenu, jorbin, afercia, stephdau, paulwilde, jipmoors, khag7, svovaf, jipmoors, obenland.
Fixes#22029, #25828, #31002, #31529, #31530, #31773, #33637, #35032.
Built from https://develop.svn.wordpress.org/trunk@37714
git-svn-id: http://core.svn.wordpress.org/trunk@37680 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
The plugin details modal can be invoked from several screens. There's now a new
`.open-plugin-details-modal` CSS class to be used in combination with the
`.thickbox` CSS class that adds everything needed for accessibility.
- Adds an ARIA role `dialog` and an `aria-label` attribute to the modal
- Adds a `title` attribute to the iframe inside the modal
- Constrains tabbing within the modal
- Restores focus back in a proper place when closing the modal
Also, improves a bit the native Thickbox implementation: it should probably be
replaced with some more modern tool but at least keyboard focus should be moved
inside the modal.
Fixes#33305.
Built from https://develop.svn.wordpress.org/trunk@36964
git-svn-id: http://core.svn.wordpress.org/trunk@36932 1a063a9b-81f0-0310-95a4-ce76da25c4cd
After [36053] don't show a warning about something users can't change
because there's no control exposed in the UI for that. The Revisions
screen is probably a better place to show a more complete information.
Fixes#35029.
Built from https://develop.svn.wordpress.org/trunk@36612
git-svn-id: http://core.svn.wordpress.org/trunk@36579 1a063a9b-81f0-0310-95a4-ce76da25c4cd
Although it may seem counterintuitive at first, in very limited cases it's
better to remove improper semantics (this is not a tabular data table) in
order to reduce noise for screen reader users and simplify all the things.
Also improves headings to better separate sections.
Fixes#34780.
Built from https://develop.svn.wordpress.org/trunk@36477
git-svn-id: http://core.svn.wordpress.org/trunk@36444 1a063a9b-81f0-0310-95a4-ce76da25c4cd
Leads and contributing developers will now look nicer when focused.
Also, combines adjacent image and text links for the same resource thus
simplifying markup and reducing noise for screen reader users.
Props walbo, afercia.
Fixes#34953.
Built from https://develop.svn.wordpress.org/trunk@36406
git-svn-id: http://core.svn.wordpress.org/trunk@36373 1a063a9b-81f0-0310-95a4-ce76da25c4cd
Previously the button was output as a part of the per-page option rendering, inline with that input. While this was appropriate for core's usage, the `screen_settings` filter has allowed plugins to place additional items at the bottom of the panel, which a number take advantage of. This leads to confusing situations where plugins that don't save settings via Ajax either have to add their own button or piggyback onto the existing button, which doesn't make any sense in the flow of additional options. It also hinders core from adding any other options that need to be submitted.
Also, when the screen options panel is open, a submit button there is the primary action at that moment. The "Apply" button also does a full page load, which a primary button indicates better.
fixes#34295. see #22222, #23738.
Built from https://develop.svn.wordpress.org/trunk@35161
git-svn-id: http://core.svn.wordpress.org/trunk@35127 1a063a9b-81f0-0310-95a4-ce76da25c4cd
These H5 (heading level 5) don't allow for a good headings hierarchy and shouldn't be headings in the first place. Each group of options has now its own fieldset and legend.
In `render_screen_options()`, introduce two new "render" methods: `render_meta_boxes_preferences()` and `render_list_table_columns_preferences()` for consistency with already existing render methods and cleaner code.
Props joedolson, afercia.
Fixes#33646.
Built from https://develop.svn.wordpress.org/trunk@34991
git-svn-id: http://core.svn.wordpress.org/trunk@34956 1a063a9b-81f0-0310-95a4-ce76da25c4cd
Normally when there are multiple comma-separated values in CSS, each one would go on its own indented line. However, Autoprefixer appears to be tripping up on gradients at the moment, so it's going to stay on one line until we investigate upstream.
see #33299.
Built from https://develop.svn.wordpress.org/trunk@34637
git-svn-id: http://core.svn.wordpress.org/trunk@34601 1a063a9b-81f0-0310-95a4-ce76da25c4cd
These colored backgrounds can be accessed by adding the `.notice-alt` class to a notice.
There is also now a large version when using the `.notice-large` class, and a `.notice-title` class that is appropriate for headline text within a large notice.
props paulwilde, hugobaeta, melchoyce.
fixes#32244.
Built from https://develop.svn.wordpress.org/trunk@34365
git-svn-id: http://core.svn.wordpress.org/trunk@34329 1a063a9b-81f0-0310-95a4-ce76da25c4cd
First step towards restoring a good heading structure in wp-admin.
The previous `<h1>` contained the site title and a link to the front page and was removed with the toolbar refactoring in 3.2.
Props joedolson, afercia.
Fixes#31650.
Built from https://develop.svn.wordpress.org/trunk@32974
git-svn-id: http://core.svn.wordpress.org/trunk@32945 1a063a9b-81f0-0310-95a4-ce76da25c4cd
These no longer return upon refreshing the page when JS is on and working, so users should be able to dismiss them. This is particularly important on the post edit screen when DFW is triggered, but pretty much all notices can be dismissed if needed. A post on Make/Core will follow with information on how this can be leveraged in plugins.
props valendesigns, afercia, paulwilde, adamsilverstein, helen.
fixes#31233. see #23367.
Built from https://develop.svn.wordpress.org/trunk@31973
git-svn-id: http://core.svn.wordpress.org/trunk@31952 1a063a9b-81f0-0310-95a4-ce76da25c4cd
- Add the styling for the replacement images to the admin CSS.
- Revert to using `.emoji` as replacement image class.
- When pasting in the editor, convert emoji images to our format so we can replace them with chars on saving.
- Some more clean up of both the plugin and wp-emoji.js.
See #31242.
Built from https://develop.svn.wordpress.org/trunk@31786
git-svn-id: http://core.svn.wordpress.org/trunk@31766 1a063a9b-81f0-0310-95a4-ce76da25c4cd
Previously the label just said "Posts", "Pages", or "Comments". This was bad in terms of accessibility and internationalization because of missing context.
This change adds a default label "Number of items per page:" to `WP_Screen->render_per_page_options()` and removes all the existing one-word labels.
props afercia.
fixes#31349, #15576.
Built from https://develop.svn.wordpress.org/trunk@31696
git-svn-id: http://core.svn.wordpress.org/trunk@31677 1a063a9b-81f0-0310-95a4-ce76da25c4cd
Attempting to moderate comments without context about the post is more difficult than necessary. The comment moderation screen you are sent to via email link was also in need of some better visual treatment.
props thaicloud, seanchayes, adamsilverstein.
see #23988.
Built from https://develop.svn.wordpress.org/trunk@31641
git-svn-id: http://core.svn.wordpress.org/trunk@31622 1a063a9b-81f0-0310-95a4-ce76da25c4cd
CSSJanus (introduced in [26107]), we had a great time with you, but sadly you don't like our fancy CSS.
RTLCSS is a framework for converting CSS from LTR to RTL, same as CSSJanus, with support for more CSS properties like `transform`, `transition` or multiple box and text shadows.
Changes:
* devDependencies: Remove `grunt-cssjanus`, add `grunt-rtlcss`.
* RTLCSS uses `/* rtl:ignore */` to ignore a rule, switch existing `/* @noflip */` to the new directive.
* RTLCSS supports the `transform` property, means we can remove some ignore rules.
* RTLCSS supports string maps for custom replace rules. This commit includes a rule `import-rtl-stylesheet` which replaces ".css" with "-rtl.css" in URLs.
Notes for core development:
* The file generation task is still `grunt rtl`.
* If you have used `grunt cssjanus` before, use `grunt rtlcss` now.
* Remember the new directive `/* rtl:ignore */`.
fixes#31332.
Build: https://build.trac.wordpress.org/changeset/31554
Built from https://develop.svn.wordpress.org/trunk@31573
git-svn-id: http://core.svn.wordpress.org/trunk@31554 1a063a9b-81f0-0310-95a4-ce76da25c4cd
Note that this does not fix issues related to comment quick edit. Internal linking also continues to use the `.alternate` class for now. IE8 and below gracefully degrade by not having zebra striping.
There is some hoop jumping with adding an extra table row to maintain zebra striping during quick edit. Documenting that here for future reference; it is also in the inline documentation.
fixes#30981 and #26060. see #25060.
Built from https://develop.svn.wordpress.org/trunk@31181
git-svn-id: http://core.svn.wordpress.org/trunk@31162 1a063a9b-81f0-0310-95a4-ce76da25c4cd
There is now a base class of `notice`, with additional classes of `notice-success`, `notice-warning`, `notice-error`, and a new blue `notice-info`.
Also corrects some misleading notice colors, such as plugin tested up to warnings and login messages.
props avryl, melchoyce.
fixes#27418.
Built from https://develop.svn.wordpress.org/trunk@30505
git-svn-id: http://core.svn.wordpress.org/trunk@30494 1a063a9b-81f0-0310-95a4-ce76da25c4cd
* Scroll all content, rather than the dual-pane scrolling awkwardness.
* Better align the header image and title overlay with the display on WordPress.org, at least at full-width.
* Move the close button outside of the modal itself, rather than overlay on top of colors we can't predict.
props stephdau, tellyworth, helen. fixes#27440.
Built from https://develop.svn.wordpress.org/trunk@29474
git-svn-id: http://core.svn.wordpress.org/trunk@29252 1a063a9b-81f0-0310-95a4-ce76da25c4cd
* Whitespace/braces cleanup for [29040].
* Reduce width of modal to 792px, which is the default banner size.
* Reduce banner height when screen height is smaller than 500px.
* Remove inline CSS.
* Re-use tab var in JS.
* Encode ampersands in links.
props avryl, michalzuber, ocean90.
see #27440.
Built from https://develop.svn.wordpress.org/trunk@29125
git-svn-id: http://core.svn.wordpress.org/trunk@28910 1a063a9b-81f0-0310-95a4-ce76da25c4cd
* Make sure the background color for tools is only applied to the main editor.
* Fix toolbar width for smaller screens.
* Ensure toolbar doesn't end up in a weird place when scrolling down too fast.
* Avoid JS errors for post types that don't support the editor.
props avryl. see #28328.
Built from https://develop.svn.wordpress.org/trunk@29075
git-svn-id: http://core.svn.wordpress.org/trunk@28861 1a063a9b-81f0-0310-95a4-ce76da25c4cd
The admin CSS was merged in #18314.
After a couple years as it stood,
The mess it had become just was no good.
One day we realized Grunt is pretty cool,
And said "we should use this as our build tool!"
Now we can maintain separate files with ease,
Using @import and cssmin meets all our needs.
Welcome to the future of the WordPress stylesheets,
And thanks to Slick Rick for the beats.
props jorbin for the initial patch.
fixes#26669.
Built from https://develop.svn.wordpress.org/trunk@27195
git-svn-id: http://core.svn.wordpress.org/trunk@27054 1a063a9b-81f0-0310-95a4-ce76da25c4cd