discord-plus

A sleek, customizable Discord theme.

Stars
297

Bot releases are hidden (Show)

discord-plus - Discord+ v3.2.0 2: Electric Boogaloo Latest Release

Published by PlusInsta almost 2 years ago

Changed domain back. Running GitHub Pages on a custom domain isn't as cool as I thought it would be.

discord-plus - Discord+ v3.2.0

Published by PlusInsta about 2 years ago

discord-plus - Discord+ v3.1.1

Published by PlusInsta over 3 years ago

  • Nothing major, I just got myself my own domain :)
  • Because the URL changed, previous versions will no longer work
discord-plus - Discord+ v3.1.0

Published by PlusInsta over 3 years ago

  • Redid the dark/light background color variables so they work with GooseMod.
    • Instead of using the same variable under each theme, there are now two sets of variables under :root so GooseMod can recognize them as separate variables.
  • Added accent color hover. This is used on accent-colored buttons when you hover over them.
  • Retouched some default background colors to match vanilla more closely.
discord-plus - Discord+ v3.0.2

Published by PlusInsta over 3 years ago

  • Added variables for channel list and member list width
  • Changed default avatar size to 64px so it looks sharper
discord-plus - Discord+ v3.0.1

Published by PlusInsta over 3 years ago

  • Added Home icon customization
  • Added Powercord manifest
discord-plus - Discord+ v3.0

Published by PlusInsta over 3 years ago

Now with 50% more customization!

I had an epiphany and worked for several long hours to implement things I've wanted to add for a long time.

Variables added include spacing, background covers for each type of element, and the ability to change the size of avatars and server icons. Some other stuff is in there too.

discord-plus - Discord+ v2.4.1

Published by PlusInsta almost 4 years ago

• Rewrote some things
• Changed spacing so it looks better with Notepad and Notepad++
• Added blur scale variable (in percent. 100 is default, set to 0 to disable)
• Commented the bg variables so they don't mess with our defaults

discord-plus - Discord+: By the users, For the users

Published by PlusInsta about 4 years ago

You've all been very vocal over the past few weeks.

Customizing CSS is hard, and my unclear instructions certainly didn't help the problem.
In fact, I screwed up so hard, some of you didn't even know how to open the theme file!
That's why, with this release, I'm making the theme as user-friendly as I possibly can. I've included several detailed help texts in the file, to ensure you can make the theme look just the way you want it!

