Improve a comment
This MR improves a comment. Fixes #67 and several other things.
I still don't know Elm so my code is most likely flawed. Please check it carefully!
Blocked on !11 (closed). The actual changes start with commit eba9a08a
.
Highlights
Fix margins
This MR removes the wrapping EDIT: Introduced by a151c96a<div>
previously present in some text messages which had preserved the start and end margins.
It also gives the emote and notice textual messages their correct classes (.cactus-message-emote
, .cactus-message-notice
) which were already used in CSS (at least for the emote). I'm not sure what these emote and notice even are, but at least they can now be styled.
It also correctly zeros the start and end margins of all textual message types (.cactus-message-text
, .cactus-message-emote
, .cactus-message-notice
), not just .cactus-message-text
.
From what I saw in the Elm code the other message types (.cactus-message-image
, .cactus-message-audio
, .cactus-message-video
, .cactus-message-file
) contain only elements that don't get any margins from the default browser style sheet. Though we could consider just zeroing all to not have to worry about it anymore.
File message looks like button
This MR styles the file message like a button using a heroicon and makes it obvious that it can be clicked with hover effects. It also fixes any missing unstyles of the browser default style sheet and prevents the the name from overflowing. I think it looks more pleasing than a "
Fixes overflow
This MR prevents content from overflowing. Both the comment author name and the comment body content can now contain overflowing content without breaking the whole page. Also it respects if a size is set by the user on any outer container which it previously didn't.
Also it correctly resizes images within markdown text in .cactus-message-text
(not only standalone in .cactus-message-image
).
(Note, it seems the overflowing body can still jank layout on iOS Safari a bit, but that's probably a iOS Safari bug because it doesn't happen in desktop browsers. Someone should probably file a bug report though...)