Skip to content

Instantly share code, notes, and snippets.

@TheSunCat

TheSunCat/DisblockOrigin.theme.css

Last active October 30, 2024 05:38
Show Gist options
  • Save TheSunCat/58fedaa19d6154ef3e4b2b676c286906 to your computer and use it in GitHub Desktop.
Save TheSunCat/58fedaa19d6154ef3e4b2b676c286906 to your computer and use it in GitHub Desktop.
Download ZIP
Hide all Nitro & Boost upsells in Discord!
Raw
DisblockOrigin.theme.css
/**
* @name Adblock for Discord
* @author TheSunCat and contributors
* @version 1.0.0
* @description We have moved to Codeberg! Follow the link below:
* @source https://codeberg.org/AllPurposeMat/Disblock-Origin
*/
#app-mount::before {
content: "The Disblock Origin theme has moved to Codeberg! Please check https://codeberg.org/AllPurposeMat/Disblock-Origin";
font-size: 1.25rem;
background-color: #dc8a78;
padding: 1rem;
}
@TheSunCat
Copy link
Author

Thanks @LockBlock-dev, implemented both suggestions. Unlike the Nitro badge, I decided to hide the Quests one entirely as I can't think of a reason to have it enabled besides serving as another ad (unlike the Nitro ones which I would want to see for the same reason as people who pay for checkmarks on Twitter want to hide them).

@LavenderAndChamomile I found a more reliable way to block both the Nitro and Shop tabs, could you try it again?

Where do you see this panel @Kupie ? I see a similar-looking one in the friends list, but it is labeled as "Active Now" and has no settings icon. That one does look selectable via nowPlayingColumn.

@peldas
Copy link

peldas commented May 1, 2024 •
edited
Loading

@TheSunCat not really that important but just checking, did you mix up lines 31 and 33?

Edit: also it seems the boost progress bar has slightly changed with the latest update. I've managed to get it work by adding an li element as below.
Before:
ul[aria-label="Channels"] > div[role="button"][class^="container"] { display: none; }

After:
ul[aria-label="Channels"] > li > div[role="button"][class^="container"] { display: none; }

@Krolul
Copy link

Krolul commented May 6, 2024 •
edited
Loading

Hey, I love the work. I was wondering: would a mobile version of this adblock "theme" be available in the future for the mobile clients (i.e., Bunny)?

@TheSunCat
Copy link
Author

Yes @peldas, nicely spotted. Fixed the boost bar blocking and swapped the erroneous lines.

@Krolul I'd like to see this, too! Unfortunately it's a very different process to make something like this for a native app. The Discord "desktop" app is just a simple wrapper around a website, which makes it quite powerfully themable via CSS. The mobile app is an actual real app, so the tooling is entirely different. A whole separate project would be needed.

@LavenderAndChamomile
Copy link

Hey, I love the work. I was wondering: would a mobile version of this adblock "theme" be available in the future for the mobile clients (i.e., Bunny)?

Look for "bluecord" via Google. I use it myself with Discord on my phone.

@Rupurudu
Copy link

Rupurudu commented May 15, 2024 •
edited
Loading

I made some improvements on this css:
https://gist.github.com/Rupurudu/d77fbf849129c818febbb06e5b1c7912

[Text Chat][Textarea] Now hides gift Nitro icon on non-english languages.
[Settings][Sidebar] Now hides Nitro tabs on non-english languages.
[Settings][Profiles] Per server avatar is no longer clickable (shows Nitro upsell)
[Settings][Voice & Video] Soundboard entrance sounds no longer hides Soundboard volume slider.
[Settings][Appearance] Nitro app icons no longer hidden if user has FakeNitro enabled.
[Settings][Appearance] Nitro themes no longer hidden if user has FakeNitro enabled.
[Server settings] Show Nitro progress bar switch and unlocked features.
[Voice Chat][Screen Share] Hide Screen Share also hides upsell banner.
[Toolbar] Hide Help button works on non-english languages.
Emoji popout: "Get nitro" button breaks Nitro tab fixed.

@TheSunCat
Copy link
Author

Great stuff! Thanks for sharing. Would you like it merged into here?

@Rupurudu
Copy link

Yeah why not

@woducku
Copy link

woducku commented May 19, 2024

any way to put this in stylus, so that i dont have to update it manually? i tried it like this but didnt work.

@import url('https://gist.githubusercontent.com/TheSunCat/58fedaa19d6154ef3e4b2b676c286906/raw/3c81548d365da4a453112ddafbae4d434b8c6e91/DisblockOrigin.theme.css')

@Iftuga
Copy link

Iftuga commented Jun 2, 2024

any way to put this in stylus, so that i dont have to update it manually? i tried it like this but didnt work.

@import url('https://gist.githubusercontent.com/TheSunCat/58fedaa19d6154ef3e4b2b676c286906/raw/3c81548d365da4a453112ddafbae4d434b8c6e91/DisblockOrigin.theme.css')

You can try it like that:
https://gist.githubusercontent.com/TheSunCat/58fedaa19d6154ef3e4b2b676c286906/raw/DisblockOrigin.theme.css
This way it should auto update

@LockBlock-dev
Copy link

Discord new profile popout changed some tags:

-a[aria-label^="Completed a Quest"] { display: none; }
+div[aria-label^="Completed a Quest"] { display: none; }
  • Nitro badges here:
-a[aria-label^="Subscriber since"], a[aria-label^="Early Supporter"] { display: none; }
+div[aria-label^="Subscriber since"], div[aria-label^="Early Supporter"] { display: none; }
-a[aria-label^="Server boosting since"] { display: none; }
+div[aria-label^="Server boosting since"] { display: none; }

@TheSunCat
Copy link
Author

Thanks! Applied.

@peldas
Copy link

