diff --git a/res/css/views/messages/_MVideoBody.scss b/res/css/views/messages/_MVideoBody.scss index ac3491bc8f..2be15447f7 100644 --- a/res/css/views/messages/_MVideoBody.scss +++ b/res/css/views/messages/_MVideoBody.scss @@ -17,7 +17,7 @@ limitations under the License. span.mx_MVideoBody { video.mx_MVideoBody { max-width: 100%; - height: auto; + max-height: 300px; border-radius: 4px; } } diff --git a/res/css/views/rooms/_LinkPreviewWidget.scss b/res/css/views/rooms/_LinkPreviewWidget.scss index 022cf3ed28..5310bd3bbb 100644 --- a/res/css/views/rooms/_LinkPreviewWidget.scss +++ b/res/css/views/rooms/_LinkPreviewWidget.scss @@ -19,6 +19,8 @@ limitations under the License. margin-right: 15px; margin-bottom: 15px; display: flex; + flex-direction: column; + max-width: 360px; border-left: 4px solid $preview-widget-bar-color; color: $preview-widget-fg-color; } @@ -55,6 +57,9 @@ limitations under the License. cursor: pointer; width: 18px; height: 18px; + padding: 0px 5px 5px 5px; + margin-left: auto; + margin-right: 0px; img { flex: 0 0 40px; diff --git a/src/components/views/messages/MImageBody.js b/src/components/views/messages/MImageBody.js index a8cdc17abf..8456a5bd09 100644 --- a/src/components/views/messages/MImageBody.js +++ b/src/components/views/messages/MImageBody.js @@ -362,7 +362,7 @@ export default class MImageBody extends React.Component { } // The maximum height of the thumbnail as it is rendered as an - const maxHeight = Math.min(this.props.maxImageHeight || 600, infoHeight); + const maxHeight = Math.min(this.props.maxImageHeight || 240, infoHeight); // The maximum width of the thumbnail, as dictated by its natural // maximum height. const maxWidth = infoWidth * maxHeight / infoHeight; diff --git a/src/components/views/rooms/LinkPreviewWidget.js b/src/components/views/rooms/LinkPreviewWidget.js index 2a053bf467..458b3e7054 100644 --- a/src/components/views/rooms/LinkPreviewWidget.js +++ b/src/components/views/rooms/LinkPreviewWidget.js @@ -107,7 +107,7 @@ export default class LinkPreviewWidget extends React.Component { if (!SettingsStore.getValue("showImages")) { image = null; // Don't render a button to show the image, just hide it outright } - const imageMaxWidth = 100; const imageMaxHeight = 100; + const imageMaxWidth = 320; const imageMaxHeight = 240; if (image && image.startsWith("mxc://")) { image = MatrixClientPeg.get().mxcUrlToHttp(image, imageMaxWidth, imageMaxHeight); } @@ -134,6 +134,10 @@ export default class LinkPreviewWidget extends React.Component { const AccessibleButton = sdk.getComponent('elements.AccessibleButton'); return (
+ + + { img }
{ p["og:title"] }
@@ -142,10 +146,6 @@ export default class LinkPreviewWidget extends React.Component { { description }
- - - ); }