Datagrid: Clear filter icon for a lookup is rendered to high when using the new theme

[claudenbach]

Describe the bug:
The clear filter icon for a lookup is rendered to high in the filter row when using the new theme. Placement of the icon is correct when using the classic theme.

Steps to reproduce the behavior:

1. Go to 'https://master-enterprise.demo.design.infor.com/components/datagrid/test-lookup-filter'
2. Ensure the theme is set to New
3. Enter a value in the Product Id filter row
4. Notice that the clear icon is rendered to high

Expected behavior:
Icons in the filter row for a lookup are aligned.

Version

• ids-enterprise: v4.51.0-dev

[claudenbach]

[tmcconechy]

@claudenbach i dont think this a bug anymore we renamed master to main so the latest link is now https://main-enterprise.demo.design.infor.com/components/datagrid/test-lookup-filter

Master is now from some older point in time

[claudenbach]

Okay. So Landmark is seeing the icon rendered to high. Is there something that we need to change then? We recently moved to 4.51.

[claudenbach]

Seem to be using the correct scss file....

[claudenbach]

On the main-enterprise.demo.design.info, I'm seeing the following when using classic theme...

[tmcconechy]

I see the issue on classic theme but i cant say what the issue is on your side? But i can address that.

[claudenbach]

If I change the row height to extra-small, I'm seeing the issue on main with the new theme.

[claudenbach]

See the issue when the row height is small or extra-small and use the new theme.

[tmcconechy]

Adding this one to the current sprint as well. Can you have a look @ericangeles ?

[ericangeles]

@tmcconechy will do.

[janahintal]

Failing in https://4520-beta0-enterprise.demo.design.infor.com/components/datagrid/test-lookup-filter

The text in lookup field becomes empty after changing the row size, thus I'm unable to check if the icons are aligned already after changing the row size.

• Go to https://4520-beta0-enterprise.demo.design.infor.com/components/datagrid/test-lookup-filter
• Then open the lookup on Product Id
• Select any Product to trigger the clear filter icon
• Then change the row height to Extra Small
• Notice that the lookup field went empty

[ericangeles]

I would say, this is another separate bug. The close icon gets disappeared because the lookup field is empty. There's a class that adds to the close icon that does not make it display, though the position is still correct if you remove the .is-empty in close icon button.

[tmcconechy]

@janahintal yes we saw this as well but decided to skip it because the example is "static". So suggest either ignoring this point or making a separate issue. (i lean to ignoring it as its not really a bug its a demo issue). You can also verify the issue but clicking the lookup in the filter and picking an item after changing the row height.

[janahintal]

Thanks @tmcconechy, this is noted. seems working fine on my end and the icons were aligned already after choosing from the lookup filter. I will now move this ticket to Done.