diff --git a/client/coral-admin/src/containers/Dashboard/FlagWidget.js b/client/coral-admin/src/containers/Dashboard/FlagWidget.js index da71ac04a..4b86ec7d7 100644 --- a/client/coral-admin/src/containers/Dashboard/FlagWidget.js +++ b/client/coral-admin/src/containers/Dashboard/FlagWidget.js @@ -16,7 +16,7 @@ const FlagWidget = (props) => { {lang.t('streams.article')} - {lang.t('dashboard.flags')} + {lang.t('dashboard.flags')} @@ -27,20 +27,21 @@ const FlagWidget = (props) => { return ( - +

{asset.title}

{asset.author} — Published: {new Date(asset.created_at).toLocaleDateString()}

- -

{flagSummary ? flagSummary.actionCount : 0}

- +

{flagSummary ? flagSummary.actionCount : 0}

+ + + Moderate ); }) - : {lang.t('dashboard.no_flags')} + : {lang.t('dashboard.no_flags')} } { /* rows in a table with a fixed height will expand and ignore height. this extra row will expand to fill the extra space. */ diff --git a/client/coral-admin/src/containers/Dashboard/LikeWidget.js b/client/coral-admin/src/containers/Dashboard/LikeWidget.js index 25e851966..d52676ae4 100644 --- a/client/coral-admin/src/containers/Dashboard/LikeWidget.js +++ b/client/coral-admin/src/containers/Dashboard/LikeWidget.js @@ -17,7 +17,7 @@ const LikeWidget = (props) => { {lang.t('streams.article')} - {lang.t('modqueue.likes')} + {lang.t('modqueue.likes')} @@ -28,20 +28,21 @@ const LikeWidget = (props) => { return ( - +

{asset.title}

{asset.author} — Published: {new Date(asset.created_at).toLocaleDateString()}

- -

{likeSummary ? likeSummary.actionCount : 0}

- +

{likeSummary ? likeSummary.actionCount : 0}

+ + + Moderate ); }) - : {lang.t('dashboard.no_likes')} + : {lang.t('dashboard.no_likes')} } { /* rows in a table with a fixed height will expand and ignore height. this extra row will expand to fill the extra space. */ diff --git a/client/coral-admin/src/containers/Dashboard/Widget.css b/client/coral-admin/src/containers/Dashboard/Widget.css index cb764d9cc..3170cf332 100644 --- a/client/coral-admin/src/containers/Dashboard/Widget.css +++ b/client/coral-admin/src/containers/Dashboard/Widget.css @@ -55,11 +55,26 @@ padding: 10px; } +.widgetTable tbody td:last-child { + padding-top: 0; +} + .linkToAsset { display: block; text-decoration: none; } +.linkToModerate { + background-color: #e0e0e0; + padding: 10px 14px; + text-decoration: none; + color: black; +} + +.linkToModerate:hover { + background-color: #ccc; +} + .lede { font-size: 0.9em; color: #aaa; diff --git a/client/coral-admin/src/containers/ModerationQueue/components/ModerationHeader.js b/client/coral-admin/src/containers/ModerationQueue/components/ModerationHeader.js index c5a11b642..8d9f6b7e0 100644 --- a/client/coral-admin/src/containers/ModerationQueue/components/ModerationHeader.js +++ b/client/coral-admin/src/containers/ModerationQueue/components/ModerationHeader.js @@ -10,9 +10,9 @@ const ModerationHeader = props => ( props.asset ?
All Streams - - {props.asset.title} - + + {props.asset.title} + Select Stream
diff --git a/client/coral-admin/src/containers/ModerationQueue/components/styles.css b/client/coral-admin/src/containers/ModerationQueue/components/styles.css index 59f47faad..627cde5e4 100644 --- a/client/coral-admin/src/containers/ModerationQueue/components/styles.css +++ b/client/coral-admin/src/containers/ModerationQueue/components/styles.css @@ -84,11 +84,10 @@ span { margin-bottom: -1px; .settingsButton { - i { - vertical-align: middle; - margin-left: 10px; - margin-top: -4px; - } + vertical-align: middle; + margin-left: 10px; + margin-top: -4px; + font-size: 16px; } .moderateAsset { @@ -114,7 +113,15 @@ span { } &:nth-child(2) { - text-align: center; + span { + text-align: center; + text-overflow: ellipsis; + white-space: nowrap; + overflow: hidden; + max-width: 344px; + display: inline-block; + vertical-align: top; + } } &:last-child { diff --git a/client/coral-embed-stream/src/Comment.css b/client/coral-embed-stream/src/Comment.css index 7bc1a21f4..6966d82ab 100644 --- a/client/coral-embed-stream/src/Comment.css +++ b/client/coral-embed-stream/src/Comment.css @@ -3,5 +3,10 @@ } .Comment { - + +} + +.pendingComment { + filter: blur(2px); + pointer-events: none; } diff --git a/client/coral-embed-stream/src/Comment.js b/client/coral-embed-stream/src/Comment.js index 72449c906..0a3cdb78b 100644 --- a/client/coral-embed-stream/src/Comment.js +++ b/client/coral-embed-stream/src/Comment.js @@ -116,6 +116,7 @@ class Comment extends React.Component { const dontagree = getActionSummary('DontAgreeActionSummary', comment); let commentClass = parentId ? `reply ${styles.Reply}` : `comment ${styles.Comment}`; commentClass += highlighted === comment.id ? ' highlighted-comment' : ''; + commentClass += comment.id === 'pending' ? ` ${styles.pendingComment}` : ''; // call a function, and if it errors, call addNotification('error', ...) (e.g. to show user a snackbar) const notifyOnError = (fn, errorToMessage) => async () => { diff --git a/client/coral-framework/graphql/mutations/index.js b/client/coral-framework/graphql/mutations/index.js index 7dd8bf12b..04dba8402 100644 --- a/client/coral-framework/graphql/mutations/index.js +++ b/client/coral-framework/graphql/mutations/index.js @@ -35,7 +35,7 @@ export const postComment = graphql(POST_COMMENT, { action_summaries: [], tags: [], status: null, - id: `${Date.now()}_temp_id` + id: 'pending' } } }, diff --git a/client/coral-ui/components/Icon.js b/client/coral-ui/components/Icon.js index 65bf52f72..11432c753 100644 --- a/client/coral-ui/components/Icon.js +++ b/client/coral-ui/components/Icon.js @@ -1,7 +1,7 @@ import React from 'react'; import {Icon as IconMDL} from 'react-mdl'; -const Icon = ({className, name}) => ( +const Icon = ({className = '', name}) => ( );