#Semi-compact mode

1 messages · Page 1 of 1 (latest)

opal axle
#

thank you for this! but how do i change the text message, like move a little bit to the right.. blobcatcozy

#

like this i mean ><

image.png
limber hollow
# opal axle like this i mean >< 
:root {
  --chat-avatar-size: 1em;
  --custom-message-avatar-size: 1em;
}
[class*="cozy_"] {
  &[class*="hasThread_"]:after {
    top: calc(
      var(--custom-message-spacing-vertical-container-cozy) 
      + var(--custom-message-avatar-size)
    ) !important;
  }
  &[class*="hasThread_"][class*="hasReply_"]:after {
    top: calc(
      var(--custom-message-spacing-vertical-container-cozy) 
      + var(--custom-message-avatar-size)
      + var(--custom-message-reply-message-preview-line-height) 
      + 4px
    ) !important;
  }
  [class*="timestamp_"][class*="alt_"] {
    width: calc(100% - 4px);
    z-index: -1;
  }
}
opal axle
#

thank you!!

limber hollow
#

no problem

old zodiac
#

I'm having some issues selecting text in certain messages, this includes opening spoilered text

limber hollow
old zodiac
#

didn't know you updated, thanks for the heads up

limber hollow
#

Yeah I noticed the same, seems like the hover timestamp was covering the msg and blocking clicks

old zodiac
#

ah

tribal veldt
#

Hey ! I've been using this css for a while, but it broke with a recent discord update. I feel like this is just a small change due to some spacing not working properly. Any idea ?

image.png
craggy seal
# 
/* Semi-Compact Mode */
:root {
  --chat-avatar-size: 1em;
  --custom-message-avatar-size: 1em;
  --custom-message-margin-left-content-cozy: var(--custom-message-margin-horizontal);
}
[class*="cozy"] {
  [class*="header"] {
    margin-left: calc(var(--custom-message-avatar-size) * 0.75);
  }
  & > [class*="repliedMessage"] {
      margin-left: calc(var(--custom-message-avatar-size) + var(--custom-message-margin-horizontal));
  }
  &[class*="hasThread"]:after {
    left: calc(var(--custom-message-margin-horizontal) - var(--space-xs) - 1px);
    width: var(--space-xs);
    border-top: 2px solid var(--spine-default);
    border-top-left-radius: 8px;
    top: calc(
      var(--custom-message-spacing-vertical-container-cozy) 
      + var(--custom-message-avatar-size)/2
    ) !important;
  }
  &[class*="hasThread"][class*="hasReply"]:after {
    top: calc(
      var(--custom-message-spacing-vertical-container-cozy) 
      + var(--custom-message-avatar-size)/2 
      + var(--custom-message-reply-message-preview-line-height) 
      + 4px
    ) !important;
  }
  [class*="timestamp"][class*="alt"] {
    width: calc(100% - 16px);
    z-index: -1;
  }
}
craggy seal
tribal veldt
#

CSS is still a mystery to me sometimes