KNACSS/sass/components/_media.scss
2017-08-29 15:53:26 +02:00

25 lines
569 B
SCSS

/* ----------------------------- */
/* ==Media object */
/* ----------------------------- */
/* recommanded HTML : <div class="media"><img class="media-figure"><div class="media-content"></div></div> */
/* see http://codepen.io/raphaelgoetter/pen/KMWWwj */
@media (min-width: $tiny) {
.media {
display: flex;
align-items: flex-start;
&-content {
flex: 1;
}
// vertical align image
&-figure--center {
align-self: center;
}
// reverse variant
&--reverse {
flex-direction: row-reverse;
}
}
}