diff --git a/client/coral-admin/src/routes/Moderation/components/Moderation.js b/client/coral-admin/src/routes/Moderation/components/Moderation.js index 169c1b3b0..0945b2227 100644 --- a/client/coral-admin/src/routes/Moderation/components/Moderation.js +++ b/client/coral-admin/src/routes/Moderation/components/Moderation.js @@ -224,12 +224,13 @@ class Moderation extends Component { asset={asset} getModPath={getModPath} items={menuItems} - selectSort={this.props.setSortOrder} - sort={this.props.moderation.sortOrder} activeTab={activeTab} />
- + div { - padding: 0; - } - - i { - position: absolute; - top: 7px; - right: 7px; - } - - input { - padding: 0; - font-size: 13px; - letter-spacing: 0.7px; - font-weight: 400; - border-bottom: 0px; - } - - label { - top: -4px; - } - - &:hover { - cursor: pointer; - } -} - .tabIcon { position: relative; top: 3px; font-size: 16px; } - -@media (--big-viewport) { - .tab { - flex: none; - } -} +.tabBarContainer { + margin: 0 auto; +} \ No newline at end of file diff --git a/client/coral-admin/src/routes/Moderation/components/ModerationMenu.js b/client/coral-admin/src/routes/Moderation/components/ModerationMenu.js index 81293d06b..b43d97822 100644 --- a/client/coral-admin/src/routes/Moderation/components/ModerationMenu.js +++ b/client/coral-admin/src/routes/Moderation/components/ModerationMenu.js @@ -2,26 +2,20 @@ import React from 'react'; import PropTypes from 'prop-types'; import CountBadge from '../../../components/CountBadge'; import styles from './ModerationMenu.css'; -import {SelectField, Option} from 'react-mdl-selectfield'; import {Icon} from 'coral-ui'; import {Link} from 'react-router'; import cn from 'classnames'; -import t from 'coral-framework/services/i18n'; - const ModerationMenu = ({ asset = {}, items, - selectSort, - sort, getModPath, activeTab }) => { return (
-
-
-
+
+
{items.map((queue) => )}
- selectSort(sort)}> - - -
); @@ -50,8 +36,6 @@ ModerationMenu.propTypes = { asset: PropTypes.shape({ id: PropTypes.string }), - selectSort: PropTypes.func.isRequired, - sort: PropTypes.string.isRequired, getModPath: PropTypes.func.isRequired, activeTab: PropTypes.string.isRequired, }; diff --git a/client/coral-admin/src/routes/Moderation/components/ViewOptions.css b/client/coral-admin/src/routes/Moderation/components/ViewOptions.css index 79fdc9b44..49acf4caa 100644 --- a/client/coral-admin/src/routes/Moderation/components/ViewOptions.css +++ b/client/coral-admin/src/routes/Moderation/components/ViewOptions.css @@ -5,6 +5,9 @@ width: 220px; position: absolute; padding: 0; + overflow: visible; + height: 144px; + min-height: auto; @media (--tablet) { width: 650px; margin: 0 auto; @@ -33,3 +36,41 @@ .viewOptionsItem { list-style: none; } + +.selectField { + position: relative; + width: 140px; + height: 36px; + top: 5px; + margin-right: 10px; + background: #7B7B7B; + color: white; + padding: 10px 15px; + box-sizing: border-box; + border-radius: 2px; + box-shadow: 0 2px 2px 0 rgba(0,0,0,.14), 0 3px 1px -2px rgba(0,0,0,.2), 0 1px 5px 0 rgba(0,0,0,.12); + + > div { + padding: 0; + } + + i { + position: absolute; + top: 7px; + right: 7px; + } + + input { + font-size: 1rem; + border-bottom: 0px; + font-family: inherit; + } + + label { + top: -4px; + } + + &:hover { + cursor: pointer; + } +} diff --git a/client/coral-admin/src/routes/Moderation/components/ViewOptions.js b/client/coral-admin/src/routes/Moderation/components/ViewOptions.js index 3343d1401..4b6d1dea6 100644 --- a/client/coral-admin/src/routes/Moderation/components/ViewOptions.js +++ b/client/coral-admin/src/routes/Moderation/components/ViewOptions.js @@ -3,9 +3,17 @@ import PropTypes from 'prop-types'; import styles from './ViewOptions.css'; import {Card} from 'coral-ui'; import cn from 'classnames'; +import {SelectField, Option} from 'react-mdl-selectfield'; +import t from 'coral-framework/services/i18n'; class ViewOptions extends React.Component { render() { + + const { + selectSort, + sort + } = this.props; + return (

@@ -15,6 +23,14 @@ class ViewOptions extends React.Component {
  • Sort Comments + selectSort(sort)}> + + +

@@ -23,6 +39,9 @@ class ViewOptions extends React.Component { } } -ViewOptions.propTypes = {}; +ViewOptions.propTypes = { + selectSort: PropTypes.func.isRequired, + sort: PropTypes.string.isRequired +}; export default ViewOptions;