From 58fc8f958a93b90f05bdb2fcbaf41cd8e044a5b2 Mon Sep 17 00:00:00 2001
From: Andrea Del Rio <delrio.andre@gmail.com>
Date: Thu, 26 Mar 2020 12:41:28 -0700
Subject: [PATCH] add snippet

---
 src-docs/src/views/comment/comment_example.js | 5 +++++
 src/components/comment/_comment.scss          | 4 ++--
 src/components/comment/_comment_event.scss    | 6 +++++-
 3 files changed, 12 insertions(+), 3 deletions(-)

diff --git a/src-docs/src/views/comment/comment_example.js b/src-docs/src/views/comment/comment_example.js
index 219b5d7483d..45b26310fea 100644
--- a/src-docs/src/views/comment/comment_example.js
+++ b/src-docs/src/views/comment/comment_example.js
@@ -10,6 +10,10 @@ import Comment from './comment';
 const commentSource = require('!!raw-loader!./comment');
 const commentHtml = renderToHtml(Comment);
 
+const commentSnippet = `<EuiComment username="janed">
+  {body}
+</EuiComment>`;
+
 export const CommentExample = {
   title: 'Comment',
   sections: [
@@ -48,6 +52,7 @@ export const CommentExample = {
         </div>
       ),
       props: { EuiComment },
+      snippet: commentSnippet,
       demo: <Comment />,
     },
   ],
diff --git a/src/components/comment/_comment.scss b/src/components/comment/_comment.scss
index 466c733c06c..6b858f595b0 100644
--- a/src/components/comment/_comment.scss
+++ b/src/components/comment/_comment.scss
@@ -1,7 +1,7 @@
 .euiComment {
   font-size: $euiFontSizeS;
   display: flex;
-  margin: -($euiSize * .5);
+  margin: -($euiSizeS);
   padding-bottom: $euiSize;
   min-height: $euiSize * 5;
 
@@ -27,7 +27,7 @@
   .euiCommentTimeline,
   .euiCommentEvent {
     flex-basis: auto;
-    margin: $euiSize * .5;
+    margin: $euiSizeS;
   }
 
 }
diff --git a/src/components/comment/_comment_event.scss b/src/components/comment/_comment_event.scss
index 6a73a2891f9..cc351ed2718 100644
--- a/src/components/comment/_comment_event.scss
+++ b/src/components/comment/_comment_event.scss
@@ -15,6 +15,10 @@
       >div {
         margin: $euiSizeXS;
       }
+
+      .euiCommentEvent__headerTimestamp {
+        padding-top: $euiSizeXS * .5;
+      }
     }
 
     align-items: center;
@@ -44,7 +48,7 @@
   .euiCommentEvent__header {
     background-color: $euiColorLightestShade;
     border-bottom: $euiBorderThin;
-    padding: $euiSizeM;
+    padding: $euiSizeS;
     display: flex;
     justify-content: space-between;
     align-items: center;