1
0
mirror of https://github.com/yldio/copilot.git synced 2024-11-28 14:10:04 +02:00

adding in overflow scroll for mobile org tabs

This commit is contained in:
Alex Windett 2017-02-28 15:29:36 +00:00 committed by Sérgio Ramos
parent f8c3da4bc6
commit dcbb211927

View File

@ -9,6 +9,7 @@ import { colors } from '@ui/shared/constants';
import PropTypes from '@root/prop-types'; import PropTypes from '@root/prop-types';
import { orgsSelector } from '@state/selectors'; import { orgsSelector } from '@state/selectors';
import { remcalc } from '@ui/shared/functions'; import { remcalc } from '@ui/shared/functions';
import { breakpoints } from '@ui/shared/constants';
import Tabs, { Tab } from '@ui/components/tabs'; import Tabs, { Tab } from '@ui/components/tabs';
@ -55,7 +56,21 @@ const NavLi = styled(NavLink)`
`; `;
const StyledTabs = styled(Tabs)` const StyledTabs = styled(Tabs)`
padding-top: ${remcalc(12)} padding-top: ${remcalc(12)};
${breakpoints.smallOnly`
display: inline-block;
white-space: nowrap;
`}
`;
const StyledContainer = styled(Container)`
${breakpoints.smallOnly`
overflow: scroll;
display: flex;
`}
`; `;
const OrgNavigation = ({ const OrgNavigation = ({
@ -94,11 +109,11 @@ const OrgNavigation = ({
return ( return (
<StyledNav> <StyledNav>
<Container> <StyledContainer>
<StyledTabs name='organisation-navigation-group'> <StyledTabs name='organisation-navigation-group'>
{navLinks} {navLinks}
</StyledTabs> </StyledTabs>
</Container> </StyledContainer>
</StyledNav> </StyledNav>
); );
}; };