I've written here a couple of times before about the colors in my DevTools Console displaying weirdly -- ordinary log text in orange or red, and error text in black. Apparently a lot of people are not seeing this problem; maybe it's because I'm on a Mac? Or something specific to my FF profile?
Anyway, after a lot of research and experimentation, I've been able to partially fix the problem, for the Light and Dark themes. I have _not_ been able to fix the pink or red text in the Firebug theme, however. In any event, in case it helps someone else, I'm pasting below the code (with comments) that I added to my userChrome.css file. (BTW, the font sizes I set are just to start; I discovered that I can zoom the text in and out in the Console the same way I can in an ordinary Firefox page.)
/* FIX SCREWBALL FONT COLORS IN MOZ DEVTOOLS: */
/* This fixes ordinary console.log text color, which was appearing in orange!, and also makes other UI changes: */
:root.theme-light {
--theme-highlight-lightorange: black !important;
font-size: 13px !important;
line-height: 1.7 !important;
/* Make Console bkgrnd color light tan instead of white: */
--theme-body-background: #ECE9D9 !important;
}
/* This fixes ordinary console.log text color, which was appearing in orange!, and also makes other UI changes: */
:root.theme-dark {
--theme-highlight-lightorange: #d0edd0 !important; /* dull light green */
font-size: 14px !important;
line-height: 1.7 !important;
/* After MUCH research & experimentation, I could not figure out how to alter the font-family from default 'monospace'. */
}
/* NOTHING I tried worked for the Firebug Theme (:root.theme-firebug) at all; the ordinary Console log text is still showing up in red. I experimented a lot; forget it. Use one of the 'standard' themes, the functionality is the same anyway. */