Browse Source

Improve animation for reading comprehension

Angel Fernando Quiroz Campos 7 years ago
parent
commit
2a9e9ef9fc
1 changed files with 15 additions and 0 deletions
  1. 15 0
      main/template/default/exercise/reading_comprehension.tpl

+ 15 - 0
main/template/default/exercise/reading_comprehension.tpl

@@ -32,6 +32,11 @@
         -moz-text-shadow: 0 0 5px rgba(0, 0, 0, 0.5);
         -ms-text-shadow: 0 0 5px rgba(0, 0, 0, 0.5);
         text-shadow: 0 0 5px rgba(0, 0, 0, 0.5);
+        -webkit-transition: color .5s linear, text-shadow .5s linear;
+        -khtml-transition: color .5s linear, text-shadow .5s linear;
+        -moz-transition: color .5s linear, text-shadow .5s linear;
+        -ms-transition: color .5s linear, text-shadow .5s linear;
+        transition: color .5s linear, text-shadow .5s linear;
     }
     .question-reading-comprehension-text .text-highlight.active {
         color: #000;
@@ -40,6 +45,11 @@
         -moz-text-shadow: none;
         -ms-text-shadow: none;
         text-shadow: none;
+        -webkit-transition: color .5s linear, text-shadow .5s linear;
+        -khtml-transition: color .5s linear, text-shadow .5s linear;
+        -moz-transition: color .5s linear, text-shadow .5s linear;
+        -ms-transition: color .5s linear, text-shadow .5s linear;
+        transition: color .5s linear, text-shadow .5s linear;
     }
     .question-reading-comprehension-text .text-highlight.border {
         color: #bbb;
@@ -48,6 +58,11 @@
         -moz-text-shadow: none;
         -ms-text-shadow: none;
         text-shadow: none;
+        -webkit-transition: color .5s linear, text-shadow .5s linear;
+        -khtml-transition: color .5s linear, text-shadow .5s linear;
+        -moz-transition: color .5s linear, text-shadow .5s linear;
+        -ms-transition: color .5s linear, text-shadow .5s linear;
+        transition: color .5s linear, text-shadow .5s linear;
     }
     .question-reading-comprehension-text br {
         margin-bottom: 1em;