Add in CSS style <ol class="proof-steps">.

doc/en/Authoring/Proof.md

@@ -15,7 +15,7 @@ This class is a general high level container.
 <div style="color: #2f6473; background-color: #def2f8; border-color: #d1edf6;">
 This is typical question style, from the Moodle theme, containing the following proof.
 <div class="proof">
-<p>Let P(n) be the statement [...] </p>
+<p>Let \(P(n)\) be the statement [...] </p>
 <p>From which we see that.</p>
 </div>
 Back to the typical Moodle style.
@@ -174,6 +174,10 @@ The proof has two cases.
    </div>
   </div>
  </div>
+</div>
+
+### `<div class="proof-column">`
+
 <div class="proof-line">
  <div class="proof-column">Lines don't need to have <code>proof-num</code> or <code>proof-block</code></div>
  <div class="proof-column">With further comments.</div>
@@ -260,3 +264,28 @@ Consider the following proof by induction. \(P(n)\)
 </div>
 </div>
 </div>
+
+
+### `<ol class="proof-steps">`
+
+This class enables ordered lists to have connected numbered statements.
+
+<ol class="proof-steps">
+<li>Let \(A\) be an \(n \times n\) matrix and let \(R\) be the reduced row echelon form of \(A\).</li>
+<li>We will show first that \(\mbox{det}(A) \not= 0\) if and only if \(\mbox{det}(R) \not=0\).</li>
+<li>Let <ol>
+<li>\(E_1\),</li>
+<li>\(E_2\),</li>
+</ol>\(\dots, E_r\) be the elementary matrices corresponding to the elementary row operations that reduce \(A\) to \(R\).</li>
+<li>Then \(E_r \cdots E_1 A =\) [[input:ans1]]]</li>
+<li>Taking determinants of both sides, we obtain:\[\mbox{det}(E_r) \cdots \mbox{det}(E_1) \mbox{det}(A) = \mbox{det}(R).\]</li>
+<li>The determinants of all the elementary matrices are all [[input:ansdropdown]]]</li>
+<li>We conclude that \(\mbox{det}(A) \not= 0\) if and only if \(\mbox{det}(R) \not= 0\).</li>
+<li>Now suppose that \(A\) is invertible.
+ <ol class="proof-steps">
+ <li>Then \(R = \) [[input:ans4]]</li>
+ <li>Thus, \(\mbox{det}(R) =\) [[input:ans3]] and hence \(\mbox{det}(A) \not= 0\).</li>
+ </ol></li>
+<li>Conversely, if \(\mbox{det}(A) \not= 0\) then \(\mbox{det}(R) \not= 0\), so \(R\) cannot have a zero row.</li>
+<li>Thus \(R = I_n\) and \(A\) is invertible as required. </li>
+</ol>
\ No newline at end of file

doc/en/Developer/Development_track.md

@@ -8,6 +8,7 @@ How to report bugs and make suggestions is described on the [community](../About
 ## Version 4.4
 
 * Remove all strictSyntax functionality (DB, import/export functions remain).
+* Add in further styles for proof with numbered lists.
 
 ## Maxima side PRTs.
 

styles.css

@@ -217,6 +217,71 @@ body.pagelayout-embedded .que.stack .formulation .questiontestslink {
     }
 }
 
+/* Style some proofs as numbered steps. */
+ol.proof-steps {
+    counter-reset: li;
+    margin-left: 0;
+    padding-left: 0;
+    margin-top: 0;
+}
+ol.proof-steps > li {
+    position: relative;
+    margin-left: 2em;
+    padding: 0.5em;
+    list-style: none;
+    line-height: 1.5em;
+}
+ol.proof-steps > li > p {
+    margin: 0;
+}
+ol.proof-steps > li:before {
+    content: counter(li);
+    counter-increment: li;
+    position: absolute;
+    top: 7px;
+    left: -2em;
+    -webkit-box-sizing: border-box;
+    box-sizing: border-box;
+    width: 1.5em;
+    height: 1.5em;
+    margin-right: .2em;
+    margin-top: 0em;
+    border-style: none;
+    border-radius: 50%;
+    line-height: 1.4em;
+    text-align: center;
+    z-index: 2;
+    background-color: #039;
+    color: white;
+    font-size: 14px;
+    font-weight: 600;
+    vertical-align: middle;
+    padding-top: 1px;
+}
+
+ol.proof-steps > li:after {
+    position: absolute;
+    left: -19px;
+    top: 10px;
+    content: "";
+    height: 100%;
+    width: 0;
+    border-left: 3px solid #00339933;
+    z-index: 1;
+}
+ol.proof-steps > li:last-of-type:after {
+    border: none;
+}
+ol.proof-steps > li:before {
+    content: counter(li,decimal) !important;
+}
+ol.proof-steps ol.proof-steps > li:before {
+    content: counter(li,lower-latin) !important;
+}
+ol.proof-steps ol.proof-steps ol.proof-steps > li:before {
+    content: counter(li,lower-roman) !important;
+}
+
 /* Styles for the editing form. */
 body#page-question-type-stack .fitem_fgroup .accesshide,
 body#page-question-type-stack-questiontestedit .fitem_fgroup .accesshide {