[wp-trac] [WordPress Trac] #60075: Heading-Level Tooltip prevents from selecting a level

[WordPress Trac]

#60075: Heading-Level Tooltip prevents from selecting a level
--------------------------+------------------------------
 Reporter:  ekesto        |       Owner:  (none)
     Type:  defect (bug)  |      Status:  new
 Priority:  normal        |   Milestone:  Awaiting Review
Component:  Editor        |     Version:  6.4.2
 Severity:  normal        |  Resolution:
 Keywords:                |     Focuses:
--------------------------+------------------------------

Comment (by ygylyvoqagu1986):

 Thank you for bringing this issue to our attention. The problem you're
 encountering with the Heading-Level Tooltip overlaying the next level,
 thus preventing it from being clickable or selectable, can indeed be
 frustrating and hinder the user experience, particularly when trying to
 edit content in WordPress.

 Based on the screenshot you provided, it appears that the Heading-Level
 Tooltip, which typically appears when you hover over a heading element in
 the WordPress block editor (Gutenberg), is overlapping with the next
 heading level option. This overlap occurs when the tooltip extends beyond
 the boundary of the heading block, making it difficult or impossible to
 select the desired heading level.

 To address this issue and improve usability, there are a few potential
 solutions that could be considered:

 1. **Adjust Tooltip Positioning**: One approach is to adjust the
 positioning of the Heading-Level Tooltip so that it appears either above
 or below the heading block, rather than overlapping with adjacent
 elements. This can be achieved through CSS modifications or adjustments to
 the tooltip functionality in the WordPress editor.

 2. **Increase Spacing Between Options**: Another solution is to increase
 the spacing between heading level options in the tooltip menu. By adding
 more whitespace between each option, it reduces the likelihood of overlap
 and makes it easier for users to select the desired heading level without
 interference from adjacent elements.

 3. **Customize Tooltip Behavior**: WordPress provides developers with the
 ability to customize and extend the functionality of the block editor
 through plugins or custom code. It may be possible to create a custom
 tooltip component or modify the existing tooltip behavior to ensure it
 behaves more predictably and doesn't obstruct adjacent elements.

 4. **Temporary Hide Tooltip**: Alternatively, the tooltip could be
 temporarily hidden when the user hovers over a heading block, allowing
 them to freely select the desired heading level without any interference.
 Once the user finishes making their selection or moves their cursor away
 from the heading block, the tooltip could then reappear.

 5. **Provide Keyboard Shortcut**: In addition to relying on the tooltip
 for changing heading levels, WordPress could also offer a keyboard
 shortcut or alternative method for quickly adjusting the heading level.
 This provides users with an additional option for making changes without
 relying solely on mouse interactions.

 Implementing any of these solutions would likely improve the user
 experience and address the issue of the Heading-Level Tooltip overlaying
 the next level, thus ensuring that users can easily select the desired
 heading level without any hindrance. Thank you again for bringing this
 issue to our attention, and we hope that these suggestions prove helpful
 in resolving the problem.

-- 
Ticket URL: <https://core.trac.wordpress.org/ticket/60075#comment:2>
WordPress Trac <https://core.trac.wordpress.org/>
WordPress publishing platform