-
-
+
+
{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;