want to try this on a custom object, wonder if I can

[journeytosilius]

I am trying to study your code to see if I can do something similar on an experiment I'm doing

What would be the bare minimum to test and keep on developing outside of this module ?

If I get the /card base.css and for example, radiant-holo.css with the correspoding images in /img, how does the card html needs to be in order to get this bare minimum as working example ? Also, would this work without mouse interaction since the source of light seems to be guided by the mouse ? I would like to see if i can do something similar but rotating the object instead of using a mouse

Thanks !

[simeydotme]

hi Chroma :)

The effects work by changing the values of css variables, actually ... the homepage demo shows the first card moving automatically by just animating the variables.

the bare minimum HTML you'll need is what you can see if you right-click -> inspect the demo page. Just copy one of the card elements html and make sure it's inside a relative-positioned parent.

The effects can work simply on hover ( I have a basic css animation set up for animating on mouse over, pure CSS ) which you can see here; https://github.com/simeydotme/pokemon-cards-css/blob/main/public/css/cards/base.css#L67C25-L93 ... you just need to make sure the card does NOT have the class interactive