enterprise icon indicating copy to clipboard operation
enterprise copied to clipboard

Tabs Module: Missing category border when focusing searchfield

Open s-werking opened this issue 2 years ago • 6 comments

Describe the bug When the searchfield or category dropdown is focused, the searchfield shifts and the category dropdown's border is hidden.

To Reproduce Steps to reproduce the behavior:

  1. Go to http://localhost:4000/components/tabs-module/example-category-searchfield-go-button.html
  2. Click on the searchfield Note that the searchfield is slightly larger and the category dropdown's border is hidden.
  3. Click anywhere on the page to cause the searchfield to go back to normal
  4. Click on the category dropdown Note that the searchfield is slightly larger and the category dropdown's border is hidden again.

Expected behavior When clicking on the category button or searchfield, the category dropdown border should still be visible and the searchfield should remain the same size.

Version

  • ids-enterprise: 4.64.0-dev

Screenshots image

Platform

  • Infor Application/Team Name: lawson
  • OS Version: Windows 11
  • Browser Name: chrome
  • Browser Version: 103.0.5060.66 (Official Build) (64-bit)

Additional context On initial load of our home page we focus the searchfield which shows the issue, so this issue is a higher priority for us. Thanks!

s-werking avatar Jul 01 '22 13:07 s-werking

cc @ericangeles @s-werking yes i see the issue (doesn't look that great). Will fix it next sprint. We can patch this just remind me if i forget and i can patch it where you need.

tmcconechy avatar Jul 01 '22 13:07 tmcconechy

Sounds good, thanks @tmcconechy

s-werking avatar Jul 01 '22 13:07 s-werking

QA tested and the bug is already fixed. However, the width of the search text box shrinks upon typing.

https://main-enterprise.demo.design.infor.com/components/tabs-module/example-category-searchfield-go-button.html

https://user-images.githubusercontent.com/102151352/181701762-51ef7787-3727-4382-a6c3-547dc3098466.mov

glenlieorillo avatar Jul 29 '22 07:07 glenlieorillo

Would it be possible to fix this and https://github.com/infor-design/enterprise/issues/6686? The seachfield is the main source of navigation for our product and the first thing we focus when people log in. These visual issues in the search leave a bad impression and although considered minor, they give the product a bad look and feel from the start.

awbuboltz avatar Aug 03 '22 18:08 awbuboltz

We do have this fixed (minus one failed issue) but the other issue came in after so it will be fixed this coming new sprint. But once they are all fixed we can put together a patch

tmcconechy avatar Aug 03 '22 18:08 tmcconechy

Cool, thanks Tim. I didn't actually see that you moved #6686 right before my comment.

awbuboltz avatar Aug 03 '22 18:08 awbuboltz