diff --git a/frontend/src/Components/Menu/FilterMenu.js b/frontend/src/Components/Menu/FilterMenu.js
index d989605e5..408069fca 100644
--- a/frontend/src/Components/Menu/FilterMenu.js
+++ b/frontend/src/Components/Menu/FilterMenu.js
@@ -57,6 +57,7 @@ class FilterMenu extends Component {
>
diff --git a/frontend/src/Components/Menu/PageMenuButton.css b/frontend/src/Components/Menu/PageMenuButton.css
index d979a1708..f207d5232 100644
--- a/frontend/src/Components/Menu/PageMenuButton.css
+++ b/frontend/src/Components/Menu/PageMenuButton.css
@@ -6,6 +6,12 @@
}
}
+.indicatorContainer {
+ position: absolute;
+ top: 10px;
+ right: 12px;
+}
+
.label {
margin-left: 5px;
}
diff --git a/frontend/src/Components/Menu/PageMenuButton.js b/frontend/src/Components/Menu/PageMenuButton.js
index abbfc98f8..8c7a86740 100644
--- a/frontend/src/Components/Menu/PageMenuButton.js
+++ b/frontend/src/Components/Menu/PageMenuButton.js
@@ -1,12 +1,15 @@
+import classNames from 'classnames';
import PropTypes from 'prop-types';
import React from 'react';
import Icon from 'Components/Icon';
import MenuButton from 'Components/Menu/MenuButton';
+import { icons } from 'Helpers/Props';
import styles from './PageMenuButton.css';
function PageMenuButton(props) {
const {
iconName,
+ showIndicator,
text,
...otherProps
} = props;
@@ -21,6 +24,22 @@ function PageMenuButton(props) {
size={18}
/>
+ {
+ showIndicator ?
+
+
+ :
+ null
+ }
+
{text}
@@ -30,7 +49,12 @@ function PageMenuButton(props) {
PageMenuButton.propTypes = {
iconName: PropTypes.object.isRequired,
+ showIndicator: PropTypes.bool.isRequired,
text: PropTypes.string
};
+PageMenuButton.defaultProps = {
+ showIndicator: false
+};
+
export default PageMenuButton;
diff --git a/frontend/src/Components/Menu/ToolbarMenuButton.css b/frontend/src/Components/Menu/ToolbarMenuButton.css
index 71e966c71..64abcfacc 100644
--- a/frontend/src/Components/Menu/ToolbarMenuButton.css
+++ b/frontend/src/Components/Menu/ToolbarMenuButton.css
@@ -7,6 +7,12 @@
text-align: center;
}
+.indicatorContainer {
+ position: absolute;
+ top: 10px;
+ right: 12px;
+}
+
.labelContainer {
composes: labelContainer from '~Components/Page/Toolbar/PageToolbarButton.css';
}
diff --git a/frontend/src/Components/Menu/ToolbarMenuButton.js b/frontend/src/Components/Menu/ToolbarMenuButton.js
index fe06793f6..ba575753a 100644
--- a/frontend/src/Components/Menu/ToolbarMenuButton.js
+++ b/frontend/src/Components/Menu/ToolbarMenuButton.js
@@ -1,12 +1,15 @@
+import classNames from 'classnames';
import PropTypes from 'prop-types';
import React from 'react';
import Icon from 'Components/Icon';
import MenuButton from 'Components/Menu/MenuButton';
+import { icons } from 'Helpers/Props';
import styles from './ToolbarMenuButton.css';
function ToolbarMenuButton(props) {
const {
iconName,
+ showIndicator,
text,
...otherProps
} = props;
@@ -22,6 +25,22 @@ function ToolbarMenuButton(props) {
size={21}
/>
+ {
+ showIndicator ?
+
+
+ :
+ null
+ }
+
{text}
@@ -34,7 +53,12 @@ function ToolbarMenuButton(props) {
ToolbarMenuButton.propTypes = {
iconName: PropTypes.object.isRequired,
+ showIndicator: PropTypes.bool.isRequired,
text: PropTypes.string
};
+ToolbarMenuButton.defaultProps = {
+ showIndicator: false
+};
+
export default ToolbarMenuButton;