Daemonite Material Theme

For those who still wants this modification and bring back + icon, @angus made this one for me.


Thank you @modius and @sesemaya for such incredible theme. :wink:

@tshenry you’re an angel. :hugs:


Thanks @tshenry, that did the trick.

Although there are still a few icons that are not rendering correctly, they are because of naming changes in FontAwesome 5. For example, .fa-thumbtack in 5 was .fa-thumb-tack in 4. I will go through the changes and update theme CSS accordingly.

Thanks again for the workaround.


Still missing those icons. Collapse and Reorder categories.



what happened?


Dear @sesemaya,

first things first: Thank you so much for conceiving and maintaining this fantastic theme.

We would like to give it a ride in favor of the Material Design Stock Theme and in order to do so, tried to install a fresh instance of Discourse (2.2.0.beta7) just yesterday. We imported your theme directly from its GitHub URL https://github.com/Daemonite/discourse-material-theme, thus using the current development head.

However, we found some layout/rendering glitches we would like to share with you:

1. Icons in category list slightly off


2. Icons inside chips slightly off

Topic list


Topic list hamburger menu


3. Checker marks for color selection slightly off inside “New Category” dialog


4. Padding between avatar icon and username too narrow on personal badge page

e.g. /badges/1/basic?username=andreas.motl

Do you have an idea what we might have done wrong or about any possible reasons why these things might happen? Maybe this also relates to https://github.com/Daemonite/discourse-material-theme/issues/3 in any way?

Thanks in advance for your help!

With kind regards,


Regarding the first two issues

Solution, kind of

Both things can be mitigated by touching the .d-icon class at runtime. While .d-icon elements originally get sized at about 0.76em, increasing this by 1.0em like



Will make things look more smooth again:


However, I wouldn’t know how to add this at “compile time”, i.e. to make it persistent. I just manipulated the CSS using Browser developer tools at runtime.

Nevertheless I wanted to share this insight with you, you might know way better which things to adjust appropriately.

You can usually override plugins and themes with your own CSS installed as a Theme Component. I do this all the time. Create a Theme Component, add the delta CSS and add the Component to the Theme.


Hi @Eduardo_Braga, this has been fixed in the latest version.

1 Like

Hi @amotl, all the above issues have been fixed in the latest version. Theme still has some other issues with beta7 and I’ll try to get them fixed. In the meantime, if you see any bugs, please feel free to post them here or in GitHub.


Hi @sesemaya, this works like a charm. Thank you so much!

Thanks, we’ve spotted one or two other minor things and will be happy to share them along with some adjustments we additionally made to tweak the theme further.

Thanks again for your quick response and keep up the spirit!

Hi @sesemaya,

We’ve put some of the issues we encountered on GitHub and hope you will appreciate our bug hunt:

Besides that, we added two theme components to apply further adjustments to some parts of the vanilla Daemonite Material Theme.

After putting everything together, the preliminary results can be viewed here:

Quote blueprint ;]

Discourse and its Daemonite Material theme are truly gems in their fields. Thank you so much for bringing them together as such an amazing tandem of carefully crafted software components.

We hope that our humble feedback can contribute to further maturing.

With kind regards,


3 posts were merged into an existing topic: Daemonite Material Theme: Ample layout adjustments


I’ve registered at your forums to see if the padding of hamburger menu items stays intact (it does not at my own installation, most propably because the strings being in polish language, which are usualy longer than the english ones… This results in having a scrollbar with just a few items in my H menu, so it looks ugly. Same situation for user dropdown menu)

Anyway, I went to https://meta.ip-tools.org and registered, and you seem to have some bugs on the account activation page (the one you land at after clicking activation link from an email)

I’m using Chromium 71.0.3578.98 and your site autodetected and autoset the language to polish. This is an actual screenshot:

As you can see there is some white space above the navigation bar, which results in the overlapping. It still works, but I bet you don’t want it to act like this. Must be the yellow menu component missing. :slight_smile:

Haven’t tried that workflow yet, thanks a bunch!

The other things regarding scrollbars would then be addressed to @sesemaya, right? The scrollbar issue reminds me of @codinghorror’s comment above:

1 Like

Can anyone help how I can change this header icons to black?
After using this theme the icons are not good to see.


Have you tried adding a color scheme and then changing the CSS code? This code will revert back if you update, but for now I think it’s a good fix. I think you can also fork the repository and change it in GitHub. I’m not really sure.

Thanks but I am completly new to Discourse. Just set up my first site with it.
And tried this theme. So there is no official way to change this icons to black? The user icon is black. Only the search and menu icon is grey.

Hmm. I actually don’t know about this. I haven’t used this theme. Maybe try asking someone who have used this theme? Also, do you have other themes installed with this theme?

Use this in Common > CSS

.d-header-icons .d-icon {
    color: #000;
1 Like