Merge pull request #5737 from strapi/fix/media-lib-ui

Fix the modal list view in the Media Library
This commit is contained in:
cyril lopez 2020-04-07 19:35:59 +02:00 committed by GitHub
commit 4581a4cf35
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
6 changed files with 17 additions and 9 deletions

View File

@ -3,7 +3,7 @@ import PropTypes from 'prop-types';
const Wrapper = styled.div` const Wrapper = styled.div`
width: 100%; width: 100%;
margin-bottom: 34px; margin-bottom: 17px;
overflow: hidden; overflow: hidden;
&:hover { &:hover {
cursor: ${({ isDraggable }) => (isDraggable ? 'move' : 'pointer')}; cursor: ${({ isDraggable }) => (isDraggable ? 'move' : 'pointer')};

View File

@ -7,7 +7,7 @@
import styled from 'styled-components'; import styled from 'styled-components';
const BackButton = styled.button` const BackButton = styled.button`
height: 6rem; height: 5.9rem;
width: 6.5rem; width: 6.5rem;
margin-right: 20px; margin-right: 20px;
margin-left: -30px; margin-left: -30px;

View File

@ -1,7 +1,7 @@
import styled from 'styled-components'; import styled from 'styled-components';
const Wrapper = styled.div` const Wrapper = styled.div`
max-height: 44rem; max-height: 48.3rem;
overflow: overlay; overflow: overlay;
`; `;

View File

@ -2,11 +2,9 @@ import styled from 'styled-components';
import ContainerFluid from '../ContainerFluid'; import ContainerFluid from '../ContainerFluid';
const Container = styled(ContainerFluid)` const Container = styled(ContainerFluid)`
margin-bottom: 4px; margin-bottom: 3px;
padding-top: 15px; padding-top: 15px;
max-height: 339px; max-height: 357px;
overflow: overlay;
overflow-x: hidden;
`; `;
export default Container; export default Container;

View File

@ -0,0 +1,9 @@
import styled from 'styled-components';
import ModalSection from '../ModalSection';
const CustomModalSection = styled(ModalSection)`
overflow: overlay;
`;
export default CustomModalSection;

View File

@ -11,6 +11,7 @@ import ButtonWrapper from './ButtonWrapper';
import RowItem from './RowItem'; import RowItem from './RowItem';
import ListTitle from './ListTitle'; import ListTitle from './ListTitle';
import ListTitleWrapper from './ListTitleWrapper'; import ListTitleWrapper from './ListTitleWrapper';
import CustomModalSection from './CustomModalSection';
const UploadList = ({ const UploadList = ({
filesToUpload, filesToUpload,
@ -47,7 +48,7 @@ const UploadList = ({
</Button> </Button>
</ButtonWrapper> </ButtonWrapper>
</ModalSection> </ModalSection>
<ModalSection> <CustomModalSection>
<Container> <Container>
{matrix.map(({ key, rowContent }) => { {matrix.map(({ key, rowContent }) => {
return ( return (
@ -67,7 +68,7 @@ const UploadList = ({
); );
})} })}
</Container> </Container>
</ModalSection> </CustomModalSection>
</> </>
); );
}; };