yujunjun/strapi
1
0
Fork 0
mirror of https://github.com/strapi/strapi.git synced 2025-12-27 15:13:21 +00:00
Code Issues Packages Projects Releases Wiki Activity

Merge pull request #15467 from strapi/fix/relations-list-shadow

Browse Source
This commit is contained in:
Josh 2023-01-16 17:51:10 +00:00 committed by GitHub
commit 3cba5b79b3
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
3 changed files with 30 additions and 10 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

16
packages/core/admin/admin/src/content-manager/components/RelationInput/components/RelationList.js
View File

@ -18,18 +18,22 @@ const ShadowBox = styled(Box)`
&:before {
/* TODO: as for DS Table component we would need this to be handled by the DS theme */
content: ${({ overflowDirection }) =>
overflowDirection === 'top-bottom' || overflowDirection === 'top' ? "''" : undefined};
background: linear-gradient(rgba(33, 33, 52, 0.1) 0%, rgba(0, 0, 0, 0) 100%);
content: '';
background: linear-gradient(rgba(3, 3, 5, 0.2) 0%, rgba(0, 0, 0, 0) 100%);
top: 0;
opacity: ${({ overflowDirection }) =>
overflowDirection === 'top-bottom' || overflowDirection === 'top' ? 1 : 0};
transition: opacity 0.2s ease-in-out;
}
&:after {
/* TODO: as for DS Table component we would need this to be handled by the DS theme */
content: ${({ overflowDirection }) =>
overflowDirection === 'top-bottom' || overflowDirection === 'bottom' ? "''" : undefined};
background: linear-gradient(rgba(0, 0, 0, 0) 0%, rgba(33, 33, 52, 0.1) 100%);
content: '';
background: linear-gradient(0deg, rgba(3, 3, 5, 0.2) 0%, rgba(0, 0, 0, 0) 100%);
bottom: 0;
opacity: ${({ overflowDirection }) =>
overflowDirection === 'top-bottom' || overflowDirection === 'bottom' ? 1 : 0};
transition: opacity 0.2s ease-in-out;
}
`;

12
packages/core/admin/admin/src/content-manager/components/RelationInput/components/tests/__snapshots__/RelationList.test.js.snap
View File

@ -99,13 +99,21 @@ exports[`Content-Manager || RelationInput || RelationList should render and matc
}
.c0:before {
background: linear-gradient(rgba(33,33,52,0.1) 0%,rgba(0,0,0,0) 100%);
content: '';
background: linear-gradient(rgba(3,3,5,0.2) 0%,rgba(0,0,0,0) 100%);
top: 0;
opacity: 0;
-webkit-transition: opacity 0.2s ease-in-out;
transition: opacity 0.2s ease-in-out;
}
.c0:after {
background: linear-gradient(rgba(0,0,0,0) 0%,rgba(33,33,52,0.1) 100%);
content: '';
background: linear-gradient(0deg,rgba(3,3,5,0.2) 0%,rgba(0,0,0,0) 100%);
bottom: 0;
opacity: 0;
-webkit-transition: opacity 0.2s ease-in-out;
transition: opacity 0.2s ease-in-out;
}
<div>

12
packages/core/admin/admin/src/content-manager/components/RelationInput/tests/__snapshots__/RelationInput.test.js.snap
View File

@ -546,13 +546,21 @@ exports[`Content-Manager || RelationInput should render and match snapshot 1`] =
}
.c14:before {
background: linear-gradient(rgba(33,33,52,0.1) 0%,rgba(0,0,0,0) 100%);
content: '';
background: linear-gradient(rgba(3,3,5,0.2) 0%,rgba(0,0,0,0) 100%);
top: 0;
opacity: 0;
-webkit-transition: opacity 0.2s ease-in-out;
transition: opacity 0.2s ease-in-out;
}
.c14:after {
background: linear-gradient(rgba(0,0,0,0) 0%,rgba(33,33,52,0.1) 100%);
content: '';
background: linear-gradient(0deg,rgba(3,3,5,0.2) 0%,rgba(0,0,0,0) 100%);
bottom: 0;
opacity: 0;
-webkit-transition: opacity 0.2s ease-in-out;
transition: opacity 0.2s ease-in-out;
}
.c28 {