SlckTruCmpct by psu

/* ==UserStyle==
@name         SlckTrueCmpct
@version      20240927.13.16
@namespace    https://userstyles.world/user/psu
@description  True Compact Theme for Slack web app
@author       psu
@license      CC BY-NC-SA 4.0
==/UserStyle== */

@-moz-document url-prefix("https://app.slack.com/") {
/* Basic settings */
:root {
  --trucmpct-sender-width: 4.2em;
  --trucmpct-padding: 0.45em;
}

/* Custom font for messages (not UI) */
.p-activity_ia4_list,
.p-flexpane,
.p-huddle_flexpane,
.p-media_viewer_modal,
.p-message_pane,
.p-threads_view,
.ql-container,
.c-message__sender button {
  font-family: DIN Pro !important;
  letter-spacing: -0.4px !important;
}
.c-message__sender {
  font-weight: 500 !important;
}
.p-rich_text_block,
.c-message__sender button {
  font-size: 15.5px !important;
}

/* Core feature: Sender fixed width, with overflowing words hidden */
.c-message_kit__sender--dense .c-message__sender_button,
.p-message_pane_message__sender--compact .c-message__sender_button {
  white-space: pre-wrap !important;
  width: var(--trucmpct-sender-width) !important;
  overflow: hidden !important;
  height: 1.46668em !important;
  text-transform: capitalize;
}

/* Core feature: Display messages inline with sender  */
.p-flexpane .c-message_kit__gutter--compact .c-message_kit__gutter__right,
.p-huddle_flexpane .c-message_kit__gutter--compact .c-message_kit__gutter__right,
.p-media_viewer_modal .c-message_kit__gutter--compact .c-message_kit__gutter__right {
  display: flex;
  flex-flow: row wrap;
}
.p-huddle_flexpane .p-message_pane_message__sender--compact,
.p-flexpane .p-message_pane_message__sender--compact,
.p-media_viewer_modal .p-message_pane_message__sender--compact {
  display: inline-flex;
}
.p-huddle_flexpane .c-message_kit__indent,
.p-flexpane .c-message_kit__indent,
.p-media_viewer_modal .c-message_kit__indent {
  max-width: min(600px, calc(100% - var(--trucmpct-sender-width) - 10px)) !important;
  padding-left: 0 !important;
}

/* Hide custom status and app badges */
.c-message_kit__gutter--compact .c-app_badge,
.margin_left_25:has(.c-app_badge),
.c-message_kit__gutter--compact .c-custom_status {
  display: none !important;
}

/* Core feature: Super compact timestamp, only displayed on hover  */
.c-message_kit__gutter--compact .p-message_pane_message__compact_timestamp,
.c-message_kit__gutter--compact .p-thread_compact_gutter_generic {
  white-space: nowrap !important;
  width: 0 !important;
  margin-left: calc(var(--trucmpct-padding) * -0.33) !important;
}
.p-message_pane .c-message_kit__gutter--compact {
  padding-left: calc(var(--trucmpct-padding) * 1.33) !important;
  padding-right: 0 !important;
}
.c-message_kit__gutter--compact .c-message_kit__gutter__left {
  padding-left: 0 !important;
  padding-right: 0 !important;
}
.c-message_kit__hover:has(.c-message_kit__gutter--compact) .c-timestamp__label {
  color: rgba(var(--sk_primary_background, 255, 255, 255), 1) !important;
}
.c-message_kit__hover--hovered:has(.c-message_kit__gutter--compact) .c-timestamp__label {
  color: rgba(var(--sk_foreground_max_solid, 97, 96, 97), 1) !important;
  background-color: rgba(var(--sk_foreground_min_solid, 248, 248, 248), 1) !important;
}

/* Re-format timestamp */
.p-huddle_flexpane .c-message_kit__gutter--compact .c-timestamp,
.p-flexpane .c-message_kit__gutter--compact .c-timestamp,
.p-media_viewer_modal .c-message_kit__gutter--compact .c-timestamp,
.p-message_pane .c-message_kit__gutter--compact .c-timestamp,
.p-threads_view .c-message_kit__gutter--compact .c-timestamp {
  font-size: 0.7rem !important;
  font-weight: 500 !important;
  line-height: 0 !important;
  z-index: 99999 !important;
}
.p-huddle_flexpane .c-message_kit__gutter--compact .c-timestamp,
.p-flexpane .c-message_kit__gutter--compact .c-timestamp,
.p-media_viewer_modal .c-message_kit__gutter--compact .c-timestamp {
  order: 3;
  width: 100% !important;
  text-align: right !important;
}
.p-message_pane .c-message_kit__gutter--compact .c-timestamp,
.p-threads_view .c-message_kit__gutter--compact .c-timestamp {
  position: absolute !important;
  display: block !important;
  margin: 0 !important;
  padding: 0 !important;
  width: 0 !important;
  margin-top: 1.55rem !important;
  transform: rotate(-90deg);
}

/* Core feature: Compact messages */
.p-huddle_flexpane .c-message_kit__gutter--compact .c-message_kit__gutter__right,
.p-flexpane .c-message_kit__gutter--compact .c-message_kit__gutter__right,
.p-media_viewer_modal .c-message_kit__gutter--compact .c-message_kit__gutter__right,
.p-message_pane .c-message_kit__gutter--compact .c-message_kit__gutter__right,
.p-threads_view .c-message_kit__gutter--compact .c-message_kit__gutter__right {
  padding-left: calc(var(--trucmpct-padding) * 2) !important;
  padding-right: calc(var(--trucmpct-padding) * 2) !important;
  padding-top: 0.5em !important;
  padding-bottom: 0.5em !important;
}
.p-message_pane .c-message_kit__gutter--compact .c-message_kit__gutter__right:not(:has(.c-message__sender)) {
  padding-top: .2em !important;
}
.c-message_kit__gutter--compact .c-message__message_blocks--inline,
.c-message_kit__gutter--compact .c-message_kit__blocks,
.c-message_kit__gutter--compact .c-message_kit__text,
.c-message_kit__gutter--compact .p-block_kit_renderer .p-block_kit_renderer--inline {
  display: inline-flex !important;
}
/*
.p-message_pane .c-message_kit__gutter--compact .c-message__message_blocks,
.p-threads_view .c-message_kit__gutter--compact .c-message__message_blocks {
  max-width: min(600px, calc(100% - var(--trucmpct-sender-width) - 10px))!important;
}*/
.p-message_pane .c-message_kit__gutter--compact .c-message_kit__blocks:has(.c-message__sender),
.p-threads_view .c-message_kit__gutter--compact .c-message_kit__blocks:has(.c-message__sender) {
  max-width: min(600px, calc(100% - var(--trucmpct-sender-width) - 10px)) !important;
}
.p-message_pane .c-message_kit__gutter--compact .c-message_kit__blocks:not(:has(.c-message__sender)),
.p-threads_view .c-message_kit__gutter--compact .c-message_kit__blocks:not(:has(.c-message__sender)) {
  max-width: min(600px, calc(100% - var(--trucmpct-sender-width) - 10px)) !important;
}
.c-message_kit__labels--dense.p-message_pane_message__message_label .c-message_kit__labels__icon {
  width: 1.5rem !important;
}

/* Core feature: Align left everything except sender and timestamp */
.p-threads_view .c-message_kit__gutter--compact .c-message_kit__indent:not(:has(.c-message__sender))::before,
.p-message_pane .c-message_kit__gutter--compact .c-message_kit__indent:not(:has(.c-message__sender))::before {
  content: '\00a0' !important;
}
.p-message_pane .c-message_kit__gutter--compact .c-message_kit__indent:not(:has(.c-message__sender)) {
  padding-left: calc(var(--trucmpct-sender-width) + 0.1rem) !important;
}
.p-message_pane .c-message_kit__gutter--compact .c-message_kit__indent:has(.c-message_kit__broadcast_preamble) .c-message_kit__blocks {
  padding-left: calc(var(--trucmpct-sender-width) - 0.25rem) !important;
}
.p-threads_view_load_older_message--with-gutter {
  padding-left: calc(var(--trucmpct-padding) * 2 + var(--trucmpct-sender-width) + 0.7rem) !important;
}
.p-threads_flexpane__separator {
  padding-left: calc(var(--trucmpct-sender-width) + 1.2rem) !important;
}
.c-message_kit__gutter--compact .c-message_kit__broadcast_footer {
  margin-left: calc(var(--trucmpct-sender-width) + 2rem) !important;
}
.p-threads_view .c-message_kit__gutter--compact .c-message_kit__indent:has(.c-message__sender) .c-files_container,
.p-threads_view .c-message_kit__gutter--compact .c-message_kit__indent:has(.c-message__sender) .c-message_kit__reaction_bar,
.c-message_kit__gutter--compact .c-message_kit__indent:has(.c-message__sender) .c-message_kit__attachments {
  margin-left: calc(var(--trucmpct-sender-width)) !important;
}
.p-message_pane .c-message_kit__gutter--compact .c-message_kit__indent:has(.c-message__sender) .c-message_kit__reaction_bar,
.c-message_kit__gutter--compact .c-message_kit__indent:has(.c-message__sender) .c-files_container {
  margin-left: calc(var(--trucmpct-sender-width) - 0.15rem) !important;
}
.c-message_actions__container {
  margin-top: 5px !important;
}
.c-message_kit__gutter--compact .c-message__reply_bar {
  margin-left: calc(var(--trucmpct-sender-width) + 0.1rem) !important;
}
.c-message_kit__labels--ephemeral {
  margin-left: calc(var(--trucmpct-sender-width) - 0.75rem) !important;
}
.c-message_kit__gutter--compact .c-message_kit__indent:not(:has(.c-message__sender)) .c-message_kit__attachments {
  margin-left: 0.525rem !important;
}
.c-message_kit__gutter--compact .c-message_kit__indent:not(:has(.c-message__sender)) .c-files_container {
  margin-left: 0.25rem !important;
}

.c-message_kit__gutter--compact .c-message_kit__indent .c-message_kit__sender:has(span[data-qa="huddle_message_user_name"]) {
  margin-left: calc(var(--trucmpct-sender-width) - 0.27rem) !important;
}
.c-message_kit__gutter--compact .c-message_kit__indent .c-message_kit__sender:has(span[data-qa="huddle_message_user_name"])::after {
  content: " -" !important;
}

/* Compact team icon */
.c-message_kit__gutter--compact .c-team_icon {
  position: absolute !important;
  left: calc(var(--trucmpct-padding) * 1.8) !important;
  top: 1.2rem !important;
  width: 0.5rem !important;
  height: 0.5rem !important;
  min-width: 0.5rem !important;
  border-radius: 0.06rem !important;
  font-size: 0.45rem !important;
  font-weight: 700 !important;
  font-family: sans-serif !important;
}
.p-message_pane .c-message_kit__gutter--compact .c-team_icon {
  margin-top: 0.3em !important;
}
.p-huddle_flexpane .c-message_kit__gutter--compact .c-team_icon,
.p-flexpane .c-message_kit__gutter--compact .c-team_icon,
.p-media_viewer_modal .c-message_kit__gutter--compact .c-team_icon,
.p-threads_view .c-message_kit__gutter--compact .c-team_icon {
  margin-top: 0.2em !important;
}

/* Compact day divider */
.p-message_pane .c-message_list__day_divider__label__pill {
  color: rgba(var(--sk_foreground_max_solid, 97, 96,...