Make lists looks the same when preview mode and published

app/assets/stylesheets/framework/markdown_area.scss

@@ -97,5 +97,7 @@
       white-space: pre-wrap;
       word-break: keep-all;
     }
+
+    @include bulleted-list;
   }
 }

app/assets/stylesheets/framework/mixins.scss

@@ -110,3 +110,17 @@
   font-size: 16px;
   line-height: 24px;
 }
+
+@mixin bulleted-list {
+  > ul {
+    list-style-type: disc;
+
+    ul {
+      list-style-type: circle;
+
+      ul {
+        list-style-type: square;
+      }
+    }
+  }
+}
\ No newline at end of file

app/assets/stylesheets/pages/notes.scss

@@ -84,24 +84,14 @@ ul.notes {
         word-wrap: break-word;
         @include md-typography;
 
+        // Reset ul style types since we're nested inside a ul already
+        @include bulleted-list;
+
         // On diffs code should wrap nicely and not overflow
         code {
           white-space: pre-wrap;
         }
 
-        // Reset ul style types since we're nested inside a ul already
-        & > ul {
-          list-style-type: disc;
-
-          ul {
-            list-style-type: circle;
-
-            ul {
-              list-style-type: square;
-            }
-          }
-        }
-
         ul.task-list {
           ul:not(.task-list) {
             padding-left: 1.3em;