From 4d23573182ac4f2e249a418b1e1fa6a2f0f2ce37 Mon Sep 17 00:00:00 2001
From: Tim Hunt <T.J.Hunt@open.ac.uk>
Date: Fri, 18 Dec 2020 12:58:15 +0000
Subject: [PATCH 1/2] MDL-70374 qtype_multichoice: improve alignment of choices

---
 question/type/multichoice/renderer.php | 6 +++++-
 question/type/multichoice/styles.css   | 4 ++++
 2 files changed, 9 insertions(+), 1 deletion(-)

diff --git a/question/type/multichoice/renderer.php b/question/type/multichoice/renderer.php
index 89563b2bb9d..93154f09644 100644
--- a/question/type/multichoice/renderer.php
+++ b/question/type/multichoice/renderer.php
@@ -104,7 +104,11 @@ abstract class qtype_multichoice_renderer_base extends qtype_with_combined_feedb
                 ));
             }
 
-            $questionnumber = html_writer::span($this->number_in_style($value, $question->answernumbering), 'answernumber');
+            $questionnumber = '';
+            if ($question->answernumbering !== 'none') {
+                $questionnumber = html_writer::span(
+                        $this->number_in_style($value, $question->answernumbering), 'answernumber');
+            }
             $answertext = $question->format_text($ans->answer, $ans->answerformat, $qa, 'question', 'answer', $ansid);
             $questionanswer = html_writer::div($answertext, 'flex-fill ml-1');
 
diff --git a/question/type/multichoice/styles.css b/question/type/multichoice/styles.css
index df8ed862d91..546ad39cdd2 100644
--- a/question/type/multichoice/styles.css
+++ b/question/type/multichoice/styles.css
@@ -26,6 +26,10 @@
     width: 14px;
 }
 
+.que.multichoice .answer .answernumber {
+    min-width: 1.5em;
+}
+
 /* Editing form. */
 body#page-question-type-multichoice div[id^=fitem_id_][id*=answer_] {
     background: #eee;

From add7ebab304bfd9f60b30a39121babab5064805f Mon Sep 17 00:00:00 2001
From: Tim Hunt <T.J.Hunt@open.ac.uk>
Date: Fri, 18 Dec 2020 13:12:51 +0000
Subject: [PATCH 2/2] MDL-70374 qtype_multichoice: code cleanup

* Remove some obsoliete CSS.
* Put the CSS in a more logical order.
* Rename some variables in the renderer, for more clarity.
---
 question/type/multichoice/renderer.php | 10 +++++-----
 question/type/multichoice/styles.css   | 21 ++++++---------------
 2 files changed, 11 insertions(+), 20 deletions(-)

diff --git a/question/type/multichoice/renderer.php b/question/type/multichoice/renderer.php
index 93154f09644..e9cec516fa1 100644
--- a/question/type/multichoice/renderer.php
+++ b/question/type/multichoice/renderer.php
@@ -104,16 +104,16 @@ abstract class qtype_multichoice_renderer_base extends qtype_with_combined_feedb
                 ));
             }
 
-            $questionnumber = '';
+            $choicenumber = '';
             if ($question->answernumbering !== 'none') {
-                $questionnumber = html_writer::span(
+                $choicenumber = html_writer::span(
                         $this->number_in_style($value, $question->answernumbering), 'answernumber');
             }
-            $answertext = $question->format_text($ans->answer, $ans->answerformat, $qa, 'question', 'answer', $ansid);
-            $questionanswer = html_writer::div($answertext, 'flex-fill ml-1');
+            $choicetext = $question->format_text($ans->answer, $ans->answerformat, $qa, 'question', 'answer', $ansid);
+            $choice = html_writer::div($choicetext, 'flex-fill ml-1');
 
             $radiobuttons[] = $hidden . html_writer::empty_tag('input', $inputattributes) .
-                    html_writer::div($questionnumber . $questionanswer, 'd-flex w-100', [
+                    html_writer::div($choicenumber . $choice, 'd-flex w-100', [
                         'id' => $inputattributes['id'] . '_label',
                         'data-region' => 'answer-label',
                     ]);
diff --git a/question/type/multichoice/styles.css b/question/type/multichoice/styles.css
index 546ad39cdd2..bf2e7369053 100644
--- a/question/type/multichoice/styles.css
+++ b/question/type/multichoice/styles.css
@@ -1,9 +1,3 @@
-.que.multichoice .answer .specificfeedback {
-    display: inline;
-    padding: 0 0.7em;
-    background: #fff3bf;
-}
-
 .que.multichoice .answer div.r0,
 .que.multichoice .answer div.r1 {
     display: flex;
@@ -11,15 +5,6 @@
     align-items: flex-start;
 }
 
-.que.multichoice .answer div.r0 label,
-.que.multichoice .answer div.r1 label,
-.que.multichoice .answer div.r0 div.specificfeedback,
-.que.multichoice .answer div.r1 div.specificfeedback {
-    /* In Chrome and IE, the text-indent above is applied to any embedded table
-       cells or <li>s, which screws up the intended layout. This fixes it again. */
-    text-indent: 0;
-}
-
 .que.multichoice .answer div.r0 input,
 .que.multichoice .answer div.r1 input {
     margin: 0.3rem 0.5rem;
@@ -30,6 +15,12 @@
     min-width: 1.5em;
 }
 
+.que.multichoice .answer .specificfeedback {
+    display: inline;
+    padding: 0 0.7em;
+    background: #fff3bf;
+}
+
 /* Editing form. */
 body#page-question-type-multichoice div[id^=fitem_id_][id*=answer_] {
     background: #eee;