Navigation with own images

0
i tried to change the Glyphicons to own images (png, svg) I can use sqare format with 32x32, 64x64 even with bigger width than high it is always the same, the image is not centered but the glyph looks fine.    Does anybody know how to set the custom image looks like the glyph? I found another post, but the solution 50x50 doesn’t work.. https://community.mendix.com/link/space/studio%20pro/questions/119316   has someone a solution for this..   thanks
asked
4 answers
0



This is an example, the google image is acting the same way as the other icons.

answered
1

Ok i added a new class an referenced the class of navigationtree to my own class.

Now the image looks fine and styling is save.

 

Thanks for your help!

Torsten

answered
0

Hi Torsten,

What i think happens is the following, when you choose an image and not a glyphicon, it will change the css as well. 

You can try to use the glyphicon class and add that to the image as a class name i.e.
<img class="glyphicon”>

Or you can add the same css that is used for glyphicon in Mendix and add that to your image.

The css properties for a glyph icon are as follows:

    display: flex;
    align-items: center;
    justify-content: center;
    width: 52px;
    height: 52px;
    padding: 16px 16px;
    border-radius: 4px;

I did change the padding, you can play around with these settings to make it act the same way a icon use to work in your navbar.

answered
0

Hi Armand,

thanks for your quick reply.

Based on my my layout i have to change the class region-sidebar.

I am using a webresponsive layout but dont know where to set this best.

Don’t want to add it in code which will be resetted when updating studio pro in further times?

Can you give me a hint?

answered