Umami demo: Tour popup close button hover effect movement

Created on 25 December 2021, over 2 years ago
Updated 21 February 2023, over 1 year ago

Problem/Motivation

In the Umami Demo home page tour, the close button moves slightly when hovering. See screen recording for reference.

Steps to reproduce

  1. Install Drupal using the Umami Demo profile.
  2. Go to the home page.
  3. Click on the Tour link in the upper right.
  4. Hover on the close button of popup.
  5. Result: Close button moves slightly upon hover.
  6. Expected: Button should not move on hover.

Proposed resolution

Adjust the CSS slightly to address.

Remaining tasks

  1. Commit

User interface changes

API changes

Data model changes

Release notes snippet

🐛 Bug report
Status

Fixed

Version

9.5

Component
Umami 

Last updated 4 days ago

Created by

🇮🇳India Gauravvv Delhi, India

Live updates comments and jobs are added and updated live.
Sign in to follow issues

Comments & Activities

Not all content is available!

It's likely this issue predates Contrib.social: some issue and comment data are missing.

  • 🇺🇸United States xjm

    Thanks everyone for great, thorough work here! I'm saving the issue credits, so taking some notes about who is credited and how, and advice for contributors.

    1. Crediting @Gauravmahlawat for the original issue report, the original patch. and work on it since.
       

    2. Creditng @lauriii for committer review.
       

    3. Crediting @vulcanr and @ameymudras for coming up with a new implementation based on @lauriii's feedback.
       

    4. Crediting @Satyajit1990 for the original video demonstrating the bug. I had to slow it to half speed and zoom in on the element, but I finally saw the "wiggle" in the before screenshots. Thanks for that manual testing! Next time, I would suggest cropping your video to only the affected portion of the screen so it's easier for reviews to understand and see.
      nbsp;

    5. For @DeepaliJ: Thank you for reviewing this issue!

      Your before-and-after videos in #19 were helpful for me to understand the bug. Same advice as above; please crop them to only the affected portion of the screen. Thanks

      Also, regarding #22, the automated testing infrastructure tells us whether the change set still applies, so we do not need people to review that. It is also not sufficient criteria for the issue to be marked "Reviewed and Tested by the Community".

      What we do need people to review is whether the issue has a correct scope , whether it passes the core gates , whether the solution completely fixes the problem without introducing other problems, and whether it's the best solution we can come up with. See the patch review guide for more information.

      When you do post a review, be sure to describe what you reviewed and how with more specific details and steps. This helps other reviewers understand why you considered the issue RTBC (and is considered for issue credit). \

      Also see the issue credit guidelines for more information on which kinds of contributions are credited. In this case, you are still getting credit for the manual testing. 🙂
       

    6. A reminder for @Kristen Pol to embed your UI changes screenshots in the issue summary. 🙂 Credited for manual testing and mentoring on the issue.
       

    7. @gaurav-mathur, your comment just repeated automated testing that had been done by @DeepaliJ on the exact same patch, weeks after they did that work. That's a duplicate effort that adds noise to issues. So I am not crediting it. In the future, I suggest reading existing comments thoroughly and paying close attention to the next steps to receive credit.

    I think this issue should have a final review from one of the frontend framework managers before it goes in to make sure it's the right approach, but I wanted to save time for them by taking care of the issue credit processing part of the review. 🙂

  • 🇺🇸United States xjm

    Hm I see, @Kristen Pol's screenshot was not of the correct UI element. Removing from summary. Sorry for the noise!

  • Status changed to Needs work over 1 year ago
  • 🇺🇸United States bnjmnm Ann Arbor, MI

    #21 adds an unwanted white border around the close button. A transparent border would probably work, though.

  • Status changed to Needs review over 1 year ago
  • 🇮🇳India Gauravvv Delhi, India

    Addressed #26. Attached patch along with interdiff. please review

  • Status changed to Needs work over 1 year ago
  • 🇺🇸United States smustgrave

    Would be useful to have before/after screenshots in the issue summary.

  • Status changed to Needs review over 1 year ago
  • 🇮🇳India Gauravvv Delhi, India

    Attached before patch and after patch mov clips. please review

  • Status changed to RTBC over 1 year ago
  • 🇺🇸United States smustgrave

    Thanks @Gauravvv!

  • 🇮🇳India Gauravvv Delhi, India

    Restoring status, unrelated failure.

    • lauriii committed 2295e6ed on 10.1.x
      Issue #3256002 by Gauravvv, ameymudras, vulcanr, DeepaliJ, Satyajit1990...
    • lauriii committed ad79e8ca on 10.0.x
      Issue #3256002 by Gauravvv, ameymudras, vulcanr, DeepaliJ, Satyajit1990...
  • 🇫🇮Finland lauriii Finland

    Looks like I adviced against the transparent border in #11. As a second thought, it seems fine to have the transparent border appear in forced colors mode since it's a button.

    Committed 2295e6e and pushed to 10.1.x. Cherry-picked to 10.0.x and 9.5.x. Thanks!

  • Status changed to Fixed over 1 year ago
    • lauriii committed 152c4236 on 9.5.x
      Issue #3256002 by Gauravvv, ameymudras, vulcanr, DeepaliJ, Satyajit1990...
Production build 0.71.5 2024