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 = `
+ {body}
+`;
+
export const CommentExample = {
title: 'Comment',
sections: [
@@ -48,6 +52,7 @@ export const CommentExample = {
),
props: { EuiComment },
+ snippet: commentSnippet,
demo: ,
},
],
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..8f45910973b 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;