diff --git a/components/basecomponents/QuizGame/ImageContainer.tsx b/components/basecomponents/QuizGame/ImageContainer.tsx index 39f56b93..e6c9aaa8 100644 --- a/components/basecomponents/QuizGame/ImageContainer.tsx +++ b/components/basecomponents/QuizGame/ImageContainer.tsx @@ -31,6 +31,7 @@ const ImageContainer = ({ phrase, onClick, correct, disabled }: ImageContainerPr > ); diff --git a/components/basecomponents/QuizGame/imageStyle.module.css b/components/basecomponents/QuizGame/imageStyle.module.css index bb6fe81d..07df76ee 100644 --- a/components/basecomponents/QuizGame/imageStyle.module.css +++ b/components/basecomponents/QuizGame/imageStyle.module.css @@ -51,9 +51,29 @@ } .match { - animation: dance 0.7s, shine 0.7s; + animation: dance 0.7s; +} + +.match div:last-child { + display: block; + position: absolute; + top: 0; + width: 100%; + height: 100%; + background: transparent; + animation: shine 0.7s; } .dontMatch { - animation: shake 0.7s, shineRed 0.7s; + animation: shake 0.7s; +} + +.dontMatch div:last-child { + display: block; + position: absolute; + top: 0; + width: 100%; + height: 100%; + background: transparent; + animation: shineRed 0.7s; }