91 lines
1.1 KiB
SCSS
91 lines
1.1 KiB
SCSS
|
///////////////////
|
||
|
|
// //
|
||
|
|
// MEDIAS //
|
||
|
|
// //
|
||
|
|
///////////////////
|
||
|
|
|
||
|
|
.audio,
|
||
|
|
.stream {
|
||
|
|
border: $dark-polar solid 1px;
|
||
|
|
|
||
|
|
audio {
|
||
|
|
border-radius: .5rem;
|
||
|
|
width: 100%;
|
||
|
|
}
|
||
|
|
|
||
|
|
figcaption p {
|
||
|
|
font-size: $font-size-small;
|
||
|
|
padding-left: .5rem;
|
||
|
|
text-align: left;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
.audio-with-image {
|
||
|
|
display: flex;
|
||
|
|
flex-direction: column;
|
||
|
|
|
||
|
|
@include breakpoint(tablet) {
|
||
|
|
flex-direction: row;
|
||
|
|
|
||
|
|
img {
|
||
|
|
width: 8rem;
|
||
|
|
}
|
||
|
|
|
||
|
|
div {
|
||
|
|
align-content: space-between;
|
||
|
|
display: flex;
|
||
|
|
flex-flow: wrap;
|
||
|
|
}
|
||
|
|
|
||
|
|
}
|
||
|
|
|
||
|
|
|
||
|
|
@include breakpoint(laptop) {
|
||
|
|
|
||
|
|
div {
|
||
|
|
flex-grow: 4;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
audio {
|
||
|
|
border-radius: 0;
|
||
|
|
}
|
||
|
|
|
||
|
|
}
|
||
|
|
|
||
|
|
figure {
|
||
|
|
display: flex;
|
||
|
|
flex-direction: column;
|
||
|
|
align-items: center;
|
||
|
|
margin: auto;
|
||
|
|
|
||
|
|
@include breakpoint(laptop) {
|
||
|
|
|
||
|
|
}
|
||
|
|
|
||
|
|
img {
|
||
|
|
max-width: 90%;
|
||
|
|
}
|
||
|
|
|
||
|
|
figcaption {
|
||
|
|
font-size: $font-size-small;
|
||
|
|
|
||
|
|
p {
|
||
|
|
margin: .2rem 0;
|
||
|
|
text-align: center;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
.post-image {
|
||
|
|
border: none;
|
||
|
|
margin-left: 0;
|
||
|
|
padding-left: 0;
|
||
|
|
|
||
|
|
@include breakpoint(laptop) {
|
||
|
|
max-width: 97%;
|
||
|
|
margin-right: 0;
|
||
|
|
padding-right: 0;
|
||
|
|
}
|
||
|
|
}
|