Chapril/xmpp.chapril.org-conversejs
Chapril/xmpp.chapril.org-conversejs
25
0
Fork 0
Code Issues Pull Requests Projects Releases Activity

Set max widths with embedded audio and video content

Browse Source
This commit is contained in:
JC Brand 2021-06-24 12:51:02 +02:00
parent 846dfd6762
commit 670f435c64
1 changed files with 30 additions and 2 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

32
src/shared/chat/styles/message-body.scss
View File

@ -1,9 +1,37 @@
@import "bootstrap/scss/functions";
@import "bootstrap/scss/variables";
@import "shared/styles/_mixins.scss";
converse-chat-message-body { converse-chat-message-body {
audio { audio {
width: 100%; display: block;
@include media-breakpoint-down(sm) {
max-width: 95%;
}
@include media-breakpoint-up(md) {
max-width: 75%;
}
@include media-breakpoint-up(lg) {
max-width: 66%;
}
@include media-breakpoint-up(xl) {
max-width: 50%;
}
} }
video { video {
max-height: 25vh; display: block;
@include media-breakpoint-down(sm) {
max-width: 95%;
}
@include media-breakpoint-up(md) {
max-width: 75%;
}
@include media-breakpoint-up(lg) {
max-width: 66%;
}
@include media-breakpoint-up(xl) {
max-width: 50%;
}
} }
} }