diff --git a/app/javascript/flavours/glitch/features/ui/components/columns_area.jsx b/app/javascript/flavours/glitch/features/ui/components/columns_area.jsx
index f3e1bfe492..9166499c5a 100644
--- a/app/javascript/flavours/glitch/features/ui/components/columns_area.jsx
+++ b/app/javascript/flavours/glitch/features/ui/components/columns_area.jsx
@@ -58,6 +58,7 @@ const TabsBarPortal = () => {
export default class ColumnsArea extends ImmutablePureComponent {
static propTypes = {
columns: ImmutablePropTypes.list.isRequired,
+ isModalOpen: PropTypes.bool.isRequired,
singleColumn: PropTypes.bool,
children: PropTypes.node,
openSettings: PropTypes.func,
@@ -145,7 +146,7 @@ export default class ColumnsArea extends ImmutablePureComponent {
};
render () {
- const { columns, children, singleColumn, openSettings } = this.props;
+ const { columns, children, singleColumn, isModalOpen, openSettings } = this.props;
const { renderComposePanel } = this.state;
if (singleColumn) {
@@ -172,7 +173,7 @@ export default class ColumnsArea extends ImmutablePureComponent {
}
return (
-
+
{columns.map(column => {
const params = column.get('params', null) === null ? null : column.get('params').toJS();
const other = params && params.other ? params.other : {};
diff --git a/app/javascript/flavours/glitch/features/ui/containers/columns_area_container.js b/app/javascript/flavours/glitch/features/ui/containers/columns_area_container.js
index a69abfb610..b11bcade5c 100644
--- a/app/javascript/flavours/glitch/features/ui/containers/columns_area_container.js
+++ b/app/javascript/flavours/glitch/features/ui/containers/columns_area_container.js
@@ -6,6 +6,7 @@ import ColumnsArea from '../components/columns_area';
const mapStateToProps = state => ({
columns: state.getIn(['settings', 'columns']),
+ isModalOpen: !!state.get('modal').modalType,
});
const mapDispatchToProps = dispatch => ({
diff --git a/app/javascript/flavours/glitch/styles/components.scss b/app/javascript/flavours/glitch/styles/components.scss
index efae501756..f08a6017f3 100644
--- a/app/javascript/flavours/glitch/styles/components.scss
+++ b/app/javascript/flavours/glitch/styles/components.scss
@@ -2626,6 +2626,10 @@ a.account__display-name {
overflow-x: auto;
position: relative;
+ &.unscrollable {
+ overflow-x: hidden;
+ }
+
&__panels {
display: flex;
justify-content: center;