Change the text color on the menu bar, Monte Black theme..

Hi.. I am a bit new here so please try to help me out here.. I have added the theme Monte Black to my project. It looks good and professional and all fine, except the menu bar is not much visible. It is that yellow colour menu bar has a white color text on it. I need to change the text colour on the menu bar to black or any dark color so it stands out. Or either change the menu bar color to a darker colour. Please try to help as I need only to change this part in colour. Not to learn a full set of css.  Please help. Regards  
3 answers

Hi Dilan,

Although following through a css tutorial can be very helpful - you need to open up the [project_folder/theme/ file and extract file /styles/css/custom/custom.css and add the following to the end of the file;

/* custom styling */
.navbar-header a {
  color: #000 !important;

.mx-navbar-item .caret {
  color: #000;
  border-top-color: #000 !important;
  border-bottom-color: #000 !important;

Put the file back into  the zip file and restart your project.

Good luck!


Hi Dilan and Nick,

While the solution that Nick has suggested is ofcourse correct I was wondering why this wouldnt be edited in the SASS file instead of the CSS.

I'm still new with styling in Mendix but some coworkers told me that the SASS file can overwrite the CSS if you compile the project. So if you edit the CSS file it will work at first but the changes can be "gone" all of the sudden.  Do you know more of this Nick?




Robert is right. The proper way to make this change would be to open the _custom-variables.scss file. In it, you will find the variable $navtopbar-color which should be the one used in the _navigation.scss lib folder. Ofcourse, the scss files will need to be recompiled.