mirrors/signal-desktop
2
0
Fork 0
Code Issues Pull requests Projects Releases Packages 2 Wiki Activity Actions

Improved support for images with extreme ratios

Browse source
This commit is contained in:
Scott Nonnenberg 2020-09-23 09:07:27 -07:00 committed by GitHub
parent 04d3769bd4
commit 4e223def29
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
2 changed files with 18 additions and 5 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

15
ts/components/Lightbox.tsx
View file

@ -56,6 +56,7 @@ const styles = {
display: 'flex', display: 'flex',
flexDirection: 'column', flexDirection: 'column',
outline: 'none', outline: 'none',
width: '100%',
padding: 0, padding: 0,
} as React.CSSProperties, } as React.CSSProperties,
mainContainer: { mainContainer: {
@ -84,6 +85,18 @@ const styles = {
objectFit: 'contain', objectFit: 'contain',
outline: 'none', outline: 'none',
} as React.CSSProperties, } 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: { caption: {
position: 'absolute', position: 'absolute',
bottom: 0, bottom: 0,
@ -361,7 +374,7 @@ export class Lightbox extends React.Component<Props, State> {
> >
<img <img
alt={i18n('lightboxImageAlt')} alt={i18n('lightboxImageAlt')}
style={styles.object} style={styles.img}
src={objectURL} src={objectURL}
/> />
</button> </button>

8
ts/util/lint/exceptions.json
View file

@ -12951,7 +12951,7 @@
"rule": "React-createRef", "rule": "React-createRef",
"path": "ts/components/Lightbox.js", "path": "ts/components/Lightbox.js",
"line": " this.containerRef = react_1.default.createRef();", "line": " this.containerRef = react_1.default.createRef();",
"lineNumber": 148, "lineNumber": 161,
"reasonCategory": "usageTrusted", "reasonCategory": "usageTrusted",
"updated": "2019-11-06T19:56:38.557Z", "updated": "2019-11-06T19:56:38.557Z",
"reasonDetail": "Used to double-check outside clicks" "reasonDetail": "Used to double-check outside clicks"
@ -12960,7 +12960,7 @@
"rule": "React-createRef", "rule": "React-createRef",
"path": "ts/components/Lightbox.js", "path": "ts/components/Lightbox.js",
"line": " this.videoRef = react_1.default.createRef();", "line": " this.videoRef = react_1.default.createRef();",
"lineNumber": 149, "lineNumber": 162,
"reasonCategory": "usageTrusted", "reasonCategory": "usageTrusted",
"updated": "2020-09-14T23:03:44.863Z" "updated": "2020-09-14T23:03:44.863Z"
}, },
@ -12968,7 +12968,7 @@
"rule": "React-createRef", "rule": "React-createRef",
"path": "ts/components/Lightbox.js", "path": "ts/components/Lightbox.js",
"line": " this.focusRef = react_1.default.createRef();", "line": " this.focusRef = react_1.default.createRef();",
"lineNumber": 150, "lineNumber": 163,
"reasonCategory": "usageTrusted", "reasonCategory": "usageTrusted",
"updated": "2019-11-06T19:56:38.557Z", "updated": "2019-11-06T19:56:38.557Z",
"reasonDetail": "Used to manage focus" "reasonDetail": "Used to manage focus"
@ -13327,4 +13327,4 @@
"reasonCategory": "falseMatch", "reasonCategory": "falseMatch",
"updated": "2020-09-08T23:07:22.682Z" "updated": "2020-09-08T23:07:22.682Z"
} }
] ]