You can now collapse comments by clicking on the ▼ symbol that appears near comments.
It is not 100% rolled out, as we'll let some caches clear naturally to display the new functionality. We may also need to make some small adjustments to click area radius and the such.
This feature was built using the nifty <details> tag, so the mechanism is not triggered by JavaScript.
Thanks to @link2twenty for pitching this approach in this issue:
Feature: Collapse comments
#173
rishipuri
posted on
Collapse comments
User Story
As a user I should be able to collapse comments.
Happy coding ❤️
Top comments (22)
Collapse me!
And me!!
Bigger plz.
Also, needs higher contrast.
Thanks for the feedback K
Otherwise it's a great feature :)
Might need to be a little different for mobile
I agree. It seems really out of place on mobile, or at least on my device.
Can you make an issue and/or PR describing this?
On mobile the collapsible comments arrow and summary are a little small.
Reddit, who also do collapsible comments, get around this by not having colapsible comments but rather only displaying base level comments with a button to reveal replies.
Once replies are revealed they can not be hidden away again.
This issue serves as a place to discuss the UI for mobile and any changes that may need to be made.
Love this new feature!
Just a problem: I can't interact with the comment's text anymore. I can't select it, copy the text and so on.
All the links work fine, it's just the actual body.
Oh, thanks for the catch.
Fixing that, and some of the other adjustments mentioned, here
The problem was that the surrounding div had
user-select: none;applied to deal with not selecting all with rapid clicks of the toggle.But it was applied in a cascading manner to the body by accident. Should be fixed shortly.
That was a quick catch and patch 😁
Thanks Ben!
It's working now :)
I really like how this is implemented! Name and number of replies while collapsed is just the right information needed, simplicity at it's best!
Loving it!
I have a really hard time clicking on the tiny arrow on mobile Safari. But once I do the whole line is clickable, which is nice...
Actually (hey, where did edit go?) first-level comments you can click on the entire line, but nested comments are harder to hit.
Actually, it works OK in Mobile Safari, but not in the Echofon twitter client...
This is awesome!
🙏🙏🙏🙏
Nice! You can do what you want with the details tag. If you need it here some example:
ne-details.stackblitz.io/
The arrow being above (not to the left) the first comment in a thread isn't a bug?
I think this has to do with the first comment spanning the full width of the column. So the width of all of the comments would need to be reduced a bit.