fix(Stencila): Fix vertical spacing for nested lists after paragraphs

src/examples/simple.html

@@ -37,6 +37,8 @@ <h6>Title 6</h6>
       </figure>
     </stencila-code-chunk>
 
+    <h2>Lists</h2>
+
     <ul>
       <li>Item number 1</li>
       <li>Item number 2</li>
@@ -56,6 +58,65 @@ <h6>Title 6</h6>
       <li>Item number 8</li>
     </ul>
 
+    <p>
+      Stencila recognises lists in Google Docs including unordered (bulleted)
+      lists like this:
+    </p>
+    <ul>
+      <li>
+        <p>Apple</p>
+      </li>
+      <li>
+        <p>Pear</p>
+      </li>
+      <li>
+        <p>Peach</p>
+      </li>
+    </ul>
+    <p>And ordered lists like this:</p>
+    <ol>
+      <li>
+        <p>Butter</p>
+      </li>
+      <li>
+        <p>Cheese</p>
+      </li>
+      <li>
+        <p>Milk</p>
+      </li>
+    </ol>
+    <p>Nested lists are supported too:</p>
+    <ol>
+      <li>
+        <p>Fruit</p>
+        <ol>
+          <li>
+            <p>Apple</p>
+          </li>
+          <li>
+            <p>Pear</p>
+          </li>
+          <li>
+            <p>Peach</p>
+          </li>
+        </ol>
+      </li>
+      <li>
+        <p>Dairy</p>
+        <ol>
+          <li>
+            <p>Butter</p>
+          </li>
+          <li>
+            <p>Cheese</p>
+          </li>
+          <li>
+            <p>Milk</p>
+          </li>
+        </ol>
+      </li>
+    </ol>
+
     <stencila-code-chunk data-collapsed="false" data-execution_count="4">
       <pre slot="text"><code class="lang-python">import time
 time.sleep(10)</code></pre>

src/themes/stencila/styles.css

@@ -186,6 +186,11 @@ li {
     margin-top: 0;
   }
 
+  p + ul,
+  p + ol {
+    margin-top: -1.25rem;
+  }
+
   > *:last-child:not(figure) {
     margin-bottom: 0;
   }