Fix nested border-radius for attachments
This commit is contained in:
parent
6642652bdb
commit
430d60093a
2 changed files with 38 additions and 9 deletions
|
@ -583,7 +583,6 @@
|
|||
bottom: -10px;
|
||||
}
|
||||
|
||||
border-radius: 16px;
|
||||
line-height: 0;
|
||||
overflow: hidden;
|
||||
|
||||
|
@ -596,18 +595,10 @@
|
|||
|
||||
&--with-content-below {
|
||||
margin-bottom: 7px;
|
||||
border-bottom-left-radius: 0px;
|
||||
border-bottom-right-radius: 0px;
|
||||
}
|
||||
|
||||
&--with-content-above {
|
||||
margin-top: 4px;
|
||||
border-top-left-radius: 0px;
|
||||
border-top-right-radius: 0px;
|
||||
}
|
||||
|
||||
.module-message__container--gif & {
|
||||
border-radius: inherit;
|
||||
}
|
||||
}
|
||||
|
||||
|
|
|
@ -717,6 +717,44 @@ story.add('Image', () => {
|
|||
return renderBothDirections(props);
|
||||
});
|
||||
|
||||
story.add('Multiple Images', () => {
|
||||
const props = createProps({
|
||||
attachments: [
|
||||
{
|
||||
url: '/fixtures/tina-rolf-269345-unsplash.jpg',
|
||||
fileName: 'tina-rolf-269345-unsplash.jpg',
|
||||
contentType: IMAGE_JPEG,
|
||||
width: 128,
|
||||
height: 128,
|
||||
},
|
||||
{
|
||||
url: '/fixtures/tina-rolf-269345-unsplash.jpg',
|
||||
fileName: 'tina-rolf-269345-unsplash.jpg',
|
||||
contentType: IMAGE_JPEG,
|
||||
width: 128,
|
||||
height: 128,
|
||||
},
|
||||
{
|
||||
url: '/fixtures/tina-rolf-269345-unsplash.jpg',
|
||||
fileName: 'tina-rolf-269345-unsplash.jpg',
|
||||
contentType: IMAGE_JPEG,
|
||||
width: 128,
|
||||
height: 128,
|
||||
},
|
||||
{
|
||||
url: '/fixtures/tina-rolf-269345-unsplash.jpg',
|
||||
fileName: 'tina-rolf-269345-unsplash.jpg',
|
||||
contentType: IMAGE_JPEG,
|
||||
width: 128,
|
||||
height: 128,
|
||||
},
|
||||
],
|
||||
status: 'sent',
|
||||
});
|
||||
|
||||
return renderBothDirections(props);
|
||||
});
|
||||
|
||||
story.add('Image with Caption', () => {
|
||||
const props = createProps({
|
||||
attachments: [
|
||||
|
|
Loading…
Add table
Reference in a new issue