From 363e3f4e211b3a853e2f801d26318f111d401783 Mon Sep 17 00:00:00 2001
From: Matthew Hodgson <matthew@matrix.org>
Date: Sun, 25 Oct 2015 23:33:28 +0000
Subject: [PATCH] image viewing tweaks

---
 src/skins/vector/css/common.css                | 11 +++++++----
 src/skins/vector/views/molecules/MImageTile.js |  6 +++---
 2 files changed, 10 insertions(+), 7 deletions(-)

diff --git a/src/skins/vector/css/common.css b/src/skins/vector/css/common.css
index 6c868b8d18..3b63aeaf31 100644
--- a/src/skins/vector/css/common.css
+++ b/src/skins/vector/css/common.css
@@ -128,10 +128,13 @@ a:visited {
     max-width: 75%;
 }
 
-.mx_ImageView {
-    margin: 6px;
-    /* hack: flexbox bug? */
-    margin-bottom: 4px;
+.mx_Dialog_lightbox .mx_Dialog_background {
+    opacity: 0.85;
+}
+
+.mx_Dialog_lightbox .mx_Dialog {
+    border-radius: 0px;
+    background-color: #000;
 }
 
 .mx_Dialog_content {
diff --git a/src/skins/vector/views/molecules/MImageTile.js b/src/skins/vector/views/molecules/MImageTile.js
index 59d9cfde7e..7984921d4e 100644
--- a/src/skins/vector/views/molecules/MImageTile.js
+++ b/src/skins/vector/views/molecules/MImageTile.js
@@ -61,7 +61,7 @@ module.exports = React.createClass({
                 src: httpUrl,
                 width: content.info.w,
                 height: content.info.h
-            });
+            }, "mx_Dialog_lightbox");
         }
     },
 
@@ -70,7 +70,7 @@ module.exports = React.createClass({
         var cli = MatrixClientPeg.get();
 
         var thumbHeight = null;
-        if (content.info) thumbHeight = this.thumbHeight(content.info.w, content.info.h, 320, 240);
+        if (content.info) thumbHeight = this.thumbHeight(content.info.w, content.info.h, 480, 360);
 
         var imgStyle = {};
         if (thumbHeight) imgStyle['height'] = thumbHeight;
@@ -78,7 +78,7 @@ module.exports = React.createClass({
         return (
             <span className="mx_MImageTile">
                 <a href={cli.mxcUrlToHttp(content.url)} onClick={ this.onClick }>
-                    <img className="mx_MImageTile_thumbnail" src={cli.mxcUrlToHttp(content.url, 320, 240)} alt={content.body} style={imgStyle} />
+                    <img className="mx_MImageTile_thumbnail" src={cli.mxcUrlToHttp(content.url, 480, 360)} alt={content.body} style={imgStyle} />
                 </a>
                 <div className="mx_MImageTile_download">
                     <a href={cli.mxcUrlToHttp(content.url)} target="_blank">