Skip to content

NUX tips: Close button tooltip partially hidden on some tips #7562

Description

@afercia

When the "new user experience" tips are displayed, the tips Close button tooltip is partially hidden in some tips. To reproduce, for example in Chrome:

  • go to the Add New post page
  • open the Chrome dev tools > Application > Storage > Local storage, and delete the entry "GUTENBERG_NUX_1" if any Edit: the storage mechanism has changed, you need now to clear the whole Gutenberg storage entry
  • refresh the page
  • the first tip should appear
  • tab to or mouse over the Close button
  • the button tooltip appears and it's fully visible:

screen shot 2018-06-27 at 11 44 39

  • click on "See next tip" to go to the following tips
  • tab to or mouse over the Close button
  • the tooltip is partially hidden behind the tip
  • worth also noting the tooltip appears in the same place where the "pulsing dot" is

screen shot 2018-06-27 at 11 44 52

screen shot 2018-06-27 at 11 45 05

Worth noting the tooltip position is dynamically calculated to stay within the viewport, and that seems to work correctly. However, seems there's something wrong with the z-index. Not sure why when the popover takes the is-bottom class it gets a lower z-index.

.components-popover:not(.is-mobile).is-bottom {
    top: 100%;
    z-index: 99990;
}

However, I guess the whole position of the tip should be reviewed, because the tooltip position conflicts with the pulsing dot.

Metadata

Metadata

Assignees

No one assigned

    Labels

    [Feature] NUXAnything that impacts the new user experience[Type] BugAn existing feature does not function as intended

    Type

    No type
    No fields configured for issues without a type.

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions