mirror of https://github.com/vector-im/riot-web
more lightbox tweaks
parent
ae2768af9c
commit
8239e57fa1
|
@ -45,8 +45,8 @@ limitations under the License.
|
||||||
/* min-width hack needed for FF */
|
/* min-width hack needed for FF */
|
||||||
min-width: 0px;
|
min-width: 0px;
|
||||||
height: 90%;
|
height: 90%;
|
||||||
-webkit-flex: 5;
|
-webkit-flex: 15;
|
||||||
flex: 5 5 0;
|
flex: 15 15 0;
|
||||||
|
|
||||||
display: -webkit-flex;
|
display: -webkit-flex;
|
||||||
display: flex;
|
display: flex;
|
||||||
|
@ -110,6 +110,10 @@ limitations under the License.
|
||||||
border: 1px solid #fff;
|
border: 1px solid #fff;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.mx_ImageView_size {
|
||||||
|
font-size: 12px;
|
||||||
|
}
|
||||||
|
|
||||||
.mx_ImageView_link {
|
.mx_ImageView_link {
|
||||||
color: #fff ! important;
|
color: #fff ! important;
|
||||||
text-decoration: none ! important;
|
text-decoration: none ! important;
|
||||||
|
|
|
@ -90,14 +90,22 @@ module.exports = React.createClass({
|
||||||
height: displayHeight
|
height: displayHeight
|
||||||
};
|
};
|
||||||
*/
|
*/
|
||||||
var style;
|
var style, res;
|
||||||
|
|
||||||
|
if (this.props.width && this.props.height) {
|
||||||
|
style = {
|
||||||
|
width: this.props.width,
|
||||||
|
height: this.props.height,
|
||||||
|
};
|
||||||
|
res = ", " + style.width + "x" + style.height + "px";
|
||||||
|
}
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<div className="mx_ImageView">
|
<div className="mx_ImageView">
|
||||||
<div className="mx_ImageView_lhs">
|
<div className="mx_ImageView_lhs">
|
||||||
</div>
|
</div>
|
||||||
<div className="mx_ImageView_content">
|
<div className="mx_ImageView_content">
|
||||||
<img src={this.props.src} width={this.props.width} height={this.props.height}/>
|
<img src={this.props.src} style={style}/>
|
||||||
<div className="mx_ImageView_labelWrapper">
|
<div className="mx_ImageView_labelWrapper">
|
||||||
<div className="mx_ImageView_label">
|
<div className="mx_ImageView_label">
|
||||||
<div className="mx_ImageView_shim">
|
<div className="mx_ImageView_shim">
|
||||||
|
@ -110,7 +118,8 @@ module.exports = React.createClass({
|
||||||
</div>
|
</div>
|
||||||
<a className="mx_ImageView_link" href={ this.props.src } target="_blank">
|
<a className="mx_ImageView_link" href={ this.props.src } target="_blank">
|
||||||
<div className="mx_ImageView_download">
|
<div className="mx_ImageView_download">
|
||||||
Download this file ({ filesize(this.props.mxEvent.getContent().info.size) })
|
Download this file<br/>
|
||||||
|
<span className="mx_ImageView_size">({ filesize(this.props.mxEvent.getContent().info.size) }{ res })</span>
|
||||||
</div>
|
</div>
|
||||||
</a>
|
</a>
|
||||||
<div className="mx_ImageView_button">
|
<div className="mx_ImageView_button">
|
||||||
|
|
Loading…
Reference in New Issue