You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
plain-ui/src/scss/components/_media.scss

43 lines
933 B

/**
* <figure class="media-figure">
* <img class="media__img" src="https://via.placeholder.com/150" />
* <figcaption class="media-figure__caption">
* food truck yr franzen pabst
* </figcaption>
* </figure>
*
*/
@mixin plain-ui__component__media()
{
.figure {
margin: 0;
display: inline-block;
line-height: 0;
border: 1px solid $plain-ui__primary-light;
border-radius: 2px;
overflow: hidden;
&__caption {
padding: 0.75em 1.1em;
font-size: 0.7rem;
background: $plain-ui__primary-light;
line-height: $plain-ui__line-height;
margin: 0;
color: white;
}
img.media {
border: 0;
}
}
img.media {
border-radius: 2px;
border: 1px solid $plain-ui__primary-light;
width: 100%;
height: auto;
}
}