interactive comments - used react, local storage, timestamps
Design comparison
Solution retrospective
One thing I couldn't fix, when I create a reply to a top level comment, it doesn't size correctly. Replies to existing comments, and new top level comments both size correctly. I couldn't figure it out.
Community feedback
- @JaneMorozPosted over 1 year ago
Hello Richard! I love your solution to this challenge ❤️
I think I found a solution to the replies width bug. If you remove the default replies and create new reply you'll see that they are not filling the whole horizontal space.
The reason replies are kinda taking all horizontal space in the second comment (with default replies) is because default replies kinda stretch
Replies_repliesContainer
so the new replies (children) just fill the container's width.So in order to solve this problem you need to make
Replies_repliesContainer
take the whole width of it's parent. For example you can addwidth: 100%
toReplies_repliesContainer
andCommentAndReply_container
. Or you can addflex:1
toReplies_repliesContainer
, this wayReplies_repliesContainer
will just take the rest of flex-container space.Keep it up! And good luck 🍀
P.S. You can also use
gap
property to add the space between the vertical line and the reply.0@riwepoPosted over 1 year ago@JaneMoroz
Thanks heaps for taking the time to look at my code Eugenia! I'm going to go and try and fix it right now.
😊
All fixed! Thanks again.
1
Please log in to post a comment
Log in with GitHubJoin our Discord community
Join thousands of Frontend Mentor community members taking the challenges, sharing resources, helping each other, and chatting about all things front-end!
Join our Discord