Request: Hide chat icons

[gabzony]

Plugin Description

Hi, and first of all thanks for creating Vencord. The jump in performance coming from BD has been incredible, and it was super nice to find out that virtually all plugins I needed already existed in Vencord, and could be added with a single click.

The only plugin I'm missing is a plugin I used with BD called Hide-Chat-Icons which allowed you to hide the chat icons behind a tiny button at will. I usually snap Discord to use half my monitor space, which can result in the text window shrinking to be annoyingly small – especially if you have several plugins installed (e.g. silent typing, translate) which add their own icons (video). Suppose you want to/need to have the user list extended for some reason – in that case, this issue becomes ridiculous, resulting in a text field which is borderline impossible to use (image). Having a small button that lets you hide and unhide the icons at will becomes really handy, as it just solves this issue by letting you hide the chat icons for as long as you need to have the user list extended for.

Obviously, this isn't a dealbreaker and I still prefer Vencord to BD any day of the week. It's just a small QOL improvement that I (and hopefully many other) would appreciate.

Thanks for considering this!

Existing Plugin for other mod

https://github.com/Farcrada/DiscordPlugins/tree/master/Hide-Chat-Icons

Request Agreement

• [x] I read the above and made sure my plugin is possible and allowed
• [X] I checked the existing plugins and made sure my plugin doesn't already exist
• [X] I searched the existing issues and made sure a similar request doesn't already exist

[Vendicated]

i made a css snippet for this ages ago, could possibly satisfy your use case. the classes might need updating though

Hide the chat bar buttons when chat gets too narrow. tweak the 500px to your liking (increase to hide buttons earlier)

(this is very new syntax to the custom css editor will tell you this code isn't valid, but it is)

.chatContent-3KubbW {
    container-type: inline-size;
    container-name: chat;
}

@container chat (max-width: 500px) {
    .chatContent-3KubbW .buttons-uaqb-5 {
        display: none;
    } 
}

https://github.com/Vencord/plugin-requests/assets/45497981/d15772f0-1b68-4f81-9378-5a2bc28edbbe

[gabzony]

Very cool! I can't see myself using it as I'd still like to have quick and easy access to those menus without having to resize the entire window to do it, but it's a great option!

[AkechiiYEETS]

i made a css snippet for this ages ago, could possibly satisfy your use case. the classes might need updating though

Snip

Would there ever be a version that disable them individually instead of all of them? (Especially the gift icon)

[nvhhr]

[aria-label="Send a gift"] {display:none} yeets that icon assuming your discord is in english (this can be adapted to other languages easily or made universal but not so clean).
Any other icon hiding and behavior are all possible with css.

[gabzony]

Well, auto-hiding icons by resizing the Discord window certainly is; but my initial request was having the ability to do so through an unintrusive, interactable button – which I don't think you can do through CSS alone, no?

[nvhhr]

Well, to make a completely separate button to toggle the chatbar icons does require a plugin, we can easily repurpose an existing one.

.expression-picker-chat-input-button:not(:has([class*=emojiButton_]))
 { display: none; }
.buttons__7ecff:has([aria-expanded="true"]) .expression-picker-chat-input-button
 { display: flex; }

This displays only the emoji button, and reveals all buttons when you click that emoji button and whenever any emoji/gif/sticker/other expand thing is open. There's more rules that can be applied if you wish.

[gabzony]

That's pretty interesting, of course the ideal would still be to have it work with a separate interactable element similar to how Hide-chat-button works. Would it be very difficult to port that plugin over to work with Vencord?

[Sqaaakoi]

That's pretty interesting, of course the ideal would still be to have it work with a separate interactable element similar to how Hide-chat-button works. Would it be very difficult to port that plugin over to work with Vencord?

this actually already exists https://github.com/programminglaboratorys/Vencord/tree/fun/src/plugins/hideChatButtons

[gabzony]

this actually already exists https://github.com/programminglaboratorys/Vencord/tree/fun/src/plugins/hideChatButtons

That's great to see! Will this be merged into the main branch eventually so I can use it?

[hyperlexus]

for those who want to use the css snippet that expands the bar if you click on the emoji button, here are the updated classes:

.expression-picker-chat-input-button:not(:has([class*=emojiButton_]))
 { display: none; }
.buttons_d0696b:has([aria-expanded="true"]) .expression-picker-chat-input-button
 { display: flex; }