fix(exercise): call init after some delay

client/src/components/kmap-exercise-card.ts

@@ -16,7 +16,7 @@ import {KMapTestCardContent} from "./kmap-test-card-content";
 import {KMapFeedback} from "./kmap-feedback";
 
 @customElement('kmap-exercise-card')
-export class KMapRandomTestCard extends Connected {
+export class KMapExerciseCard extends Connected {
   @property({type: String})
   private _instance: string = '';
   @property({type: String})
@@ -125,7 +125,7 @@ export class KMapRandomTestCard extends Connected {
         }
 
         .blink {
-          animation: blinker .2s ease-in-out 2;
+          animation: blinker .25s ease-in-out 2;
         }
         @keyframes blinker {
           70% {

client/src/components/kmap-exercise.ts

@@ -1,5 +1,5 @@
-import {css, html} from 'lit';
-import {customElement, state} from 'lit/decorators.js';
+import {css, html, PropertyValues} from 'lit';
+import {customElement, state, query} from 'lit/decorators.js';
 import {Connected, store} from "./connected";
 import {State} from "../store";
 
@@ -13,18 +13,30 @@ import './kmap-exercise-card';
 import {resetStyles, colorStyles, fontStyles} from "./kmap-styles";
 import {Test} from "../models/tests";
 import {encodePath} from "../urls";
+import {KMapExerciseCard} from "./kmap-exercise-card";
 
 @customElement('kmap-exercise')
 export class KMapExercise extends Connected {
   @state()
   private _test?: Test;
 
+  @query('kmap-exercise-card')
+  private _testElement: KMapExerciseCard;
+
   mapState(state: State) {
     return {
       _test: state.exercises.test,
     };
   }
 
+  protected updated(_changedProperties: PropertyValues) {
+    if (_changedProperties.has("_test") && this._test)
+      setTimeout(() => {
+        this._testElement!.init();
+      }
+      , 500)
+  }
+
   _more() {
     if (this._test === undefined) return;
 

client/src/components/kmap-test-card.ts

@@ -220,8 +220,9 @@ export class KMapTestCard extends Connected {
           animation: blinker .25s ease-in-out 2;
         }
         @keyframes blinker {
-          50% {
-            transform: scale(1.2);
+          70% {
+            text-shadow: 1px 1px 4px var(--color-darkgray);
+            transform: scale(1.1);
             color: var(--color-secondary-dark)
           }
         }