feat: add simple arrow

phodal · Mar 13, 2020 · 71e4213 · 71e4213
1 parent 23be104
commit 71e4213
Show file tree

Hide file tree

Showing 3 changed files with 9 additions and 2 deletions.
diff --git a/src/app/shared/components/markdown-render/markdown-render.component.ts b/src/app/shared/components/markdown-render/markdown-render.component.ts
@@ -321,7 +321,9 @@ export class MarkdownRenderComponent implements OnInit, OnChanges {
         }
       }
 
-      cols += `<div class="process-step-column"><div class="process-title">${title}</div><div class="process-body">${itemsStr}</div></div>`;
+      cols += `<div class="process-step-column">
+  <div class="process-title">${title}</div><div class="process-body">${itemsStr}</div>
+</div>`;
     }
 
     return `<div class="markdown-process-step">${cols}</div>`;

diff --git a/src/assets/resources/images/arrow-right-thin.svg b/src/assets/resources/images/arrow-right-thin.svg
diff --git a/src/styles/_markdown.scss b/src/styles/_markdown.scss
@@ -608,6 +608,8 @@
       font-size: 1.2em;
       line-height: 1.5em;
       margin-top: 1em;
+
+      background: url("/assets/resources/images/arrow-right-thin.svg") no-repeat center right 10px;
     }
 
     .process-body {
@@ -616,7 +618,7 @@
 
     .process-step-item {
       margin-top: 0.4em;
-      padding: 0.5em 1em;
+      padding: 0.5em 0.2em;
       border-left: 1px solid #222;
       border-right: 1px solid #222;
       border-top: 1px solid #222;