MDL-67653 questions: prevent the flag flickering as the page loads
authorTim Hunt <T.J.Hunt@open.ac.uk>
Thu, 9 Jan 2020 20:19:43 +0000 (20:19 +0000)
committerTim Hunt <T.J.Hunt@open.ac.uk>
Fri, 10 Jan 2020 14:27:42 +0000 (14:27 +0000)
mod/quiz/styles.css
question/engine/renderer.php
theme/boost/scss/moodle/question.scss
theme/boost/style/moodle.css
theme/classic/style/moodle.css

index 491140a..8c79315 100644 (file)
     border: 1px solid #dcdcdc;
 }
 
-body.jsenabled .questionflagcheckbox {
-    display: none;
-}
-
 #page-mod-quiz-attempt #connection-ok,
 #page-mod-quiz-attempt #connection-error {
     position: fixed;
index 4ce351e..ab35247 100644 (file)
@@ -323,21 +323,23 @@ class core_question_renderer extends plugin_renderer_base {
         if ($flagged) {
             $icon = 'i/flagged';
             $alt = get_string('flagged', 'question');
+            $label = get_string('clickunflag', 'question');
         } else {
             $icon = 'i/unflagged';
             $alt = get_string('notflagged', 'question');
+            $label = get_string('clickflag', 'question');
         }
         $attributes = array(
             'src' => $this->image_url($icon),
             'alt' => $alt,
+            'class' => 'questionflagimage',
         );
         if ($id) {
             $attributes['id'] = $id;
         }
         $img = html_writer::empty_tag('img', $attributes);
-        if ($flagged) {
-            $img .= ' ' . get_string('flagged', 'question');
-        }
+        $img .= html_writer::span($label);
+
         return $img;
     }
 
index ce19643..4831fe5 100644 (file)
@@ -409,7 +409,11 @@ body.path-question-type {
     vertical-align: text-bottom;
 }
 
-.que input.questionflagimage {
+body.jsenabled .questionflag input[type=checkbox] {
+    display: none;
+}
+
+.que .questionflagimage {
     padding-right: 3px;
     height: 16px;
     width: 16px;
index 01b77d5..abce8ea 100644 (file)
@@ -15014,7 +15014,10 @@ body.path-question-type {
 .que .questioncorrectnessicon {
   vertical-align: text-bottom; }
 
-.que input.questionflagimage {
+body.jsenabled .questionflag input[type=checkbox] {
+  display: none; }
+
+.que .questionflagimage {
   padding-right: 3px;
   height: 16px;
   width: 16px; }
index b3e5902..025b86d 100644 (file)
@@ -15234,7 +15234,10 @@ body.path-question-type {
 .que .questioncorrectnessicon {
   vertical-align: text-bottom; }
 
-.que input.questionflagimage {
+body.jsenabled .questionflag input[type=checkbox] {
+  display: none; }
+
+.que .questionflagimage {
   padding-right: 3px;
   height: 16px;
   width: 16px; }