feat(docs): list styling (#215)

positive-js · Aug 27, 2019 · 7ec670e · 7ec670e
1 parent 56900de
commit 7ec670e
Showing 1 changed file with 35 additions and 5 deletions.
diff --git a/packages/docs/src/styles/_markdown.scss b/packages/docs/src/styles/_markdown.scss
@@ -2,7 +2,7 @@
 .docs-markdown {
     max-width: 100%;
 
-    &__p {
+    &__p, &__li {
         margin: 0;
         padding-top: 8px;
     }
@@ -12,6 +12,37 @@
         text-decoration: none;
         cursor: pointer;
     }
+
+    &__ul {
+        position: relative;
+        list-style: none;
+        margin: 0;
+        padding: 0;
+
+        & .docs-markdown__li {
+            padding-left: 20px;
+        }
+
+        & .docs-markdown__li:before {
+            content:  "—";
+            position: absolute;
+            left: 0;
+        }
+    }
+
+    &__ol {
+        margin: 0;
+        padding-left: 25px;
+
+        & .docs-markdown__li {
+            padding-left: 4px;
+        }
+
+        & & {
+            list-style-type: lower-alpha;
+            padding-left: 16px;
+        }
+    }
 }
 
 @mixin docs-markdown-theme($theme) {
@@ -24,13 +55,14 @@
     $color: mc-color($primary);
     $color_hover: mc-color($primary, if($is-dark, lighter, darker));
     $color_disabled: mc-color($foreground, disabled-text);
+    $fg-default: mc-color($foreground, text);
 
     .docs-header-link {
         color: map-get($second, 700);
     }
 
     .docs-markdown {
-        color: map-get($second, 700);
+        color: $fg-default;
 
         &__a {
             color: $color;
@@ -78,9 +110,7 @@
     }
 
     .docs-markdown {
-        &__p, &__a {
-            @include mc-typography-level-to-styles($config, body);
-        }
+        @include mc-typography-level-to-styles($config, body);
     }
 }