Lemmy Plugins and Userscripts @sh.itjust.works RunAwayFrog @sh.itjust.works 1y ago

Not a CSS expert, but this makes Lemmy UI comments look better for me (on Desktop)

Using this with Stylus:

li .comment-node {
    padding: 0.5ex;
    border: 0.1ex solid #80808060 !important;
    border-radius: 1ex;
}

li li .comment-node {
    border-left: none !important;
    border-top: none !important;
    border-radius: 1ex 1ex 1ex 0 !important;
}

Or for a more lightweight change:

.comment-node {
    border-bottom: 0.1ex solid #80808060 !important;

It's the lack of clearly visible separation between comments that just doesn't look right to me.

5 comments

And <pre> with a <code> inside it needs a class so we can easily set a different background for it! (edit: or maybe just set a different background for <pre> regardless of content).
- Alright, for code blocks, this looks good enough for me:
  
  pre { padding: 1ex; margin: 1ex; border: 0.1ex solid #80808060 !important; border-radius: 1ex; background: #aaaaaa60; }
  
  And finally, quotes need a different background too:
  
  blockquote { background: #DDDDDD60; }