diff --git a/ts/components/Lightbox.tsx b/ts/components/Lightbox.tsx index 1b0d3d6f6ffd..b7a9231f3169 100644 --- a/ts/components/Lightbox.tsx +++ b/ts/components/Lightbox.tsx @@ -56,6 +56,7 @@ const styles = { display: 'flex', flexDirection: 'column', outline: 'none', + width: '100%', padding: 0, } as React.CSSProperties, mainContainer: { @@ -84,6 +85,18 @@ const styles = { objectFit: 'contain', outline: 'none', } as React.CSSProperties, + img: { + position: 'absolute', + left: '50%', + top: '50%', + transform: 'translate(-50%, -50%)', + width: 'auto', + height: 'auto', + maxWidth: '100%', + maxHeight: '100%', + objectFit: 'contain', + outline: 'none', + } as React.CSSProperties, caption: { position: 'absolute', bottom: 0, @@ -361,7 +374,7 @@ export class Lightbox extends React.Component { > {i18n('lightboxImageAlt')} diff --git a/ts/util/lint/exceptions.json b/ts/util/lint/exceptions.json index 01da51614e8a..28b2754a53eb 100644 --- a/ts/util/lint/exceptions.json +++ b/ts/util/lint/exceptions.json @@ -12951,7 +12951,7 @@ "rule": "React-createRef", "path": "ts/components/Lightbox.js", "line": " this.containerRef = react_1.default.createRef();", - "lineNumber": 148, + "lineNumber": 161, "reasonCategory": "usageTrusted", "updated": "2019-11-06T19:56:38.557Z", "reasonDetail": "Used to double-check outside clicks" @@ -12960,7 +12960,7 @@ "rule": "React-createRef", "path": "ts/components/Lightbox.js", "line": " this.videoRef = react_1.default.createRef();", - "lineNumber": 149, + "lineNumber": 162, "reasonCategory": "usageTrusted", "updated": "2020-09-14T23:03:44.863Z" }, @@ -12968,7 +12968,7 @@ "rule": "React-createRef", "path": "ts/components/Lightbox.js", "line": " this.focusRef = react_1.default.createRef();", - "lineNumber": 150, + "lineNumber": 163, "reasonCategory": "usageTrusted", "updated": "2019-11-06T19:56:38.557Z", "reasonDetail": "Used to manage focus" @@ -13327,4 +13327,4 @@ "reasonCategory": "falseMatch", "updated": "2020-09-08T23:07:22.682Z" } -] +] \ No newline at end of file