Jump to content

Unibutton, image in svg file


markokas

Recommended Posts

Hi all,

I would lie to use files/test.svg file as image.

How to assign svg file to button.

I try to make new item in ImageList, and define IconCls in server css. I can see image but somehow fill color not accepted  (is black instead green)...

what's wrong, or some other approach to change attributes of svg image?

Thank's in advance,

Marko.

 

 

 

27-03-2021 13-41-21.png

27-03-2021 13-47-13.png

27-03-2021 13-46-19.png

Link to comment
Share on other sites

  • 4 weeks later...

 

I tried,  I can see svg icon on UnimButton, but it looks that attributes/style color, fill not accepted.

Allways get black color.

function beforeInit(sender, config)
{
  config.icon ="/files/test.svg";
  config.style='stroke:red; fill: green; color:red;  stop-color :red; flood-color:red;lighting-color:red;'
}

Thanks in advance fro any hint :)

 

Br, Marko

 

 

22-04-2021 13-06-48.png

Link to comment
Share on other sites

  • 10 months later...
On 4/22/2021 at 4:10 PM, markokas said:

Thanks in advance fro any hint :)

Sorry for the late reply.

17 hours ago, Allen said:

Is there a solution to this or will these always have to be black?

Do you have a simple testcase to check?

Link to comment
Share on other sites

Sherzod;

I have arrived at the following as a solution for this, not sure if this is the best resolution however this is working for me.

.btnEditIcon {
  background-size: 14px auto;
  background-image: url("files/images/edit.svg"); 
  filter: invert(13%) sepia(100%) saturate(6101%) hue-rotate(345deg) brightness(97%) contrast(97%);
}

I used this online resource to convert a color to a filter.  Quick note, the filter is predicated on the svg image being black (or at least known.

-Allen

Link to comment
Share on other sites

Please sign in to comment

You will be able to leave a comment after signing in



Sign In Now
×
×
  • Create New...