Achieve blink on Thingworx grid cell

[KN_13694616]

Hi,

Thingworx version : 9.6.1

I am trying to set blinking of red color on thingworx grid based on a value for a particular column value.

I used State definition to achieve the same.

I created style definition using media entity and for media entity I used GIF for image.

But GIF moved to label the to an extent that it became invisible.

I have uploaded GridBlink image which shows red color but it is actually blinking and CSS from developer tools which shows the label inside column when width is reduced to 5%.

But when this css is used directly as custom css, It is not working. Have uploaded css also.

My requirement is to have blinking red color for a grid column and the label value should be appearing while blinking. Kindly suggest me how to achieve this

[Constantine]

Hi,

Maybe CSS animations will work better for you than a GIF background? See https://cargo2support.cargo.site/Make-Something-Blink

Of course, you'll still need to figure out how to apply a custom CSS to a cell.

/ Constantine

[KN_13694616]

I tried but unable to set blink on Grid cells based on condition using css animations. Kindly help me with the code/logic to achieve the same for rendering the blink based on condition over grid cells.

[nmutter]

just to let you know that I tried to achieve what you want but also failed. I could not select the grid cells via css selector - as they are hidden in nested dom shadow-root elements which are not exposed.

Edit: I just found from another community post on how to apply custom css to nested shadow-roots: https://www.ptc.com/en/support/article/CS377455?as=1  Maybe this could help. I may try again

Edit2: it works - I attached sample mashup:

 

Check the "Custom CSS" tab. Also I used custom state formatting as selector for the cells (so only cells which have isSystemObject=true currently blink). customize as needed.

(Scrolling in grid causes different timings in css animation for each cell - you might want to look into this :P)

Nice - I learned something!

[Constantine]

Bookmarked!

[PEHOWE]

Hello @KN_13694616 ,
I have also looked for several different approaches to get a CSS blink. 
Nothing identified worked.
I would suggest that you post a suggestion on the group for product upgrades.

Regards,

Peter