Hidden threads

[urban leaf]

The channel list is especially sensitive to scroll bugs (and crashing in extreme cases) if the height of its items is changed, because the lazy loader assumes height to know when to load more channels.

Should be okay with a small number of threads, just be aware

[cunning haven]

time to try and get as many threads in as possible.

[urban leaf]

Lol

[vivid furnace]

some future proofing + smoother

.containerDefault_ae2ea4:hover + .container__342a0 {
  max-height: 100%; /* Make the threads Slide down */
  transition: max-height 4s ease; }

.container__342a0 {
  max-height: 0; /* Initially hide the threads by setting their max-height to 0 */
  overflow: hidden; 
  transition: max-height 4s ease; }```

changed 1000px to 100% because who knows, maybe a channel might have so many threads it expands beyond 1000px

[weary lantern]

by removing the other selector from the above makes them disappear while still hovering on threads

also more futureproof with attribute selectors and removed unnecessary transition on hover when it is already applied

#channels [class^=container_]
 { max-height: 0;
   overflow: hidden; 
   transition: max-height 4s ease; }
   
#channels [class^=containerDefault_]:hover + [class^=container_],
#channels [class^=container_]:hover
 { max-height: 100%; }

also, it would require a rewrite with completely different logic - but I see a big issue with the fact that if a thread has unread posts it's still hidden, having it so that unread threads still show would make this actually something I might use

[white delta]

yeah cus having a big server or a lot of threads in a server causes this, which is just annoying, maybe a future plugin idea?

[white delta]

this works great, but also seems to think bars like this, need to be hidden as well

#channels [class^=container_]:not([class*=containerWithMargin])
 { max-height: 0;
   overflow: hidden; 
   transition: max-height 4s ease; }
   
#channels [class^=containerDefault_]:hover + [class^=container_],
#channels [class^=container_]:hover
 { max-height: 100%; }

added a :not() class to prevent that

really small gripe but once I notice it it'll just upset me until it's gone

[weary lantern]

oh yeah lol that's the thing with common classnames and I didn't bother checking properly lol

[vivid furnace]

i didnt see i managed to remove the other selector

[pliant nimbus]

Could u edit it to display following threads ?

[cunning haven]

How exactly?

[pliant nimbus]

Hmmm Im making a video quickly

I come back in 1H I need to wait post be "hidden"

[cunning haven]

you can just leave it by right clicking

[pliant nimbus]

Yeah Iknow that not the thing wait my vid

[pliant nimbus]

Possible to put pin thread to first one ?
and like I say, u can see that 'inactive post" are hidden
I want to use ur snippet and let me see the following thread when Im hovering

[cunning haven]

like, make them show under forum posts too?

[pliant nimbus]

Huh I don't understand

[cunning haven]

I really don't understand the video

Oh! I think I got it

[pliant nimbus]

With ur snippet its hidding the following thread

[cunning haven]

you want for the inactive threads to be hidden and be shown on hover, while other posts stay normal

[pliant nimbus]

But if on't use it we can still see the following threads

[cunning haven]

right?

[pliant nimbus]

Yeah

By default even if post are inactive we can see them if we follwing

And is it possible to put the pin on top?

[cunning haven]

I don't think that is possible with only CSS that might need javascript, like doesn't discord itself hide them ?

[pliant nimbus]

Not sure 100 % but let me try

[cunning haven]

Unless there is a pin attribute in the html, I can't do that and I have no idea if that is a thing.

[pliant nimbus]

Ur right when its inactiv its hidding

[fickle steeple]

I'm not hovering yet and it showed like this

Broke on forums that I have many opened post

[cunning haven]

@fickle steeple use this one

[fickle steeple]

Thanks <3

It's so annoying that it keeps on showing but I don't want to unfollow.

[cunning haven]

I have no idea how u got that many

[fickle steeple]

Oh.

Yeah. I work as customer support. And we get a bunch of help posts everyday...

[cunning haven]

I see.

a service for lonely people, I can see that booming on discord.

[fickle steeple]

Lmao

Well... That's true... Smh.

[fickle steeple]

.

[fickle steeple]

still broken

[cunning haven]

posts don't show when you hover?

[cunning haven]

what is the exact problem

[fickle steeple]

other channels not visible

[cunning haven]

like, completely unreachable?

[fickle steeple]

I had to scroll down to make them visible

[cunning haven]

I don't get the problem

can you try to record a gif?

because it works perfectly fine for me

[fickle steeple]

almost half of the channel list are not being shown

[cunning haven]

like, you can't even reach them if you don't stop hovering?

[fickle steeple]

see no channels at half

[fickle steeple]

yeah

[cunning haven]

might have something to do with this

[fickle steeple]

I'm not hovering so its not showing threads

but its also not showing channels below the thread category

[fickle steeple]

Hmm

Oh well. I guess I can't use this.

[cunning haven]

tried it, yeah seems the loader assuming the height causes that

might not work when you have so many posts

[weary lantern]

I wish someone made a plugin to remove lazy loading of the channellist, even just making it a little bit more compact by reducing paddings/margins makes it glitch :(

[cunning haven]

make it an official vencord plugin.
Make lazy loading x10 laggier so that I can make my snippet work (does it make it laggier?)

[fickle steeple]

why you still awake

[shrewd sun]

broken for me. I can't see names in vcs

[cunning haven]

Probably something broke with discord.

#channels [class^=container_]:not([class*=containerWithMargin]):not([class^=voiceUser_] *) {
    max-height: 0;
    overflow: hidden; 
    transition: max-height 4s ease; 
}

#channels [class^=containerDefault_]:hover + [class^=container_],
#channels > [class^=container_]:hover {
    max-height: 100%; 
}

this makes the vc name show, but for some reason it breaks the hover over the container names?

I have no idea why that is the case.

[weary lantern]

I can't reproduce the issue in the first place, vc names show fine still

(using vesktop but it shouldn't matter?) (still haven't bothered to add vencord to my backup stable discord)

and with your update it also still works normally when hovering the channelname

also fyi; instead of double :not() you can do :not([class*=containerWithMargin], [class^=voiceUser_] *)

[shrewd sun]

I'm using vencord. you should try it with Vencord.

[cunning haven]

I am using vesktop and I had the same issue.

[cunning haven]

for my case it makes the hover stop working on thread names, it closes once I hover over them to choose a thread to click, not the channel name itself.

[desert meadow]

/*#region hide thread and show on hover*/
#channels [class^=containerDefault_]+[class^=container_]:not([class*=containerWithMargin]) {
    max-height: 0;
    overflow: hidden;
    transition: 2s ease-in-out;
}

#channels [class^=containerDefault_]:hover+[class^=container_],
#channels [class^=container_]:hover {
    max-height: 100% !important;
}

#channels [class^=containerDefault_]:has(+ li>ul>li) {
    border-bottom: 1px solid;
    border-image: 1 linear-gradient(90deg, transparent 30%, #fff5, transparent 70%);
}
#channels [class^=containerDefault_]:has(+ li>ul>li>div[class*=Unread]) {
    border-bottom: 1px solid;
    border-image: 1 linear-gradient(90deg, transparent, #fff9, transparent);
}
#channels [class^=containerDefault_]:hover {
    border-bottom: 0 !important;
}
/*#endregion */

made some small changes to see if there's threads + see if there's unread threads (customize to your liking)

[shrewd sun]

this doesn't seem to work entirely because this has a lot of errors

[desert meadow]

It's because the editor doesn't like :has, but it still works

You can try setting background colours instead of borders to see it better

[shrewd sun]

any way to solve this without :has so my editor isn't red?

[desert meadow]

No, the thing we have to check if it exists is after, we don't have a "-" operator in css
(well we have it with :has)

Maybe someone will find another way, but I don't think so

[shrewd sun]

aight

[cunning haven]

You probably should post this as its own CSS in the chat, this is way too cool.

[desert meadow]

thks, I don't have the perm to post messages in #🎨-css-snippets, I'll have to ask for it