peldas commented Jun 27, 2024

Did you mean to revert line 152? I think it needs the li there to hide the progress bar, at least on my client.

@gBasil
Copy link

gBasil commented Jun 27, 2024

Not sure whether or not you want to block this thing:
The Super Reaction toggle in the emoji picker

Here's the style:

/* Emoji picker "Enable Super Reactions" button */
div:has(> div[aria-label="Enable Super Reactions"]) { display: none; }

Also, would it be possible to have this be a UserCSS (.user.css) file, or have some sort of mirror in that format? And even with Stylus' CSP patching, @importing the raw URL doesn't work for me.

@Fxzzi
Copy link

Fxzzi commented Jul 2, 2024

Any reason why sticker tab is hidden?
image

Stickers can be used fine via Vesktop plugins.

@LockBlock-dev
Copy link

Stickers are hidden by default because it shows an ad. If you are using a client mod you can comment out the line responsible for hiding the stickers tab.

@TheSunCat
Copy link
Author

Indeed. You can also always bring up the stickers input box by hitting Ctrl+S.

@floriegl
Copy link

floriegl commented Jul 7, 2024 •
edited
Loading

image
Can we do something about this? For me, it only randomly appears underneath the Mutual Servers/Friends Panel in the user side panel.

My best selector would be: div[class*="overlayBackground_"]:has(div[class*="premiumSubscribeButton_"])

@TheSunCat
Copy link
Author

Not sure whether or not you want to block this thing

@gBasil It is blocked on my end, unless you are seeing it elsewhere than the emoji picker popup?
image

Can we do something about this? For me, it only randomly appears.

@floriegl Hrm, it looks different on my end, so your CSS doesn't block it. Do you think we should wait for the ad to become consistent or find a way to block both now? With some quick poking I haven't found a way to consistently target my version of that upsell.

image

Also, would it be possible to have this be a UserCSS (.user.css) file, or have some sort of mirror in that format? And even with Stylus' CSP patching, @importing the raw URL doesn't work for me.

I've long wanted to move this to a proper repo on my own forge (https://git.allpurposem.at ) where I can have more/proper control over its distribution and do stuff like that. However I don't want this project to become less accessible because of it (I'd have to enable public sign-ups I guess). Another option would be to host a proper repo on an existing public free forge such as Codeberg or Sourcehut.
I am open to any ideas to get this out of GitHub in a way that is most accessible for everyone, please feel free to suggest things.

@gBasil
Copy link

gBasil commented Jul 9, 2024

It is blocked on my end, unless you are seeing it elsewhere than the emoji picker popup?

I re-pasted the script and it seems to work now. Thanks!

feel free to suggest things

I'll vote for Codeberg. Sourcehut is quite obtuse to use for those who aren't familiar with it.

@floriegl
Copy link

floriegl commented Jul 9, 2024

Do you think we should wait for the ad to become consistent or find a way to block both now? With some quick poking I haven't found a way to consistently target my version of that upsell.

Yeah, a friend of mine now also got a similar one:
image

div[class*="overlayBackground_"]:has(div[class*="contentText_"] > a[role="button"]) would be my best guess for that. But yeah, they got really annoying with that.

@LockBlock-dev
Copy link

LockBlock-dev commented Jul 29, 2024 •
edited
Loading

Do you think we should wait for the ad to become consistent or find a way to block both now? With some quick poking I haven't found a way to consistently target my version of that upsell.

Yeah, a friend of mine now also got a similar one: image

div[class*="overlayBackground_"]:has(div[class*="contentText_"] > a[role="button"]) would be my best guess for that. But yeah, they got really annoying with that.

This selector does the trick on my end 👍
It can be added at the end of the "Hide Nitro upsells" category like so:

/* Friend overlay nitro upsell */
div[class*="overlayBackground_"]:has(div[class*="contentText_"] > a[role="button"])  { display: none; }

@Comeonnoob
Copy link

The "Hide Billing header and separator" isn't working, displays this and stops displaying the title of other seperators
изображение

And "Server booster profile badge" doesn't work, displays it anyway
изображение

@TheSunCat
Copy link
Author

Thanks for the report, I've gotten rid of the header hiding bit since it keeps breaking and technically there's still the Gift Inventory button. The changes are live on the Codeberg repo.

I've finished transitioning the repo to Codeberg, and you can now find it here: https://codeberg.org/AllPurposeMat/Disblock-Origin

Please be welcomed to continue discussion in an issue there!
The last version of the theme on GitHub disables the functionality and displays an orange banner explaining where it went. I know it's annoying to have to move, but using a real repo gives many benefits such as being able to use an issue tracker, commit names, and a proper readme file, and I've wanted to do this for a while.

The reason for picking Codeberg over GitHub is that Codeberg is a free forge, whereas GitHub has been making decisions (especially recently) that go against software freedom. Principally, I do not consent to an AI/LLM such as Copilot being trained on what I write and sold, laundering my code's license along the way. You can read more about reasons to leave GitHub at GiveUpGitHub.org

@LavenderAndChamomile
Copy link

How do I remove this? (marked in red)
remove

@TheSunCat
Copy link
Author

Hi! I moved the project to Codeberg. There's a merge request open to perhaps hide this, you are welcome to join the discussion: https://codeberg.org/AllPurposeMat/Disblock-Origin/pulls/4

@LavenderAndChamomile
Copy link

Hi! I moved the project to Codeberg. There's a merge request open to perhaps hide this, you are welcome to join the discussion: https://codeberg.org/AllPurposeMat/Disblock-Origin/pulls/4

Ok, thank you and will do!

@Smidgens
Copy link

How do I remove this? (marked in red) remove

I swear, it feels like Discord is adding space-hogging bloat on purpose to see what they can get away with.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment