RadzenAccordionItem change default Icons

Radzen.Blazor Components
1

Hi everybody,

I would want to define the aacordion icon, with my personal images that I have storage in my server. I have storage my images in a folder named /images inside wwroot.I think I have to access the CSS class that controls the icon property and define in the CSS of that class the url where it should read the icon images and also define the type of file to read?
I have three accordion items in which each one contains a different image of my server.
I paste an example that I would like achieve:

Thank you in advanced!

3

Someone has idea?

I would like something like this:

<RadzenAccordionItem Text="favourites sports" Icon="images/icon1.png">

4

Hi @Luar79,

Straightforward use of images is not supported. However, you can set images as a background of the icon element:

  1. Set a Class and an empty Icon string:
<RadzenAccordionItem Text="Favorites Sports" Class="favorites-sports" Icon=" ">
                Details for Favorites Sports
</RadzenAccordionItem>
  1. Add the following CSS:
.favorites-sports i {
    background: url(images/icon1.png);
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
}
1 Like
5

It works! thank you very much!!