Variables have been simplified and streamlined, two variables were added to let you customize the avatar and server icon roundness (meaning that I can finally close https://github.com/PlusInsta/discord-plus/issues/34!), and much of the code loads faster than ever, since, well, much of the pointless code I had lying around is gone.

One last thing…

This release now pulls the theme from GitHub Pages! For years, I thought you couldn't pull CSS from GitHub. Then I realized… GitHub isn't a hosting site. So I put the theme file in my GitHub Pages that I already have built, and now Discord can load from it just fine.
This means faster load times, and my updated code gets delivered to you almost instantly!

discord-plus - Discord+ v2.3.0… again

Published by PlusInsta over 4 years ago

GitHub decided to mark v2.1.3 as the "latest release," and since I can't manually fix that, I'm re-releasing the same thing again.

If you already have the theme downloaded from the website, you can ignore this.

discord-plus - Discord+ v2.3.0

Published by PlusInsta about 5 years ago

This is the latest release of the theme, intended to fix #21, #22, and #23, as well as make the theme more user-friendly.

Among the things changed since the previous release, the user variables have better names (and are prefixed with --dplus to avoid conflicting with other themes), the default accent color was simplified from RGB to an easy-to-remember hex value, you can adjust the color and opacity of the element backdrops, and the CSS file itself contains comments about what each variable does.

Please note that the original release of this theme file was broken. It pointed to the beta branch instead of master. The updated release is identified as v2.3.0 instead of v2.3.

discord-plus - Discord+ v2.2

Published by PlusInsta over 5 years ago

This release is obsolete.

The First Auto-Updating Release

The file below used to load the latest version of the theme from the master branch, so you could receive updates seamlessly. This allowed me support the theme faster, since I didn't have to worry about making new releases all the time. Because of the changed variable names, this release is now obsolete.

discord-plus - Discord+ v2.1.3.1

Published by PlusInsta about 6 years ago

Discord made another surprise update overnight. We all know what that means, right?
Yep. It's hotfix time.

Changelog:

  • The message wrapper itself is now round
  • The font import now works as expected
  • Messages are slightly off, but functional again

Known issues:

  • Editing messages looks completely broken. Blame Discord, I can't fix this without rewriting the entire theme.
  • Several other things are just slightly wonky thanks to the update, and I'm really not in the mood to fix it all.
  • My will to live is slowly deteriorating.
discord-plus - Discord+ v2.1.3

Published by PlusInsta over 6 years ago

Brand New Home Page: Games Tab

Discord has launched a brand new tab in what used to be the "Friends" section, and rebranded said section to Home! Give a warm welcome to the Games tab!

This release adds the Games tab to the list of themed areas, and fixes a bug with the calling UI.

Games tab (Dark)
Games tab (Light)
Quick Launcher (Dark)

NOTE: As of release, there's a bug with the carousel mode of the news section. If your window is small enough horizontally to trigger the carousel, you'll notice that sliding to any other news article breaks the roundness. This is not my fault, it's Discord's. To prevent this from happening, make your window at least 720p in size, or zoom the page out.

discord-plus - Discord+ v2.1.2.1

Published by PlusInsta over 6 years ago

This release fixes an oversight with system messages. Nothing else has changed from v2.1.2.

The problem:
System messages, such as calling and pinning, were completely broken.

hell

Changes

https://github.com/PlusInsta/discord-plus/commit/570f1ff59a9b525e304f8e454fa1c66fdefe533e: Fix system messages

satisfactory

This release is otherwise identical to v2.1.2.

discord-plus - Discord+ v2.1.2

Published by PlusInsta over 6 years ago

I wasn't actually going to make this release, but GOD DAMN WHAT IS THIS
why

This mysterious margin change happened overnight, for absolutely no reason at all. What the hell, Discord???

Additions

https://github.com/PlusInsta/discord-plus/commit/3f99190fc9e2a7245be7fd77228ec84b09f73182: Add Facebook notice

The Facebook notice that nags you to add your friends is now round.

https://github.com/PlusInsta/discord-plus/commit/fd154c03628a46ef5c2ba68f5afb811aa63117ee: Add channel notices

Remember when I removed channel notices altogether? Well, I decided to stop being lazy and just theme them.

https://github.com/PlusInsta/discord-plus/commit/1d53102be4c14d81657ecb1db501c10664c9cffe: Improvements to guilds

The Friends list now has the same animations and transparency as regular guilds!

https://github.com/PlusInsta/discord-plus/commit/ca6360a2f281fba1b2f529ccbe7b0cc32484e702: Add animations to settings buttons

Does what you think it does. The button animations now work in the settings too.

Changes

https://github.com/PlusInsta/discord-plus/commit/9d232c7ffba052336a9f416687341fdfac923298: Fix the godawful message proportions after the update

https://github.com/PlusInsta/discord-plus/commit/2a9cbc1458407c8538b996720170be593c1073fc: Fix friends being one pixel off

phew
So yeah, the entire reason this update exists. I took the liberty of fixing what Discord fucked up. And yes, one of the commits fixes your friends being one pixel off. Exactly one pixel.

Was this really necessary, guys? For real? One PIXEL?

https://github.com/PlusInsta/discord-plus/commit/25fbaf2164dcdf9c4f9f72c636b7ed6d6a98594e: Rewrite font selector to be neutral

The font selector no longer forces the font onto every single element on the page. This has a meaningful impact on performance, and also prevents the BetterDiscord Custom CSS box from breaking.

https://github.com/PlusInsta/discord-plus/commit/1338aac34d74d091bf4514e2d58c2d6dce169b3c: Remove box shadows the right way

Due to a horrendous oversight, box shadows weren't actually being removed where I wanted them to. Oops.

https://github.com/PlusInsta/discord-plus/commit/1ce91667d7a58de009756a61bdbd796e5d38d944: Remove the ugly border

Removes an ugly border beneath certain tabs.

discord-plus - Discord+ v2.1.1

Published by PlusInsta over 6 years ago

Because The Last Update Just Wasn't Polished Enough™

Additions

a8290b8: Better BetterDiscord lists

The plugin and theme lists now look better.

screenshot from 2018-05-17 20-57-20

49b4b8f: Improve loading page style

The loading page is now 100% Discord+ Certified™.
Notably, the attribution text is gone, and the "Tweet us" and "Status" texts are gone too in favor of minimalism. I also removed the annoying Uppercase text filter.

changelog_bulldozer_disconnect

ebca30e: Overhaul friends list

Just like the Channel code and Settings code before it, the Friends list has been redone from the ground up to improve your experience. Animated backgrounds galore, and I even themed the "Friends" tab! Long story short, it looked odd if you unhovered it, so I made a workaround: animated padding.

Here's a before and after comparison for the light theme:

changelog_bulldozer_friends_before

changelog_bulldozer_friends

42b89f0: Remove the useless server notices

The Quick Switcher notices and the "Add friends to the server" notices are both hidden. Any future notices will be gone too. Yay, minimalism!
EDIT: Instead of being lazy and remove them, future releases are going to actually theme these things, starting with commit fd154c0.

Changes

aee083e: Bring back title wrapper roundness

Man am I good at leaving oversights in my theme. The bar at the top of the chat is round again now.

9c5e8ab: [Dark] Friends list roundness

I somehow forgot to add roundness to the dark version of the friends list when polishing up the friends list code. That has now been fixed.

7bd06ed: Clean up credits

The theme credits should now fit in with the BetterDiscord ones.

6fed1cd: Correct loading screen

By accident, I called a property "text-size" and not "font-size", resulting in everything but "Connecting" becoming hidden. Whoops.

5681bc2: Add border-radius variable to scrollbar

Because of my lackluster testing, I never actually tried changing the border-radius to 0px. When I did, however, I discovered the scrollbar stayed round. Now it won't be.

199270e: Add more border radiuses

Does what it says. The changelog video, changelog modal and switches are now border-radius'd like they should be.

discord-plus - Discord+ 2.1

Published by PlusInsta over 6 years ago

This release is a big one. For once, I focused primarily on adding a bunch of new features, and bringing the dark and light theme closer in terms of functionality. There aren't going to be a lot of screenshots, so let's get right to it.

Additions

3ff01ac: New dynamic settings page

This is probably one of the biggest changes done to the theme in this update.
The Settings page now follows rule #2.

dark_dream_settings
light_dream_settings

Note: you might want to increase the zoom on ridiculously large-DPI screens.

5d20a45: Add settings sidebar buttons

The sidebar buttons now have smooth animations as you hover and click them.

8e7dd3c: Add animation for switching between themes

I always talk "added to light theme" and "fixed in the dark theme" and "broken across all themes to the point where I'm no longer able to fix it", but have you ever actually tried to switch themes at any point? If so, you'd notice it's a really sudden effect. Thankfully, CSS is a genius tool that allows us to do some really cool stuff.
Noticeably, clicking another theme will trigger a transition between dark and light.

19b1521: Add tooltips

Not much of a difference is made here, primarily because there's no way for me to check whether or not you're using the light theme. At least the background is more semi-transparent now.

aeb89b5: Add attachments

Now the files you upload, including audio and video, are round, transparent, and accent-colored!

7fb1335: Fix server settings for light theme

Because I'm stupid, only the dark theme was themed. Now the light theme can enjoy some rounded-accentcolored-transparented-goodness too.

c797514: [Light] Add changelog modal

You can barely tell, but yes, the changelog modal is now semi-transparent in the light theme.

42b842a: Add audit log

Not much to say. The audit log is now themed.

cbe698e: Add Settings textboxes

I feel like I'm running out of big changes to talk about. Uhh, textbox colored.

c270211: Finish implementing roundness in server settings

This is a continuation of the previous commits related to the server settings. This adds the emoji/members backgrounds and a few other things to the list of accent-colored, rounded, semi-transparent surfaces.

bbc3026: Introducing new buttons

Tired of seeing that ugly shade of Discord-branded blue when you hover over the buttons, instead of your accent color? Now it's the other way around: the buttons are dark/light, and when you hover over them, you see your accent color! No more Discord-branded blue!

7e16b71: Rewrite channels for compatibility

This is possibly the longest time I've spent on fixing something.

I'm going to start by breaking down the problems:
Dark theme had no animations.
Light theme had some areas broken.
Dark theme had a lot of inconsistencies with the light theme, and vice versa.

My solution? Rewrite the damn thing.
I spent a while hunting for values, finding out what's the most efficient solution for both themes. I also finally fixed the light theme channel icons, the dark theme animations (or the lack thereof), compatibility with every channel type, and probably more things.

Most people aren't going to see a noticeable difference, but it's subtle enough to be good. I hope.

d0e5955: Add "Upload image" button

The "Upload image" buttons throughout Settings now look like the rest of the website's buttons.

bc00a93: Add avatar uploader

Due to me never changing my profile picture (except I do, almost every day), I never noticed the "upload avatar" icon not being rounded like the other avatars. That's a thing of the past though; it now follows the almighty var(--roundness) variable.

707a0a5: Add half-baked video support

First, it was the images in the chat. Now, it's the videos in your chat too. They're both round now.

"What do you mean by half-baked?" Oh, nothing. Just that there's an insanely annoying Discord Nitro iframe'd video in the Settings that I can't theme. That's all.

a4516bc: [Light] Minor improvements to profile popouts

I noticed there was an awfully bad contrast between the notes and the profile popout background. I checked the code; I never actually added separate code for the light theme. Instead, I just hacked off of the dark theme. I decided to stop being lazy and actually write out a second set of rules for the light theme, and the popouts now look cool and good. 😎

73fa06f: Add questionmark

This is minor and you won't even see if it you have Nitro, but the "Discord Nitro feature" questionmark, mainly seen in your account settings, is now round.

13d12d1: Add many things in Settings

I'm pretty sure almost all of Settings is now round.

fc3cee8: [Light] Add server categories

Like with channels, categories now have smooth transitions, as well as legible text in the light theme.

68a64eb: Add server member background

The background of hovered server members was grey.
I spent a couple minutes hacking something together, and now it's round-transparent-ish.

Known issues

HTML iframe videos aren't themed

Thanks to the Discord Nitro video in settings being the ONLY video on the goddamn website that uses an iframe, I can't make it round after you click on it. I've tried everything from advanced selectors to class names, and nothing makes it any better. This issue isn't really on me, it's on the Custom CSS for not supporting iframe styles.

It's not like anyone would watch that video anyway...right?

Changes

0ff2221: Better fix for DevilBro's notices

Previously, I'd just thrown a .flexChild-faoVW3 > div > div to brute-force a property onto .DevilBro-notice. This fixed the fact that the normal border-radius used !important. Little did I know, I actually affected several areas in Settings with the margin I set, unnecessarily. Now only the roundness (which is the only one that actually needs !important anyway) is in .flexChild-faoVW3 > div > div, and the rest is applied directly to .DevilBro-notice.

afff43e: Fix colors for BD switches

Not a bug as much as a fatal consequence of my stupidity. I tried splitting this across lines, which obviously does not work.
The selectors are now in the same line, and BetterDiscord switches are all purple when selected.

863fd5d: Cleanup code

A huge cleanup of the Channels code, left over from 7e16b71. Notably, I removed every unnecessary line of code, and re-organized the lines so that they made sense.
Also, I moved one line that was from "friends list" to "channels".

73193c4: Remove obsolete code

Ah, yes. Don't you just love it when Discord changes perfectly valid class names like .channel-members to .members-1998pB? Well, I DON'T. I poked around for some seconds before realizing this code was obsolete. Just to make sure, I tested it. The lines are ancient leftovers from very early versions of the theme, and when applied to the newest version, do not look good at all. Needless to say, it had to go.

482ad48: Fix BetterDiscord top buttons not being clickable

Ah yes, all changes come with a price. That major settings overhaul I did came with a change to the padding. This padding, however, made the javascript-powered BetterDiscord buttons unclickable. I checked the minimum padding I could have where the buttons were still functional, and it was 45px. It's a huge step down from 20px (which is the usual padding I use), but it's still better than the whopping 60 pixels that Discord likes to use.

discord-plus - Warmrepair #3

Published by PlusInsta over 6 years ago

This update brings with it a few improvements, as well as more compatibility outside of Windows.

Disclaimer:
The screenshots taken for this release were taken at different times.
I cannot guarantee that every screenshot matches the final product.

Additions

83ab5b5: Add game icons

Ever popped up someone's profile and noticed the icon of the game they're playing isn't round?
Well, fear no more! You can now see your own roundness value applied to those icons.

Game icons

9c24c75 / a4116e1: Color BD notices and sandwich it

BetterDiscord notices are not only colored with your accent color now, they're also squeezed in-between the titlebar and main content.

changelog_3_plugins_interconnected

ad720d5: Add PluginRepo notice

BetterDiscord's own plugin notice isn't the only one that was added; if you have PluginRepo, you'll be seeing a sleeker bar too.

changelog_3_plugins_devilbro

06ef3ec: Improvements to macOS window buttons

To celebrate BandagedBD working again, I finished theming the window buttons.

In case you wanted a before-and-after, well...
Here's the blind edit I made previously.

It's totally off!

And here's the fix I did.

Perfection.
Thanks to the way Discord implemented Apple's window buttons, the buttons can be "integrated" with the scrollbar, which matches the theme's look and feel. GG, Apple!

4115138: Add BetterDiscord Custom CSS box

changelog3_bdcss
The BetterDiscord Custom CSS box is now var(--roundness) just like the rest of @import url(DiscordPlus.theme.css)! I can't wait to #bd-customcss-editor:active !

Note: #6

917a460: Settings fixes

Although this commit mainly fixed a bug that involved odd corners in the dark theme settings, this commit also colored the checkboxes you find around Discord.

changelog3_checkbox

changelog3_checkbox2

Known issues

macOS sans Product Sans

I hope you're ready to have a bad time.

image of sans undertale for comic effect
macOS doesn't like TrueType fonts at all.

Although I set up Apple's beautiful San Francisco Display as a fallback font, I'd prefer one consistent look across platforms.
You'll have to manually add Product Sans to your Font Book if you want to use Google's *cough* proprietary, unlicensed font. More on that later.

Changes

385dba4: Update DiscordPlus.theme.css

This commit, done by @intrnl, fixes the last remaining class names.
In English, that means "everything which was once broken is now fixed."
Thanks!

d547014: Remove the pinned messages gimmick

I don't feel this is GIF-worthy, but instead of pinned messages being greyscale until hovered over, the borders light up when hovered. This unnecessary effect always felt weird to me, so it was about time I got rid of it.

2d485f1: [Dark] Fix "Jump" not being visible

Due to an oversight, I accidentally made "Jump" in pinned messages use the transparency value. The text is now white, like the X button.

b4a4c90: Change accent color to solid color

This was done because certain surfaces looked odd unless the accent color was solid.
I'll look into making the accent color's backgrounds semi-transparent through another method.

ee106ba: Improved scrollbar

Minor padding change along with the above commit leads to a better-looking scrollbar.

changelog3_scrollbar

306c942: Move to variable sizes

This affects the titlebar on Windows.
Essentially, I changed pixels and percentages to the W3C-recommended "view-width" and "view-height" units. The titlebar looks exactly the same, and the difference is less than a pixel. If you have a 4K display, you might notice a marginal difference, but other than that nothing really changed. I guess if you have a mod that lets you downsize the window below the minimum size, you'll notice the titlebar no longer protrudes the main content.

A pointless change for now, but a necessary one to ensure forwards-compatibility.

64a9aa6 / 07a5691: Move to Google's font API

Another not-immediately-noticeable change, but the theme and page now both use Product Sans.
Uh, by that I mean it now uses Google's official font API to deliver Product Sans.
What this means for the end user is nothing, if not for better loading times.
This also reduces bandwidth to the repository, though honestly, I don't expect to reach the gigabyte limit this early.

Yes, I realize the stylesheet Google sends back says it's not licensed. No, that didn't stop people from publishing their paid apps on Google's Play Store, or modifying Android to use their unlicensed font.

discord-plus - Hotfix #2

Published by PlusInsta over 6 years ago

This update brings with it lots of small changes, most of which are thanks to Discord having broken everything last week.

First, let's talk about the Windows titlebar.

2c44c20: Add logo

Discord+ logo
The logo now looks 300% more radical with that extra plus. Not much was changed besides that.

Speaking of titlebars,

00cc36a: macOS window buttons

Now, like I said, everything broke after 0.0.301 came out. And by that I mean BetterDiscord will not work on macOS anymore. Despite this, I got ahold of the macOS window buttons div, and made some quick mods.
Once BetterDiscord works again, your Mac window buttons shouldn't look out of place with the theme.

For obvious reasons, I can't provide a screenshot.

EDIT (5/6/2018):
This "fix" actually looks abysmal.
screen shot 2018-05-04 at 11 05 55
I highly recommend you use v2.0.3 or higher if you're on macOS.

Now, for the fixes:

6ac970d: Fix loading container

The loading screen is now transparent
If your Internet connection suddenly drops out while posting a meme, you won't be staring at a grey wall anymore.

025815b: Fix links

If you previously couldn't see Product Sans, it's because I messed up the links.
It should work now, even if you don't have Product Sans installed.

3f504d6: Fix upload modal

Upload drop modal
Upload modal
You probably never pay attention to this box, but that doesn't stop me from painting it.
The upload modal now has your accent color, both before and after releasing the mouse button.

And lastly:

6193688: Theme server settings

Server settings dropdowns
Server emoji
No more big ugly grey boxes in Settings.
That goes for both the dropdowns and the emoji section.

Unrelated to the theme itself, this repository now has a GitHub Pages page.
You can check it out here.