diff --git a/client/coral-embed-stream/src/components/Comment.css b/client/coral-embed-stream/src/components/Comment.css index 6dc8eee80..e32b7333b 100644 --- a/client/coral-embed-stream/src/components/Comment.css +++ b/client/coral-embed-stream/src/components/Comment.css @@ -50,11 +50,6 @@ pointer-events: none; } -.bylineSecondary { - color: #696969; - font-size: 12px; -} - .editedMarker { font-style: italic; } diff --git a/client/coral-embed-stream/style/default.css b/client/coral-embed-stream/style/default.css index a285d1ff6..a20c94d1a 100644 --- a/client/coral-embed-stream/style/default.css +++ b/client/coral-embed-stream/style/default.css @@ -85,10 +85,6 @@ body { /* Info Box Styles */ -.hidden { - visibility: hidden; - display: none; -} .talk-plugin-infobox-info { top: 0; @@ -235,10 +231,6 @@ button.comment__action-button[disabled], color: #F00; } -.talk-plugin-pubdate-text { - display: inline-block; -} - /* Flag Styles */ .talk-plugin-flags-popup-form { @@ -367,4 +359,7 @@ button.comment__action-button[disabled], color: white; } - +.hidden { + visibility: hidden; + display: none; +} diff --git a/client/coral-framework/components/PubDate.css b/client/coral-framework/components/PubDate.css new file mode 100644 index 000000000..4ea0061c4 --- /dev/null +++ b/client/coral-framework/components/PubDate.css @@ -0,0 +1,6 @@ +.pubdate { + display: inline-block; + color: #696969; + font-size: 12px; +} + diff --git a/client/coral-framework/components/PubDate.js b/client/coral-framework/components/PubDate.js index 843909852..03f84a777 100644 --- a/client/coral-framework/components/PubDate.js +++ b/client/coral-framework/components/PubDate.js @@ -1,14 +1,17 @@ import React from 'react'; import PropTypes from 'prop-types'; import {timeago} from 'coral-framework/services/i18n'; +import cn from 'classnames'; +import styles from './PubDate.css'; -const name = 'talk-plugin-pubdate'; - -const PubDate = ({created_at}) =>
- {timeago(created_at)} -
; +const PubDate = ({className, created_at}) => ( +
+ {timeago(created_at)} +
+); PubDate.propTypes = { + className: PropTypes.string, created_at: PropTypes.string, }; diff --git a/client/talk-plugin-history/Comment.css b/client/talk-plugin-history/Comment.css index 1200709a3..23289c17d 100644 --- a/client/talk-plugin-history/Comment.css +++ b/client/talk-plugin-history/Comment.css @@ -49,27 +49,32 @@ li { margin-bottom: 5px; - - &:nth-child(1) { - color: #5394D7; - } - - &:nth-child(2) { - color: #909090; - } - - - i { - margin-right: 5px; - font-size: 15px; - } - - a:hover { - cursor: pointer; - } } } +.viewLink { + color: #5394D7; + + &:hover { + cursor: pointer; + } +} + +.iconView { + margin-right: 5px; + font-size: 15px; + vertical-align: middle; + padding-bottom: 1px; +} + +.iconDate { + margin-right: 5px; + font-size: 15px; + color: #696969; + vertical-align: middle; + padding-bottom: 1px; +} + @custom-media --mobile-viewport (max-width: 480px); @media (--mobile-viewport) { @@ -92,7 +97,3 @@ color: inherit; } -.iconView, .iconDate { - vertical-align: middle; - padding-bottom: 1px; -} diff --git a/client/talk-plugin-history/Comment.js b/client/talk-plugin-history/Comment.js index 8152e431a..1f7979018 100644 --- a/client/talk-plugin-history/Comment.js +++ b/client/talk-plugin-history/Comment.js @@ -54,7 +54,7 @@ class Comment extends React.Component {