diff --git a/src/channels/components/ChannelsFilterMenu/ChannelsFilterMenu.js b/src/channels/components/ChannelsFilterMenu/ChannelsFilterMenu.js index fdfccf3cde5fcb7a623ead179096229631c095f5..275830996cd78350b5741a0364b14ec42a1f9194 100644 --- a/src/channels/components/ChannelsFilterMenu/ChannelsFilterMenu.js +++ b/src/channels/components/ChannelsFilterMenu/ChannelsFilterMenu.js @@ -20,7 +20,7 @@ const ChannelsFilterMenu = ({ }) => { return ( <> - <Menu vertical color="blue" size="small"> + <Menu fluid vertical color="blue" size="small"> <Menu.Item as={Link} name={ALL_CHANNELS} @@ -79,7 +79,7 @@ const ChannelsFilterMenu = ({ My subscriptions </Menu.Item> </Menu> - <Menu vertical color="blue" size="small"> + <Menu fluid vertical color="blue" size="small"> <Menu.Item as={Link} name={FAVORITE_CHANNELS} diff --git a/src/channels/pages/AllChannelsPage/AllChannelsPage.js b/src/channels/pages/AllChannelsPage/AllChannelsPage.js index fc4485ce717248700593fdbbbcef50a7140fff75..683a0fcb924d587f58af67ec9206dd1ec4985a11 100644 --- a/src/channels/pages/AllChannelsPage/AllChannelsPage.js +++ b/src/channels/pages/AllChannelsPage/AllChannelsPage.js @@ -10,7 +10,6 @@ import SearchChannelComponent from 'channels/components/SearchChannelComponent/S import AddChannel from 'channels/components/AddChannel/AddChannel'; import AddMute from 'mutes/components/AddMute'; import * as getMutesActionCreator from 'mutes/actions/mutes'; -import * as getCategoriesActionCreator from 'channels/actions/GetCategories'; import * as getTagsActionCreator from 'channels/actions/GetTags'; import * as paginationActionCreators from 'channels/actions/PaginationActions'; import CategoryDropdown from 'common/components/CategoryDropdown/CategoryDropdown'; @@ -26,7 +25,6 @@ const AllChannelsPage = ({ globalMutes, tags, loadingTags, - getCategories, getTags, getChannelsQuery, setGetChannelsQuery, @@ -62,7 +60,7 @@ const AllChannelsPage = ({ }); return ( - <Container> + <Container className="all-channels-page"> <Segment basic> <Helmet> <title>{TITLE}</title> @@ -76,7 +74,7 @@ const AllChannelsPage = ({ </Grid.Row> <Grid.Row> {isAuthenticated && ( - <Grid.Column width={3} style={{minWidth: 200}}> + <Grid.Column width={4} style={{minWidth: 300}}> <ChannelsFilterMenu /> <Header as="h4">Filter</Header> <Form className="channel-filters"> @@ -115,7 +113,7 @@ const AllChannelsPage = ({ localStorage.setItem('ChannelListExpanded', (!expanded).toString()); }} toggle - label={{children: expanded ? 'Expanded' : 'Collapsed'}} + label="Expanded" style={{marginBottom: '10px'}} /> <Header as="h4">Actions</Header> @@ -155,7 +153,6 @@ const mapStateToProps = state => { const mapDispatchToProps = dispatch => { return { ...bindActionCreators(getMutesActionCreator, dispatch), - ...bindActionCreators(getCategoriesActionCreator, dispatch), ...bindActionCreators(getTagsActionCreator, dispatch), ...bindActionCreators(paginationActionCreators, dispatch), }; diff --git a/src/channels/pages/AllChannelsPage/AllChannelsPage.scss b/src/channels/pages/AllChannelsPage/AllChannelsPage.scss index 5f9b257a5c386bc2410ba6a70495c5780674a429..46bf4da1bb260a89d395db5846a22a87952653c2 100644 --- a/src/channels/pages/AllChannelsPage/AllChannelsPage.scss +++ b/src/channels/pages/AllChannelsPage/AllChannelsPage.scss @@ -1,18 +1,15 @@ -.channel-filters { - &.ui.form { - max-width: none; - - .field { - margin: 0; - } +.all-channels-page { + @media only screen and (max-width: 1279px) { + width: 100% !important; } - width: 13rem; - .CategorySegment .CategorySelector { - width: 100%; - } + .channel-filters { + &.ui.form { + max-width: none; - .ui.selection.dropdown { - min-width: 13rem; + .field { + margin: 0; + } + } } }