WordPress.org

Make WordPress Core

Opened 6 months ago

Closed 6 months ago

#40767 closed enhancement (fixed)

Visual update for TinyMCE format boundaries

Reported by: matveb Owned by: matveb
Milestone: 4.8 Priority: normal
Severity: normal Version: 4.8
Component: TinyMCE Keywords: needs-testing
Focuses: Cc:

Description

In 4.8 we are introducing a new version of TinyMCE that allows more intuitive positioning of the cursor within inline text elements. By default, TinyMCE doesn't provide much in the way of styling, so we are tweaking the appearance of the boundaries in our custom theme.

props @joen

Attachments (2)

40767.diff (936 bytes) - added by matveb 6 months ago.
link-boundaries.png (17.0 KB) - added by matveb 6 months ago.

Download all attachments as: .zip

Change History (5)

@matveb
6 months ago

This ticket was mentioned in Slack in #core by matias. View the logs.


6 months ago

#2 @azaozz
6 months ago

  • Keywords needs-testing added
  • Milestone changed from Awaiting Review to 4.8

This may need more extensive testing as in some cases the styling can interfere with the caret/cursor in contentEditable (things like margin and padding).

Tested in latest Chrome, Firefox, Edge and IE11 and all seems to work well. However will need testing on touch devices, most importantly on devices that have mouse, touch screen, and keyboard like Surface laptops or iPads with Bluetooth keyboards.

Last edited 6 months ago by azaozz (previous) (diff)

#3 @matveb
6 months ago

  • Owner set to matveb
  • Resolution set to fixed
  • Status changed from new to closed

In 40783:

TinyMCE: Provide styles for link and code boundaries.

The new version of TinyMCE introduces a cursor-boundary feature for some formatting elements but, by default, it does not provide much in the way of styles. This tweaks their appearance in the WordPress custom skin to match the intended design of the feature.

Props joen.
Fixes #40767.

Note: See TracTickets for help on using tickets.