tight.css

/*
 * Hide unnecessary stuff
 */

/* No need to show your own username and online status. */
.p-classic_nav__team_header__user,
.p-classic_nav__team_header__team__dnd {
  display: none !important;
}

/* Hide dnd menu. This should be set automatically */
.notifications_menu_btn_react {
  display: none !important;
}

/* All threads */
.p-channel_sidebar__link--all-threads {
  display: none !important;
}

/* Jump to */
.p-channel_sidebar__navigation_bar {
  display: none !important;
}

/* New messages warning that is always wrong */
.c-message_list__unread_divider,
.c-message_list__unread_divider--ghost {
  display: none;
}

/* Top nav buttons */
.p-classic_nav__model__title__info,
.p-classic_nav__model__buttons,
.p-classic_nav__right__activity__container,
.p-classic_nav__right__button--stars,
.p-classic_nav__right__button--flexpanes {
  display: none !important;
}

/* Useless sidebar headers */
.p-channel_sidebar__section_heading {
  display: none !important;
}

/* Remove hard coded style="height: Npx" from sidebar items
 * Not sure what these were doing because removing them doesn't seem to do
 * anything to the visisble items and removes the height from all of the rows
 * that had their content hidden by slackless.
 */
.p-channel_sidebar__static_list > div {
  height: auto !important;
}

/* The presentation divs are used for spacing between sidebar groups */
.p-channel_sidebar__static_list > div[role="presentation"] {
  height: 50px !important;
}

/* We have 2 presentation in a row to start because the whole threads section
 * is hidden, so we need to hide one to avoid double spacing. */
.p-channel_sidebar__static_list > div[role="presentation"]:first-child {
  height: 0 !important;
}

/* Useless buttons in message text input field */
.p-message_input_file_button,
.c-texty_input__button {
  display: none !important;
}

/*
 * Layout
 */

/* Set outer wrap max width */
.p-client {
  max-width: 900px !important;
  margin-left: auto !important;
  margin-right: auto !important;
}

/*
 * Styles
 */

/* Make sure all non-chat column things have a gray background */
body,
.p-client {
  background: #f8f8fa !important;
}
body.sk-client-theme--dark,
.sk-client-theme--dark .p-client {
  background: #333 !important;
}

/*
 * Message column styles
 * - White background
 * - Slight inset from top and bottom
 * - Rounded corners
 */
.p-classic_nav__channel_header,
.p-classic_nav__right_header,
.p-workspace__primary_view_footer {
  background: #fff !important;
}
.sk-client-theme--dark .p-classic_nav__channel_header,
.sk-client-theme--dark .p-classic_nav__right_header,
.sk-client-theme--dark .p-workspace__primary_view_footer,
.sk-client-theme--dark .p-message_input_field {
  background: #1b1d21 !important;
}
.sk-client-theme--dark .p-message_input_field {
  border-top: 1px solid rgb(53, 55, 59) !important;
}
.p-workspace {
  margin-top: 20px !important;
  margin-bottom: 20px !important;
}
.p-workspace__primary_view {
  border-bottom-left-radius: 6px !important;
  border-bottom-right-radius: 6px !important;
  overflow: hidden !important;
}
.p-classic_nav__channel_header {
  border-top-left-radius: 6px !important;
  overflow: hidden !important;
}
.p-classic_nav__right_header {
  border-top-right-radius: 6px !important;
  overflow: hidden !important;
}
.p-classic_nav__team_header {
  box-shadow: none !important;
}
.p-workspace__sidebar:after {
  background: none !important;
}

/* Message input box */
.p-workspace__primary_view_footer {
  border-top: 1px solid rgba(0, 0, 0, 0.1) !important;
}
.p-workspace__message_pane_input {
  margin: 0 !important;
}
.c-texty_input {
  border: none !important;
}
.p-message_input_field {
  padding-left: 64px !important;
  padding-top: 20px !important;
  padding-bottom: 20px !important;
  border-top: 1px solid rgba(0, 0, 0, 0.1) !important;
  border-radius: 0 !important;
}
.p-workspace__input .p-message_input_field .ql-editor {
  padding-top: 0 !important;
}
.p-workspace__input .p-message_input_field .ql-placeholder {
  left: 64px !important;
  top: 20px !important;
}
.p-notification_bar {
  display: none !important;
}
.p-message_pane_input {
  padding: 0 !important;
}
.p-message_input_field .ql-editor {
  margin-top: 0 !important;
}

/* Sidebar */
/* Thread hover states */
.p-channel_sidebar__close_container,
.p-channel_sidebar__channel {
  border-radius: 2px !important;
  overflow: hidden !important;
  margin-right: 22px !important;
  width: auto !important;
}
/* Stop double margin on private chats */
.p-channel_sidebar__close_container .p-channel_sidebar__channel--im {
  margin-right: 0 !important;
}
/* Align team header with channel header */
.p-classic_nav__team_header {
  padding-top: 17px !important;
}
/* Remove spacing rows */
.p-channel_sidebar__static_list div[role="presentation"] {
  display: none !important;
}

/* Messages column header */
.p-classic_nav__model__title__name {
  padding-top: 10px !important;
}
.p-classic_nav__right_header {
  width: 40px !important;
}
.p-classic_nav__right__search {
  border: none !important;
}
.p-classic_nav__right__search__placeholder {
  display: none !important;
}
.p-channel_sidebar__link--invites {
  display: none !important;
}
.p-channel_sidebar__link--add-apps {
  display: none !important;
}