Technical Details

Forum version : #ModernBB
Position : Founder
Concerned browser(s) : Mozilla Firefox, Google Chrome, Internet Explorer, Opera, Safari, Other
Screenshot of problem : https://i.imgur.com/kkiNLYq.png
Who the problem concerns : All members
Forum link : http://bbforums.me

Description of problem

How do I change the colour from black to white in the message box (shown in the attached screenshot)? When in the BBCode editor mode, the text colour is fine. But when in the default editor mode, the text shows as black.

This is the CSS I have currently for the message box, if it helps at all:

Code:

#message-box textarea {
   color: #CCCCCC !important;
}
.sceditor-toolbar {
   background-color: #B8C0D1 !important;
}
.sceditor-container textarea {
   background-color: #242629 !important;
}
.sceditor-container {
   background-color: #242629 !important;
}


Thank you for your help.

Edit: For some reason the text is now also black even in the BBCode editor mode.
Edit 2: I believe the text is black no matter what when typing in the quick reply box. But when creating or editing a post, it's black in the normal editing mode but white in the BBCode editing mode.
Edit 3: I managed to fix the colour of the text in the quick reply box for the BBCode editor mode with the following code:

Code:

.sceditor-container iframe,.sceditor-container textarea {
   color: #CCCCCC !important;
}

But still no luck with changing the text colour for the default editing mode.

Hey @Log,
Welcome to Forumotion Forum Support,
Use this JS, in all page

Code:

$(function() {
  $(function() {
    $(".sceditor-container iframe, .sceditor-container textarea")
      .contents()
      .find("head")
      .append(
        "<style>body,html,code:before,p,table{color:#FFFFFF!important;}</style>"
      );
  });
});


and this CSS

Code:

.sceditor-container iframe, .sceditor-container textarea {
  color: white!important;
}


like a shot,
pedxz

pedxz wrote:Hey @Log,
Welcome to Forumotion Forum Support,
Use this JS, in all page

Code:

$(function() {
  $(function() {
    $(".sceditor-container iframe, .sceditor-container textarea")
      .contents()
      .find("head")
      .append(
        "<style>body,html,code:before,p,table,{color:#FFFFFF!important;}</style>"
      );
  });
});


and this CSS

Code:

.sceditor-container iframe, .sceditor-container textarea {
  color: white!important;
}


like a shot,
pedxz

Thanks for your answer but I just tried adding both the JS and CSS but it did not seem to affect anything.

Check if the JavaScript pages are active:
Modules > HTML & JAVASCRIPT > Javascript codes management, find this option Enable Javascript code management and select Yes

pedxz wrote:Check if the JavaScript pages are active:
Modules > HTML & JAVASCRIPT > Javascript codes management, find this option Enable Javascript code management and select Yes

I did enable this before adding the JS code.

Hello @Log

May you please open a section in which guest can post in your forum in order for us to make tests and give you a proper answer?

Thank you