DUPLICATE: SVG icon not displaying in filter-search element

Bugs
1

Browser: Chrome 110
OS: macOS / Windows / Linux / etc.
URL: Link to a page that illustrates this issue
Video: Short screen recording that illustrates this issue (free tool: jam.dev)

Hello,

I tried to use an SVG icon for the clear button in the filter-search element, but the svg icon looks too small. Am I doing something wrong? On the bricks website, the SVG icon displays fine in the ideas search page.

2

Hi @Victor1999,

can you check if it’s because you have “padding” defined, just like it was the case here: WIP: The SVG icon size in the clear button of the Filter - Search element does not work as expected

If it was, then I’ll close this topic and mark it as duplicate. We do have a solution prepared locally, to fix this.

Best regards,
Matej

3

Hello @Matej,

Yes, it’s precisely because of the padding. In future versions, do you suggest using custom css, or will controls be added to more precisely control the clear icon?

Honestly, I think it would be much better if SVG had no padding and height by default. On the other hand, in the filter-search > Icon ( Clear ) element we had position control to have more complete control over the icon. The existing height and padding only affect the svg icon and if they are not present, there is no problem. Do you agree?

Best regards

4

Hi @Victor1999,

thanks for confirming. In this case, I’m closing this topic and marking it as a duplicate. We will update the topic that I’ve linked above.

We do have a fix already prepared locally, so we should be fixed in the next version. We will not apply a padding on SVG icons, but a margin one.

Best regards,
Matej

1 Like