mirrors/gotosocial
1
0
Fork 0
mirror of https://github.com/superseriousbusiness/gotosocial.git synced 2025-10-28 11:12:25 -05:00
Code Issues Projects Releases Packages Wiki Activity Actions

[bugfix/frontend] preserve whitespace in photoswipe captions (#4434)

Browse source 
This PR fixes https://codeberg.org/superseriousbusiness/gotosocial/issues/4382 by updating the photoswipe caption plugin CSS to include whitespace. Thanks @olivergeer for the fix. It also updates the padding + width in "aside" mode to increase the chances of a visitor being able to read an entire caption, in lieu of https://codeberg.org/superseriousbusiness/gotosocial/issues/4413 being fixable.

Reviewed-on: https://codeberg.org/superseriousbusiness/gotosocial/pulls/4434
Co-authored-by: tobi <tobi.smethurst@protonmail.com>
Co-committed-by: tobi <tobi.smethurst@protonmail.com>
This commit is contained in:
tobi 2025-09-16 13:00:30 +02:00 • committed by tobi
commit 10b8d270f2
2 changed files with 33 additions and 1 deletions
Download patch file Download diff file Expand all files Collapse all files

2
testrig/testmodels.go
View file

@ -1014,7 +1014,7 @@ func NewTestAttachments() map[string]*gtsmodel.MediaAttachment {
},
},
AccountID: "01F8MH1H7YV1Z7D2C8K2730QBF",
Description: "This is a track from Nine Inch Nail's \"Ghosts I-V\" album. This is the third track from \"Ghosts II\".",
Description: "This is a track from Nine Inch Nails' \"Ghosts I-V\" album.\n\nThis is the third track from \"Ghosts II\".",
ScheduledStatusID: "",
Blurhash: "LZDJO?ayIUof01j[xuayxuayayj[",
Processing: 2,

32
web/source/css/_media-wrapper.css
View file

@ -271,6 +271,10 @@
}
}
/*
Style the "open post" link in the top
right corner of the photoswipe lightbox.
*/
.pswp__button--open-post-link {
display: flex;
align-items: center;
@ -283,6 +287,10 @@
}
}
/*
Style the plyr video thingy both in
and out of the photoswipe lightbox.
*/
.plyr--video {
flex-direction: column-reverse;
@ -367,3 +375,27 @@
display: flex;
}
}
/*
Preserve whitespace in
photoswipe captions.
*/
.pswp__dynamic-caption {
white-space: pre-wrap;
}
.pswp__dynamic-caption--aside {
/*
Remove unnecessary padding
in "normal" width when caption
is rendered on the right side.
*/
padding: 0;
/*
Let it have a bit more width if it
wants, to increase the chance of user
being able to see the whole caption.
*/
max-width: 30rem;
}