vitalif
/
react-toolbox
1
0
Fork 0
Code Issues Pull Requests Releases 12 Wiki Activity

Allow CardMedia to have flexible height per documentation 

The documentation for CardMedia specifies that if the `aspectRatio`
property is not set, the media will have a flexible height.  The
existing implementation did not provide this, and would instead always
render with a height of `0`, effectively hiding the element.

This change should bring the component into line with the documentation.
old
Peter Fern 2015-12-16 10:23:44 +11:00
parent 211d542b7f
commit ae3f4a51aa
1 changed files with 6 additions and 3 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

9
components/card/style.scss
View File

@ -20,12 +20,16 @@
.cardMedia {
position: relative;
height: 0;
background-repeat: no-repeat;
background-position: center center;
background-size: cover;
&.wide, &.square {
height: 0;
width: 100%;
.content {
position: absolute;
height: 100%;
}
.content > iframe, .content > video, .content > img {
max-width: 100%;
}
@ -37,12 +41,11 @@
padding-top: 100%;
}
.content {
position: absolute;
position: relative;
top: 0;
left: 0;
display: flex;
width: 100%;
height: 100%;
flex-direction: column;
justify-content: flex-end;
overflow: hidden;