diff --git a/client/instance.css b/client/instance.css index d2064c61..978ce740 100644 --- a/client/instance.css +++ b/client/instance.css @@ -379,6 +379,23 @@ button.equip { text-align: center; } +.equip-spec { + animation: equip-spec 1s infinite ease-in-out alternate; +} + +@keyframes equip-spec { + 0% { + color: #333; + stroke: #333; + } + + 100% { + color: #7a7a7a; + stroke: #7a7a7a; + + } +} + .instance-equip .specs figcaption { font-size: 75%; diff --git a/client/src/components/instance.cryps.jsx b/client/src/components/instance.cryps.jsx index c2c18ae3..7ff64a87 100644 --- a/client/src/components/instance.cryps.jsx +++ b/client/src/components/instance.cryps.jsx @@ -108,9 +108,10 @@ function Cryp(props) { } if (!s) { + const equip = specList.includes(vbox.bound[activeVar]) ? 'equip-spec' : 'gray'; return ( -
- {shapes.diamond('stat-icon gray')} +
+ {shapes.diamond(`stat-icon ${equip}`)}
 
);