diff --git a/client/coral-admin/src/containers/Configure/Configure.css b/client/coral-admin/src/containers/Configure/Configure.css index 6cb623978..b1b1ebbaf 100644 --- a/client/coral-admin/src/containers/Configure/Configure.css +++ b/client/coral-admin/src/containers/Configure/Configure.css @@ -90,6 +90,11 @@ .configTimeoutSelect { display: inline-block; margin-left: 20px; + + i { /* fix for firefox and react-mdl-selectfield@0.2.0 */ + padding: 20px 0; + vertical-align: top; + } } .charCountTexfield { diff --git a/client/coral-admin/src/containers/Configure/StreamSettings.js b/client/coral-admin/src/containers/Configure/StreamSettings.js index 5530bc6cd..f77013bc0 100644 --- a/client/coral-admin/src/containers/Configure/StreamSettings.js +++ b/client/coral-admin/src/containers/Configure/StreamSettings.js @@ -171,6 +171,7 @@ const StreamSettings = ({updateSettings, settingsError, settings, errors}) => { + {/* the above card should be the last one if at all possible because of z-index issues with the selects */} ); }; diff --git a/client/coral-admin/src/containers/Dashboard/FlagWidget.js b/client/coral-admin/src/containers/Dashboard/FlagWidget.js index 4b86ec7d7..7d2ffe17a 100644 --- a/client/coral-admin/src/containers/Dashboard/FlagWidget.js +++ b/client/coral-admin/src/containers/Dashboard/FlagWidget.js @@ -12,43 +12,29 @@ const FlagWidget = (props) => { return (

Articles with the most flags

- - - - - - - - - { - assets.length - ? assets.map(asset => { - const flagSummary = asset.action_summaries.find(s => s.type === 'FlagAssetActionSummary'); - return ( - - - - - - ); - }) - : - } - { /* rows in a table with a fixed height will expand and ignore height. - this extra row will expand to fill the extra space. */ - assets.length < 10 ? : null - } - -
{lang.t('streams.article')}{lang.t('dashboard.flags')}
- -

{asset.title}

-

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

- -
-

{flagSummary ? flagSummary.actionCount : 0}

-
- Moderate -
{lang.t('dashboard.no_flags')}
+
+

{lang.t('streams.article')}

+

{lang.t('dashboard.flags')}

+
+
+ { + assets.length + ? assets.map(asset => { + const flagSummary = asset.action_summaries.find(s => s.type === 'FlagAssetActionSummary'); + return ( +
+ Moderate +

{flagSummary ? flagSummary.actionCount : 0}

+ +

{asset.title}

+ +

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

+
+ ); + }) + :
{lang.t('dashboard.no_flags')}
+ } +
); }; diff --git a/client/coral-admin/src/containers/Dashboard/LikeWidget.js b/client/coral-admin/src/containers/Dashboard/LikeWidget.js index d52676ae4..436fbcaf3 100644 --- a/client/coral-admin/src/containers/Dashboard/LikeWidget.js +++ b/client/coral-admin/src/containers/Dashboard/LikeWidget.js @@ -13,43 +13,29 @@ const LikeWidget = (props) => { return (

Articles with the most likes

- - - - - - - - - { - assets.length - ? assets.map(asset => { - const likeSummary = asset.action_summaries.find(s => s.type === 'LikeAssetActionSummary'); - return ( - - - - - - ); - }) - : - } - { /* rows in a table with a fixed height will expand and ignore height. - this extra row will expand to fill the extra space. */ - assets.length < 10 ? : null - } - -
{lang.t('streams.article')}{lang.t('modqueue.likes')}
- -

{asset.title}

-

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

- -
-

{likeSummary ? likeSummary.actionCount : 0}

-
- Moderate -
{lang.t('dashboard.no_likes')}
+
+

{lang.t('streams.article')}

+

{lang.t('modqueue.likes')}

+
+
+ { + assets.length + ? assets.map(asset => { + const likeSummary = asset.action_summaries.find(s => s.type === 'LikeAssetActionSummary'); + return ( +
+ Moderate +

{likeSummary ? likeSummary.actionCount : 0}

+ +

{asset.title}

+ +

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

+
+ ); + }) + :
{lang.t('dashboard.no_likes')}
+ } +
); }; diff --git a/client/coral-admin/src/containers/Dashboard/Widget.css b/client/coral-admin/src/containers/Dashboard/Widget.css index 3170cf332..124663cea 100644 --- a/client/coral-admin/src/containers/Dashboard/Widget.css +++ b/client/coral-admin/src/containers/Dashboard/Widget.css @@ -1,5 +1,5 @@ :root { - --row-height: 80px; + --row-height: 60px; } .widget { @@ -11,6 +11,10 @@ background-color: white; } +.widget * { + box-sizing: border-box; +} + .heading { margin: 0; padding-left: 10px; @@ -19,21 +23,28 @@ } .widgetTable { - width: 100%; - border-collapse: collapse; - user-select: none; height: calc(var(--row-height) * 10); } -.widgetTable thead th { +.widgetTable + div:after { + content: ''; + clear: both; + display: block; +} + +.widgetHead p { color: rgb(35, 102, 223); padding: 10px; text-align: left; text-transform: capitalize; + display: inline-block; + box-sizing: border-box; + margin-bottom: 0; } -.widgetTable thead th:last-child { - width: 10%; +.widgetHead p:last-child { + float: right; + margin-right: 100px; } .rowLinkify { @@ -41,6 +52,7 @@ border-bottom: 1px solid lightgrey; color: #555; height: var(--row-height); + padding: 10px; } .rowLinkify:last-child { @@ -51,16 +63,8 @@ background-color: #f8f8f8; } -.widgetTable tbody td { - padding: 10px; -} - -.widgetTable tbody td:last-child { - padding-top: 0; -} - .linkToAsset { - display: block; + display: inline-block; text-decoration: none; } @@ -69,6 +73,8 @@ padding: 10px 14px; text-decoration: none; color: black; + float: right; + margin-left: 15px; } .linkToModerate:hover { @@ -96,4 +102,6 @@ color: #555; font-size: 1.3em; font-weight: 400; + float: right; + margin-top: 7px; } diff --git a/client/coral-admin/src/containers/Streams/Streams.js b/client/coral-admin/src/containers/Streams/Streams.js index 96130fcba..bd5ce6e85 100644 --- a/client/coral-admin/src/containers/Streams/Streams.js +++ b/client/coral-admin/src/containers/Streams/Streams.js @@ -80,8 +80,8 @@ class Streams extends Component {
- {closed ? lang.t('streams.closed') : lang.t('streams.open')} {!statusMenuOpen && } + {closed ? lang.t('streams.closed') : lang.t('streams.open')}
{ statusMenuOpen &&