# Daemonite Material Theme

**URL:** https://meta.discourse.org/t/daemonite-material-theme/64521
**Category:** Theme
**Created:** [June 15, 2017, 3:30am UTC](https://meta.discourse.org/t/daemonite-material-theme/64521 "2017-06-15T03:30:03Z")
**Posts on this page:** 20
**Page:** 2

<div class="post-metadata">

### Author: ![sesemaya](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/sesemaya/32/119999_2.png) [@sesemaya](https://meta.discourse.org/u/sesemaya)
#### Post date: [March 8, 2018, 10:31pm UTC](https://meta.discourse.org/t/daemonite-material-theme/64521/21 "2018-03-08T22:31:57Z")

</div>

> [@Timothy\_Vail](#):
>
> Anyhow, how would I import some of the features of your theme into the material design theme?

Unfortunately there is not an easy way to import bits and pieces of a theme. You will have to cherry pick the styles for the components/features you like from the compiled CSS or Sass and apply theme on top of the theme you are currently using.

---

<div class="post-metadata">

### Author: ![trangchongcheng](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/trangchongcheng/32/120005_2.png) [@trangchongcheng](https://meta.discourse.org/u/trangchongcheng)
#### Post date: [March 9, 2018, 9:27am UTC](https://meta.discourse.org/t/daemonite-material-theme/64521/22 "2018-03-09T09:27:26Z")

</div>

i dont know input title layout error

 ![47](https://global.discourse-cdn.com/meta/original/3X/a/3/a3fcb24e9ad71c96e240c68ef512f3468aaab072.png)

---

<div class="post-metadata">

### Author: ![sesemaya](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/sesemaya/32/119999_2.png) [@sesemaya](https://meta.discourse.org/u/sesemaya)
#### Post date: [March 19, 2018, 1:09am UTC](https://meta.discourse.org/t/daemonite-material-theme/64521/23 "2018-03-19T01:09:54Z")

</div>

Hi @trangchongcheng, thanks for the feedback, this has been fixed by the latest update.

---

<div class="post-metadata">

### Author: ![trangchongcheng](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/trangchongcheng/32/120005_2.png) [@trangchongcheng](https://meta.discourse.org/u/trangchongcheng)
#### Post date: [March 19, 2018, 7:07am UTC](https://meta.discourse.org/t/daemonite-material-theme/64521/24 "2018-03-19T07:07:33Z")

</div>

Thank..i working…  
But when i set google adsense (ads auto responsive) then forum cant responsive on mobile.

 ![IMG_2527](https://global.discourse-cdn.com/meta/original/3X/b/c/bcfb3e7b6a7e276a34ea8b932ac3ecace3512e08.PNG)

---

<div class="post-metadata">

### Author: ![djcyry](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/djcyry/32/161664_2.png) [@djcyry](https://meta.discourse.org/u/djcyry)
#### Post date: [March 21, 2018, 11:52am UTC](https://meta.discourse.org/t/daemonite-material-theme/64521/25 "2018-03-21T11:52:26Z")

</div>

Thank you very much for this theme !

---

<div class="post-metadata">

### Author: ![notriddle](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/notriddle/32/133055_2.png) [@notriddle](https://meta.discourse.org/u/notriddle)
#### Post date: [April 9, 2018, 3:56pm UTC](https://meta.discourse.org/t/daemonite-material-theme/64521/26 "2018-04-09T15:56:17Z")

</div>

[The badges display on the User Summary page looks broken](https://labs.daemon.com.au/u/modius/summary)

 ![image](https://global.discourse-cdn.com/meta/original/3X/d/3/d3b9e40fe3d9467566020e90b4cb77a247577a6f.png)

---

<div class="post-metadata">

### Author: ![PatrickH](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/patrickh/32/116296_2.png) [@PatrickH](https://meta.discourse.org/u/PatrickH)
#### Post date: [May 8, 2018, 5:37am UTC](https://meta.discourse.org/t/daemonite-material-theme/64521/30 "2018-05-08T05:37:51Z")

</div>

I have some problem with the first button:

 ![image](https://global.discourse-cdn.com/meta/original/3X/a/a/aadf8ba5d3120dadccda898c8bd449101484a055.png)

Also the tekst below the title is not displayed ?

I have also an exclamation mark next ot the name

 ![image](https://global.discourse-cdn.com/meta/original/3X/c/f/cf2abd68e88cc90716a6c933c32ceaee78b1292f.png)

is this theme still being updated ? I already figured out the exclamation mark 😊

ok, almost there…  
The categorie button is not in Material Design, how can i fix this ?

 ![image](https://global.discourse-cdn.com/meta/original/3X/7/8/788ec20ab9f686abd87b448464a7061e0a0f2368.png)

---

<div class="post-metadata">

### Author: ![sesemaya](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/sesemaya/32/119999_2.png) [@sesemaya](https://meta.discourse.org/u/sesemaya)
#### Post date: [May 11, 2018, 12:08am UTC](https://meta.discourse.org/t/daemonite-material-theme/64521/31 "2018-05-11T00:08:37Z")

</div>

Hi @notriddle, the badges section is now cleaned up in the latest version.

---

<div class="post-metadata">

### Author: ![sesemaya](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/sesemaya/32/119999_2.png) [@sesemaya](https://meta.discourse.org/u/sesemaya)
#### Post date: [May 11, 2018, 12:14am UTC](https://meta.discourse.org/t/daemonite-material-theme/64521/32 "2018-05-11T00:14:25Z")

</div>

Hi @PatrickH,

Regarding category dropdown, it works both for us at [https://labs.daemon.com.au/](https://labs.daemon.com.au/) and on [Theme Creator](https://theme-creator.discourse.org/theme/sesemaya/material).

 ![37%20am](https://global.discourse-cdn.com/meta/original/3X/d/1/d1b03fc055a7726ebac6be9fac990d85884468a8.png)

The reason I can think of at this stage is maybe you have an older version of Discourse and the markup for the category button is somehow different.

---

<div class="post-metadata">

### Author: ![PatrickH](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/patrickh/32/116296_2.png) [@PatrickH](https://meta.discourse.org/u/PatrickH)
#### Post date: [May 11, 2018, 11:48am UTC](https://meta.discourse.org/t/daemonite-material-theme/64521/33 "2018-05-11T11:48:24Z")

</div>

I have version: Discourse 1.9.5

---

<div class="post-metadata">

### Author: ![Eduardo\_Braga](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/eduardo_braga/32/110348_2.png) [@Eduardo\_Braga](https://meta.discourse.org/u/Eduardo_Braga)
#### Post date: [September 26, 2018, 2:54pm UTC](https://meta.discourse.org/t/daemonite-material-theme/64521/37 "2018-09-26T14:54:55Z")

</div>

How do I add this menu?

 ![help](https://global.discourse-cdn.com/meta/original/3X/d/0/d086b3ce8f88712363376ec57d5090c4bb47c715.png)

---

<div class="post-metadata">

### Author: ![modius](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/modius/32/108600_2.png) [@modius](https://meta.discourse.org/u/modius)
#### Post date: [October 11, 2018, 3:05am UTC](https://meta.discourse.org/t/daemonite-material-theme/64521/38 "2018-10-11T03:05:20Z")

</div>

> [@Eduardo\_Braga](#):
>
> How do I add this menu?

That’s the topic preview plugin..

[https://meta.discourse.org/t/topic-list-previews/41630](https://meta.discourse.org/t/topic-list-previews/41630)

---

<div class="post-metadata">

### Author: ![angus](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/angus/32/341715_2.png) [@angus](https://meta.discourse.org/u/angus)
#### Post date: [November 25, 2018, 11:57pm UTC](https://meta.discourse.org/t/daemonite-material-theme/64521/41 "2018-11-25T23:57:28Z")

</div>

@modius I just submitted three PRs for minor fixes to this theme. Let me know if the descriptions of what is being fixed are not clear:

[https://github.com/Daemonite/discourse-material-theme/pull/6](https://github.com/Daemonite/discourse-material-theme/pull/6)

[https://github.com/Daemonite/discourse-material-theme/pull/5](https://github.com/Daemonite/discourse-material-theme/pull/5)

[https://github.com/Daemonite/discourse-material-theme/pull/4](https://github.com/Daemonite/discourse-material-theme/pull/4)

---

<div class="post-metadata">

### Author: ![Merlls\_Rizzini](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/merlls_rizzini/32/125604_2.png) [@Merlls\_Rizzini](https://meta.discourse.org/u/Merlls_Rizzini)
#### Post date: [November 26, 2018, 2:56am UTC](https://meta.discourse.org/t/daemonite-material-theme/64521/42 "2018-11-26T02:56:29Z")

</div>

@sesemaya see post above. 😁

---

<div class="post-metadata">

### Author: ![angus](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/angus/32/341715_2.png) [@angus](https://meta.discourse.org/u/angus)
#### Post date: [November 26, 2018, 11:36pm UTC](https://meta.discourse.org/t/daemonite-material-theme/64521/43 "2018-11-26T23:36:18Z")

</div>

@sesemaya Thanks for merging! In the course of the modifications and other updates we seem to have ended up with two toggles in the mobile compose. I think it might be because you’ve added both `.toggle-toolbar` and `fa-bars` to the material icon `:before` overrides.

 ![Screenshot%20at%20Nov%2027%2010-32-35](https://global.discourse-cdn.com/meta/original/3X/b/f/bfe0de97d70afdd04687e1e36f8ea07b61f0398a.png)

---

<div class="post-metadata">

### Author: ![pmusaraj](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/pmusaraj/32/119489_2.png) [@pmusaraj](https://meta.discourse.org/u/pmusaraj)
#### Post date: [November 27, 2018, 12:10am UTC](https://meta.discourse.org/t/daemonite-material-theme/64521/44 "2018-11-27T00:10:48Z")

</div>

This is likely because I just merged FontAwesome 5 into master and now the core icons are no longer in `:before`s (more [here](https://meta.discourse.org/t/introducing-font-awesome-5-and-svg-icons/101643)). I tried removing the `:before` on the browser console, and it seems to do the trick.

---

<div class="post-metadata">

### Author: ![modius](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/modius/32/108600_2.png) [@modius](https://meta.discourse.org/u/modius)
#### Post date: [November 29, 2018, 6:43am UTC](https://meta.discourse.org/t/daemonite-material-theme/64521/45 "2018-11-29T06:43:58Z")

</div>

> [@pmusaraj](#):
>
> This is likely because I just merged FontAwesome 5 into master and now the core icons are no longer in `:before` s (more [here](https://meta.discourse.org/t/introducing-font-awesome-5-and-svg-icons/101643)). I tried removing the `:before` on the browser console, and it seems to do the trick.

@sesemaya is taking a look at what we can do to preserve Material icons in light of the FontAwesome changes tomorrow.

---

<div class="post-metadata">

### Author: ![tshenry](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/tshenry/32/119495_2.png) [@tshenry](https://meta.discourse.org/u/tshenry)
#### Post date: [November 29, 2018, 11:50am UTC](https://meta.discourse.org/t/daemonite-material-theme/64521/46 "2018-11-29T11:50:13Z")

</div>

@modius, at the moment it looks like using the old icon render works. Here’s the code if you want to try it out in the `</head>` section of a theme component:

```plaintext
<script type="text/discourse-plugin" version="0.8">
    const h = require("virtual-dom").h;
    
    // Support for font awesome icons
    function faClasses(icon, params) {
      let classNames = `fa fa-${icon.replacementId || icon.id} d-icon d-icon-${
        icon.id
      }`;
    
      if (params) {
        if (params.modifier) {
          classNames += " fa-" + params.modifier;
        }
        if (params["class"]) {
          classNames += " " + params["class"];
        }
      }
      return classNames;
    }
    
    // default resolver is font awesome
    api.registerIconRenderer({
      name: "font-awesome",
    
      string(icon, params) {
        let tagName = params.tagName || "i";
        let html = `<${tagName} class='${faClasses(icon, params)}'`;
        if (params.title) {
          html += ` title='${I18n.t(params.title).replace(/'/g, "&#39;")}'`;
        }
        if (params.label) {
          html += " aria-hidden='true'";
        }
        html += `></${tagName}>`;
        if (params.label) {
          html += `<span class='sr-only'>${params.label}</span>`;
        }
        return html;
      },
    
      node(icon, params) {
        let tagName = params.tagName || "i";
    
        const properties = {
          className: faClasses(icon, params),
          attributes: { "aria-hidden": true }
        };
    
        if (params.title) {
          properties.attributes.title = params.title;
        }
        if (params.label) {
          return h(tagName, properties, h("span.sr-only", I18n.t(params.label)));
        } else {
          return h(tagName, properties);
        }
      }
    });
</script>

```

It looks like there still might be a few icons that aren’t rendering correctly (`.fa-thumbtack` is the notable one), but in any case, I think this might be one angle to look at.

---

<div class="post-metadata">

### Author: ![Merlls\_Rizzini](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/merlls_rizzini/32/125604_2.png) [@Merlls\_Rizzini](https://meta.discourse.org/u/Merlls_Rizzini)
#### Post date: [November 29, 2018, 3:32pm UTC](https://meta.discourse.org/t/daemonite-material-theme/64521/47 "2018-11-29T15:32:27Z")

</div>

> [@Timothy\_Vail](#):
>
> The biggest thing I want to keep is the + button for new topics on the bottom right.

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

[https://github.com/angusmcleod/bcharts-theme](https://github.com/angusmcleod/bcharts-theme)

Thank you @modius and @sesemaya for such incredible theme. 😉

@tshenry you’re an angel. 🤗

---

<div class="post-metadata">

### Author: ![sesemaya](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/sesemaya/32/119999_2.png) [@sesemaya](https://meta.discourse.org/u/sesemaya)
#### Post date: [November 30, 2018, 12:46am UTC](https://meta.discourse.org/t/daemonite-material-theme/64521/48 "2018-11-30T00:46:35Z")

</div>

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.

[Previous page](https://meta.discourse.org/t/daemonite-material-theme/64521.md?page=1)

[Next page](https://meta.discourse.org/t/daemonite-material-theme/64521.md?page=3)