added recharge

client/cryps.css

@@ -717,6 +717,27 @@ CRYP DAMAGE
     border-top: 3px solid green;
 }
 
+.cryp-box.purple-damage {
+    filter: drop-shadow(0 0 0.2em purple);
+    border-width: 5px;
+    color: purple;
+    border-color: purple;
+}
+
+.purple-damage button {
+    border: 3px solid purple;
+    color: purple;
+}
+
+.purple-damage text {
+    fill: purple;
+}
+
+.purple-damage .stats {
+    border-top: 3px solid purple;
+}
+
+
 /*
     MOBILE
 */

client/src/utils.jsx

@@ -181,6 +181,15 @@ function eventClasses(resolution, cryp) {
 
     if (type === 'Recharge') {
         const { skill, red, blue } = event;
+        if (source && startSkill) return 'active-skill';
+        if (target && endSkill) return 'active-skill';
+        if (target && postSkill) {
+            cryp.red_life.value += red;
+            cryp.blue_life.value += blue;
+            if (red > 0 && blue > 0) return 'purple-damage';
+            if (red > 0) return 'red-damage';
+            if (blue > 0) return 'blue-damage';
+        }
     }
 
     if (type === 'Evasion') {
@@ -272,6 +281,14 @@ function getCombatText(cryp, resolution) {
         if (postSkill && target) return `+ ${effect} ${duration}T`;
     }
 
+    if (type === 'Recharge') {
+        const { skill, red, blue } = event;
+        if (startSkill && source) return `${skill}`;
+        if (endSkill && target) return `${skill}`;
+        if (postSkill && target) return `+${red}R ${blue}B`;
+    }
+
+
     if (type === 'Removal') {
         const { effect } = event;
         if (postSkill && target) return `- ${effect}`;