diff --git a/res/css/views/rooms/_PinnedEventTile.scss b/res/css/views/rooms/_PinnedEventTile.scss
index be6acdf524..fa76f4c679 100644
--- a/res/css/views/rooms/_PinnedEventTile.scss
+++ b/res/css/views/rooms/_PinnedEventTile.scss
@@ -33,13 +33,6 @@ limitations under the License.
padding-bottom: 3px;
}
-.mx_PinnedEventTile .mx_EventTile_content {
- margin-left: 50px;
- position: relative;
- top: 0;
- left: 0;
-}
-
.mx_PinnedEventTile .mx_PinnedEventTile_senderAvatar .mx_BaseAvatar {
float: left;
margin-right: 10px;
@@ -65,3 +58,10 @@ limitations under the License.
display: inline-block;
font-size: 0.7em; // Smaller text to avoid conflicting with the layout
}
+
+.mx_PinnedEventTile_message {
+ margin-left: 50px;
+ position: relative;
+ top: 0;
+ left: 0;
+}
\ No newline at end of file
diff --git a/src/components/views/messages/MImageBody.js b/src/components/views/messages/MImageBody.js
index 8045d43104..4dfd89ec0a 100644
--- a/src/components/views/messages/MImageBody.js
+++ b/src/components/views/messages/MImageBody.js
@@ -40,6 +40,9 @@ export default class extends React.Component {
/* called when the image has loaded */
onWidgetLoad: PropTypes.func.isRequired,
+
+ /* the maximum image height to use */
+ maxImageHeight: PropTypes.number,
}
static contextTypes = {
@@ -249,8 +252,9 @@ export default class extends React.Component {
const content = this.props.mxEvent.getContent();
const timelineWidth = this.refs.body.offsetWidth;
- const maxHeight = 600; // let images take up as much width as they can so long as the height doesn't exceed 600px.
- // the alternative here would be 600*timelineWidth/800; to scale them down to fit inside a 4:3 bounding box
+ const maxHeight = this.props.maxImageHeight || 600; // let images take up as much width as they can so long
+ // as the height doesn't exceed 600px. The alternative here would be 600*timelineWidth/800; to scale them down
+ // to fit inside a 4:3 bounding box
// FIXME: this will break on clientside generated thumbnails (as per e2e rooms)
// which may well be much smaller than the 800x600 bounding box.
diff --git a/src/components/views/messages/MessageEvent.js b/src/components/views/messages/MessageEvent.js
index 7358e297c7..38f55c9d70 100644
--- a/src/components/views/messages/MessageEvent.js
+++ b/src/components/views/messages/MessageEvent.js
@@ -39,8 +39,11 @@ module.exports = React.createClass({
/* callback called when dynamic content in events are loaded */
onWidgetLoad: PropTypes.func,
- /* the shsape of the tile, used */
+ /* the shape of the tile, used */
tileShape: PropTypes.string,
+
+ /* the maximum image height to use, if the event is an image */
+ maxImageHeight: PropTypes.number,
},
getEventTileOps: function() {
@@ -78,6 +81,7 @@ module.exports = React.createClass({
highlightLink={this.props.highlightLink}
showUrlPreview={this.props.showUrlPreview}
tileShape={this.props.tileShape}
+ maxImageHeight={this.props.maxImageHeight}
onWidgetLoad={this.props.onWidgetLoad} />;
},
});
diff --git a/src/components/views/rooms/PinnedEventTile.js b/src/components/views/rooms/PinnedEventTile.js
index 91d656d60b..478454a3d8 100644
--- a/src/components/views/rooms/PinnedEventTile.js
+++ b/src/components/views/rooms/PinnedEventTile.js
@@ -86,7 +86,11 @@ module.exports = React.createClass({
{ sender.name }
-