diff --git a/client/coral-embed-stream/src/NewCount.js b/client/coral-embed-stream/src/NewCount.js
index 99e1297e9..429ecc113 100644
--- a/client/coral-embed-stream/src/NewCount.js
+++ b/client/coral-embed-stream/src/NewCount.js
@@ -1,4 +1,7 @@
import React, {PropTypes} from 'react';
+import I18n from 'coral-framework/modules/i18n/i18n';
+import translations from 'coral-framework/translations.json';
+const lang = new I18n(translations);
const onLoadMoreClick = ({loadMore, commentCount, firstCommentDate, assetId, updateCountCache}) => (e) => {
e.preventDefault();
@@ -14,12 +17,14 @@ const onLoadMoreClick = ({loadMore, commentCount, firstCommentDate, assetId, upd
const NewCount = (props) => {
const newComments = props.commentCount - props.countCache;
- return
+ return
{
props.countCache && newComments > 0 &&
-
- Load {newComments} More Comments
-
+
}
;
};
diff --git a/client/coral-embed-stream/style/default.css b/client/coral-embed-stream/style/default.css
index 1deae6026..0e4f7e4a6 100644
--- a/client/coral-embed-stream/style/default.css
+++ b/client/coral-embed-stream/style/default.css
@@ -336,18 +336,26 @@ button.coral-load-more {
text-align: center;
color: #FFF;
background-color: #2376D8;
+ cursor: pointer;
}
button.coral-load-more:hover {
background-color: #4399FF;
}
-.coral-load-more-replies {
+.coral-load-more-replies, .coral-new-comments {
width: 100%;
display: flex;
justify-content: center;
+ cursor: pointer;
}
-.coral-load-more-replies button.coral-load-more {
+.coral-new-comments {
+ position: relative;
+ top: 1.8em;
+ z-index: 100;
+}
+
+.coral-load-more-replies button.coral-load-more, .coral-new-comments button.coral-load-more{
width: initial;
}
diff --git a/client/coral-framework/translations.json b/client/coral-framework/translations.json
index 2884178b6..23405d2d8 100644
--- a/client/coral-framework/translations.json
+++ b/client/coral-framework/translations.json
@@ -11,6 +11,9 @@
"button": "Submit",
"error": "Usernames can contain letters, numbers and _ only"
},
+ "newCount": "View {0} more {1}",
+ "comment": "comment",
+ "comments": "comments",
"error": {
"emailNotVerified": "Email address {0} not verified.",
"email": "Not a valid E-Mail",