diff --git a/client/coral-embed-stream/src/graphql/utils.js b/client/coral-embed-stream/src/graphql/utils.js
index 03d9fe02a..523cc571f 100644
--- a/client/coral-embed-stream/src/graphql/utils.js
+++ b/client/coral-embed-stream/src/graphql/utils.js
@@ -1,10 +1,18 @@
import update from 'immutability-helper';
-import {THREADING_LEVEL} from '../constants/stream';
+function determineCommentDepth(comment) {
+ let depth = 0;
+ let cur = comment;
+ while (cur.parent) {
+ cur = cur.parent;
+ depth++;
+ }
+ return depth;
+}
function applyToCommentsOrigin(root, callback) {
if (root.comment) {
let comment = root.comment;
- for (let depth = 0; depth <= THREADING_LEVEL; depth++) {
+ for (let depth = 0; depth <= determineCommentDepth(comment); depth++) {
let changes = {$apply: (node) => node ? callback(node) : node};
for (let i = 0; i < depth; i++) {
changes = {parent: changes};
diff --git a/client/coral-embed-stream/style/default.css b/client/coral-embed-stream/style/default.css
index bd56cb748..3038e0da4 100644
--- a/client/coral-embed-stream/style/default.css
+++ b/client/coral-embed-stream/style/default.css
@@ -459,14 +459,3 @@ button.comment__action-button[disabled],
width: initial;
}
-
-@media (min-device-width : 300px) and (max-device-width : 420px) {
- .commentActionsLeft.comment__action-container .coral-plugin-replies-reply-button {
- visibility: collapse;
- margin-left: -30px;
- }
-
- .commentActionsLeft.comment__action-container .coral-plugin-replies-reply-button .coral-plugin-replies-icon {
- visibility: visible;
- }
-}
diff --git a/client/coral-plugin-replies/ReplyButton.css b/client/coral-plugin-replies/ReplyButton.css
new file mode 100644
index 000000000..4f71e6630
--- /dev/null
+++ b/client/coral-plugin-replies/ReplyButton.css
@@ -0,0 +1,5 @@
+@media (max-width: 425px) {
+ .label {
+ display: none;
+ }
+}
diff --git a/client/coral-plugin-replies/ReplyButton.js b/client/coral-plugin-replies/ReplyButton.js
index a66e3c156..4641ae02d 100644
--- a/client/coral-plugin-replies/ReplyButton.js
+++ b/client/coral-plugin-replies/ReplyButton.js
@@ -2,16 +2,19 @@ import React, {PropTypes} from 'react';
import t from 'coral-framework/services/i18n';
-import classnames from 'classnames';
+import cn from 'classnames';
+import styles from './ReplyButton.css';
const name = 'coral-plugin-replies';
const ReplyButton = ({onClick}) => {
return (
diff --git a/plugins/coral-plugin-like/client/LikeButton.js b/plugins/coral-plugin-like/client/LikeButton.js
index 7d17ef056..34b5e40f2 100644
--- a/plugins/coral-plugin-like/client/LikeButton.js
+++ b/plugins/coral-plugin-like/client/LikeButton.js
@@ -45,7 +45,9 @@ class LikeButton extends React.Component {
className={cn(styles.button, {[styles.liked]: alreadyReacted}, `${plugin}-button`)}
onClick={this.handleClick}
>
- {t(alreadyReacted ? 'coral-plugin-like.liked' : 'coral-plugin-like.like')}
+
+ {t(alreadyReacted ? 'coral-plugin-like.liked' : 'coral-plugin-like.like')}
+
{count > 0 && count}
diff --git a/plugins/coral-plugin-like/client/styles.css b/plugins/coral-plugin-like/client/styles.css
index cb372fa47..b44c170e3 100644
--- a/plugins/coral-plugin-like/client/styles.css
+++ b/plugins/coral-plugin-like/client/styles.css
@@ -23,3 +23,9 @@
}
}
}
+
+@media (max-width: 425px) {
+ .label {
+ display: none;
+ }
+}
diff --git a/plugins/coral-plugin-love/client/LoveButton.js b/plugins/coral-plugin-love/client/LoveButton.js
index 7450ad668..d67160773 100644
--- a/plugins/coral-plugin-love/client/LoveButton.js
+++ b/plugins/coral-plugin-love/client/LoveButton.js
@@ -45,7 +45,9 @@ class LoveButton extends React.Component {
className={cn(styles.button, {[styles.loved]: alreadyReacted}, `${plugin}-button`)}
onClick={this.handleClick}
>
- {t(alreadyReacted ? 'coral-plugin-love.loved' : 'coral-plugin-love.love')}
+
+ {t(alreadyReacted ? 'coral-plugin-love.loved' : 'coral-plugin-love.love')}
+
{count > 0 && count}
diff --git a/plugins/coral-plugin-love/client/styles.css b/plugins/coral-plugin-love/client/styles.css
index e16e17ca4..ac5a86370 100644
--- a/plugins/coral-plugin-love/client/styles.css
+++ b/plugins/coral-plugin-love/client/styles.css
@@ -23,3 +23,9 @@
}
}
}
+
+@media (max-width: 425px) {
+ .label {
+ display: none;
+ }
+}
diff --git a/plugins/coral-plugin-respect/client/RespectButton.js b/plugins/coral-plugin-respect/client/RespectButton.js
index 9bc556b67..878525051 100644
--- a/plugins/coral-plugin-respect/client/RespectButton.js
+++ b/plugins/coral-plugin-respect/client/RespectButton.js
@@ -45,11 +45,11 @@ class RespectButton extends React.Component {
className={cn(styles.button, {[styles.respected]: alreadyReacted}, `${plugin}-button`)}
onClick={this.handleClick}
>
-
+
{t(alreadyReacted ? 'coral-plugin-respect.respected' : 'coral-plugin-respect.respect')}
- {count > 0 && count}
+ {count > 0 && count}
);
diff --git a/plugins/coral-plugin-respect/client/styles.css b/plugins/coral-plugin-respect/client/styles.css
index f0b780b86..d08d648c3 100644
--- a/plugins/coral-plugin-respect/client/styles.css
+++ b/plugins/coral-plugin-respect/client/styles.css
@@ -28,3 +28,9 @@
.icon {
padding: 0 5px;
}
+
+@media (max-width: 425px) {
+ .label {
+ display: none;
+ }
+}