hypercompact channel list

[rotund rose]

compact theme when

[glad fossil]

one does exist https://gitlab.com/Grzesiek11/compactplusplus-discord-theme

[rotund rose]

thank you

[glad fossil]

in combo

[lean cairn]

not compact enough

[fallow ledge]

you can add this for hovering on someone in vc (tested only on server)

.draggable__55bab:hover{
  background-color: rgb(14, 14, 145);
}```

color for your preferences ofc

[spiral widget]

Can i change the channel color from blue? to red

[summer epoch]

That would be this within the code:

  background-color: red !important;
}```

& 

```&:hover {
  background-color: red !important;
}```

[spiral widget]

thank you

[summer epoch]

Fixed a bit of clipping when that "new" channel info comes around :

.channelInfo_c69b6d:has([style="color: var(--text-brand);"]),
.channelInfo_c69b6d .mentionsBadge__933a1{
    margin-right: 10px;
    margin-left: 5px;
}```

[visual token]

where do i put this code in?

[scenic stratus]

i think you just put it on the baseline

[visual token]

didn't work

[scarlet shadow]

I love it, but is there any way to revert the notification dot to how it was before? (half dot on the left side instead of full dot on the right side)

ok I tried changing part of it to:
.unread__2ea32 { width: 6px; height: 6px; border-radius: 50%; left: -2px; right: auto; top: 16px; }

Which is not ideal (I wish it was half dot sitting at the border of the vertical line) but better than nothing

I also tried to put the half dot on the other side (left: auto; right: -3px), but the channel list's padding on the right makes it not sit along the right edge

[summer epoch]

Prob try !important ? 🤔

Margin-right also kinda works but it does cut off some of the channel names a bit more than usual

[summer epoch]

Edited so it works a bit better for everyone

[hollow echo]

alright but... why blue???

[glad fossil]

@hollow echo

[hollow echo]

just gonna take away !important from &:hover { background-color: var(--brand-800), change it to --background-secondary-alt, and remove background-color: var(--brand-700)!important;

back to default :))

[tawdry mortar]

why are you calling it hypercompact

its literally less compact than default discord with settings appearance > ui density > compact

look

first is discord default

second is this "hypercompact" channel list snippet

which is not compact whatsoever

[keen onyx]

youre right, im not sure whats up with this one

changed mine a bit, looks like this

[hollow echo]

honestly the notification position is just kinda a problem, since it does the same thing with the "create invite" button on hover and the channel typing animation from TypingIndicator

[scarlet shadow]

true, although I find it more relaxing to look at compared to the actual discord compact mode, I'm not sure why (maybe it looks less cramped and more organized? idk but I like it)

but yeah the name might give the wrong impression

[summer epoch]

Oh i havent seen mine overlap but I do have create invites removed completely what you probably could do is just have it move over via aria label or wtv

[karmic grail]

There was an awkard gap at the bottom of the channel list when there are enough channels for a scrollbar.

I ended up adding:

[aria-label="Channels"] {
  max-height: max-content;
  padding-bottom: 1rem;
}

Which gets rid of it and keeps a consistent spacing.

[leaden anchor]

what diff does it make someone plz tell?

[tawdry mortar]

basically makes your channel list very thick, it uses up too much space and is the opposite of compact

a downgrade

[leaden anchor]

Lol ok

[lean cairn]

rude

[tawdry mortar]

sorry, i just wanted to say the truth

[lean cairn]

Then it's free to edit for yourself

[tender ravine]

  width: 2px;
  height: 8px;
  left: 10px;
  right: auto;
  top: 14px;
}```

I think the unreads look quite good like this

[scarlet shadow]

oh they do! Thanks for sharing it!

[keen onyx]

truth tho, this post is plain and simply misleading

[real charm]

discord just broke this snippet

[real charm]

i was able to fix it with the class updater

[tender ravine]

Thanks for the hint

[keen onyx]

/* ‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾ */
/* Compact Channels Menu */
/* _____________________ */
/* https://discord.com/channels/1015060230222131221/1364334361343692882 */

.unread__2ea32 {
  width: 2px;
  height: 8px;
  left: 10px;
  right: auto;
  top: 14px;
}
.modeSelected__2ea32 .link__2ea32 {background-color: var(--red-600) !important;}
.link__2ea32 {
  border-radius: 0px !important;
  padding: 0px !important;
  padding-left: 16px !important;
  &::before {
    width: 1px;
    left: 10px;
    background-color: #ffffff1e;
  }
  &:hover {background-color: var(--red-700) !important;}
  .icon__2ea32 {scale: 0.6;}
  .linkTop__2ea32 {gap: 4px;}
}
.wrapper__2ea32 {margin: 0px;}
.name__2ea32,
.overflow_b0dfc2,
.username__07f91 {
  font-size: 15px;
  font-weight: 500;
  line-height: 1.45;
}
.wrapper__29444 {
  padding: var(--space-xxs) var(--space-xs);
  padding-left: 4px;
  box-sizing: content-box;
  .mainContent__29444 {
    flex-direction: row-reverse !important;
    flex: none !important;
    gap: 8px;
  }
  .icon__29444 {scale: 1.25;}
}
.spine__5b40b {display: none !important;}
.spineBorder__5b40b {
  left: 10px;
  width: 1px;
  background: #ffffff1e !important;
  height: 100%;
}
.typeThread__2ea32 {
  margin-left: 10px !important;
  .link__2ea32 {padding-left: 20px !important;}
}
.containerDefault__29444,
.wrapper__29444,
.content__07f91,
.list_c3cd7d {padding: 0px !important;}
.list_c3cd7d {padding-left: 16px !important;}
.sectionDivider__629e4 {
  margin: 4px !important;
  margin-top: 8px !important;
  width: 100% !important;
}
.linkBottom__2ea32 {margin-left: 4px;}

this is actually hypercompact/(code nested too) here