SOLVED: Custom svg icon in nestable nav item getting styles from item itself

Bugs
1

If you add a menu item to the nestable nav (in my case a dropdown, without a link on it) and then add a custom svg as icon, the svg ends up having the same class as the dropdown trigger:

icon-bug-02
icon-bug-021154×696 258 KB

This means, any styles applied to the trigger will also get applied to the svg, like the bottom border in the example above.

2

Hi Manc,
Thanks so much for your report!

I see that the class is also added to the SVG so that it can accommodate various styles such as colors etc… However, I cannot reproduce the underline problem :thinking:

Would you be so kind as to provide a live link and a screencast using https://birdeatsbug.com or https://jam.dev showing and explaining what’s going on? Please use one of the tools mentioned, because they log every single step, making it possible to reproduce the issue.

Best regards,
timmse

3

Sure thing, here you go. Hope the vid makes it a bit clearer what I mean :slight_smile:

https://jam.dev/c/837db143-e73a-44a3-af20-62702775e28d

This is the wrapper

<div id="brxe-bzpeaw" data-script-id="bzpeaw" class="brxe-dropdown brand-menu-trigger mm">

This is the svg when choosing a custom svg as icon

<svg class="brxe-dropdown brand-menu-trigger" data-script-id="bzpeaw" id="brxe-bzpeaw"...>

Both get the same ID and classes, so the styles set on the menu item, end up being applied on the svg as well.

Here is a link to the site, gotta check on mobile in inspector. Ignore everything else on the site it’s heavily WIP haha
https://wordpress-935317-3419213.cloudwaysapps.com/

4

Aaaah, now I see.
The problem is caused by the ID, not the class. Generally, an ID may only occur once, so it is clearly a bug :slight_smile:

image

Best regards,
timmse

5

Yep, didn’t notice the duplicate ID before today either. Still think the classes should also be considered cause if styling is made on a class applied to the dropdown toggle, it’ll still also apply to the icon. Basically unique Id and classes for the custom icon and all good :slight_smile:

6

Hi Martin,

We’ve fixed this issue in Bricks 1.8 beta 2, now available as a manual download in your account.

Please let us know if you are still experiencing issues.

As with any beta release, please do not use it on any production/live website. It is only meant for testing in a local/staging environment.

1 Like