fedi/lemmy-ui
1
0
Fork 0
mirror of https://github.com/LemmyNet/lemmy-ui.git synced 2024-11-30 17:11:43 +00:00
Code Issues Packages Projects Releases Wiki Activity

Fixed NSFW image blur spilling outside the preview

Browse source 
* Hide overflow of wrapping picture element
  to contain the blur of the inner img element.
* This aligns the visible image area to the
  clickable area.
* fixes #1245
This commit is contained in:
Florian Heft 2023-06-14 10:09:21 +02:00
parent f61037f5d8
commit 14775734fa
2 changed files with 4 additions and 1 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

3
src/assets/css/main.css
View file

@ -434,3 +434,6 @@ br.big {
em-emoji-picker { em-emoji-picker {
width: 100%; width: 100%;
} }
.overflow-hidden {
overflow: hidden;
}

2
src/shared/components/common/pictrs-image.tsx
View file

@ -22,7 +22,7 @@ export class PictrsImage extends Component<PictrsImageProps, any> {
render() { render() {
return ( return (
<picture> <picture className="d-inline-block overflow-hidden">
<source srcSet={this.src("webp")} type="image/webp" /> <source srcSet={this.src("webp")} type="image/webp" />
<source srcSet={this.props.src} /> <source srcSet={this.props.src} />
<source srcSet={this.src("jpg")} type="image/jpeg" /> <source srcSet={this.src("jpg")} type="image/jpeg" />