OpenCloud
/
riot-web
mirror of https://github.com/vector-im/riot-web
1
0
Fork 0
Code Issues Releases Wiki Activity

Use height and width properties for scaling again 

Signed-off-by: Šimon Brandner <simon.bra.ag@gmail.com>
pull/21833/head
Šimon Brandner 2020-12-20 10:07:03 +01:00
parent ec5fcaf59b
commit be9b68a4dd
2 changed files with 11 additions and 7 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

11
res/css/views/elements/_ImageView.scss
View File

@ -33,17 +33,18 @@ limitations under the License.
} }
.mx_ImageView_imageBox { .mx_ImageView_imageBox {
overflow: auto; overflow: scroll;
margin: 0 50px 50px 50px;
display: flex; display: flex;
height: 100%; flex-grow: 1;
}
.mainImage {
margin: auto;
} }
.mx_ImageView_content img { .mx_ImageView_content img {
object-fit: contain; object-fit: contain;
pointer-events: all; pointer-events: all;
//margin: auto;
//margin: 0 auto 0 auto;
} }
.mx_ImageView_panel { .mx_ImageView_panel {

7
src/components/views/elements/ImageView.js
View File

@ -163,6 +163,10 @@ export default class ImageView extends React.Component {
}; };
*/ */
let res; let res;
const style = {
height: this.state.zoom + "%",
width: this.state.zoom + "%",
};
if (this.props.width && this.props.height) { if (this.props.width && this.props.height) {
res = this.props.width + "x" + this.props.height + "px"; res = this.props.width + "x" + this.props.height + "px";
@ -213,8 +217,7 @@ export default class ImageView extends React.Component {
} }
const rotationDegrees = this.state.rotationDegrees; const rotationDegrees = this.state.rotationDegrees;
const zoom = this.state.zoom/100; const effectiveStyle = {transform: `rotate(${rotationDegrees}deg)`, ...style};
const effectiveStyle = {transform: `rotate(${rotationDegrees}deg) scale(${zoom})`};
return ( return (
<FocusLock <FocusLock