NeverDecaf / discord-PWA

A wrapper for the Discord web client as a PWA, made for Chromium browsers on desktop.
MIT License
145 stars 13 forks source link

Add ability to have custom css so you can use BeautifulDiscord Themes. #17

Closed LinkofHyrule89 closed 3 years ago

LinkofHyrule89 commented 3 years ago

I like to use BeautifulDiscord but that doesn't seem like it will work with this PWA so it would be great if there was an option to just have custom CSS integrated into the PWA.

NeverDecaf commented 3 years ago

PWAs support extensions so you can do this with any extension that lets you apply custom CSS to a page, such as Stylus. That being said, this extension already does inject a tiny bit of CSS, so it should be fairly simple just add this feature to the extension's options.

LinkofHyrule89 commented 3 years ago

I'm trying to use this theme but it doesn't appear to be working. https://paste.ee/p/4AICM Am I doing something wrong?

NeverDecaf commented 3 years ago

It appears any cross-site directives like @import or url() will not work with insertCSS(), at least in this case (probably due to iframe and CORS). It should be working now in 1.4.1.

LinkofHyrule89 commented 3 years ago

Seems to mostly work. It's still blocking https://gibbu.github.io/BetterDiscord-Themes/FrostedGlass/assets/discord.svg for some reason not sure why though.

NeverDecaf commented 3 years ago

Discord's Content-Security-Policy forbids loading images/styles from external sites (with a few exceptions). In order for these styles to function correctly the CSP header must be modified. This may be a very minor security risk (shouldn't pose much of a threat since this is only css and images) so I've made it an optional setting. (fyi, BeautifulDiscord also modifies the CSP header in the same way.)

LinkofHyrule89 commented 3 years ago

Awesome! I figured it was doing that. I'm impressed with how quickly you get stuff fixed thanks for the hard work.