fix: list formatting multiline with fancy bullets (#1406)

* Fix list formatting multiline with fancy bullets In kinda response to: https://github.com/Requarks/wiki/pull/1283 Solves the problem with the list having issues with p elements and with multi lines but keeping the fancy css bullets. Tested on Chrome, Firefox, Opera and Edge. * remove important * fix: bullet symbol for RTL Co-authored-by: Nicolas Giard <github@ngpixel.com>

fix: list formatting multiline with fancy bullets (#1406)
429c2673 · Aitor Rosell Torralba · GitHub · b82c788e · 429c2673
Unverified Commit 429c2673 authored Feb 01, 2020 by Aitor Rosell Torralba Committed by GitHub Jan 31, 2020
Hide whitespace changes
Inline Side-by-side

Showing with 24 additions and 4 deletions

app.scss client/themes/default/scss/app.scss +24 -4

No files found.
--- a/client/themes/default/scss/app.scss
+++ b/client/themes/default/scss/app.scss
@@ -312,8 +312,8 @@
  // ---------------------------------

  ol, ul {
-    padding: 1rem 0 0 1rem;
-    list-style-position: outside;
+	  padding: 1rem 0 0 0;
+     list-style-position: inside;

    @at-root .is-rtl & {
      padding-left: 0;
@@ -472,8 +472,28 @@
    }
  }

-  ul {
-    list-style: square outside;
+ul {
+    list-style: none;
+    width: 100%;
+    > li::before {
+      content: '\25b8';
+      color: mc('grey', '600');
+      display: inline-block;
+      width: 1.35rem;
+      
+      @at-root .is-rtl & {
+        content: '\25C0' ;
+      }
+    }
+    > li {
+      display:flex;
+      flex-wrap: wrap;
+      > p {
+        display:inline-block;
+        vertical-align:top;
+        padding-top:0;
+      }
+  }
  }

  // ---------------------------------