Users running a non-download version of Vanilla (pulled from github), on branch release/2019.016 or master from the last 2 weeks should upgrade to release/2019.017 or latest master for security reasons. Downloaded official open sources releases are not affected.
Please upgrade here. These earlier versions are no longer being updated and have security issues.

How to change the "new discussion" button color + the menu color in Vanilla 2.8

Congrats for this wonderful release !

I just would like to know how I can change the color of the "start a new discussion" button.

I tried in CSSEdit with this code :


.Button.Primary:hover {

  background: #ef4126;

  border-color: #ef4126;


But it doesn't work, it only changes the color when I mouse over the button.

I also would like to change the color of the big blue DIV (the top menu). I tried to find the code with Web Inspector but found nothing.

Thanks for help 🙂


  • whu606whu606 I'm not a SuperHero; I just like wearing tights... Moderator
    edited February 2019

    Have a look at the CSS code which you have posted, and you should be able to work out why it only works on mouse over.

    I'm not being mean by not simply telling you, but hoping you will try to understand a bit of what is happening.

  • Ok, I was finally able to change the color with a lot of gropes 🤗

    Another question : how can I change the header color of the mobile theme? It's visibly not the same as the desktop version...

    I tried to inspect with Android, but you can't click on a separate element, you just view the entire code, so it's very tough to find the right line to edit...


  • R_JR_J Cheerleader & Troubleshooter Munich Moderator

    Here is what I would do: I would edit the config.php and set the (desktop-)theme to the same as the mobile theme is and then inspect it with the usual tools

  • Thank you but I try to set all the changes in CSSEdit mod. Is it the same way?

  • R_JR_J Cheerleader & Troubleshooter Munich Moderator

    I think you can choose if the CSS should be applied to mobile theme, too, there is a setting below the editor input.

    There is a class in the body tag which helps designing for desktop/mobile (take a look at the body element with the web inspector tool of your browser):

    body.isDesktop h1 {
     color: green;
    body.isMobile h1 {
     color: red;

  • Nice, thanks, I even didn't notice there is a button "enable on mobile theme"... 🙂

Sign In or Register to comment.