afonsof / jenkins-material-theme

Beautify your Jenkins with the Material Design theme!
http://afonsof.com/jenkins-material-theme
MIT License
1.73k stars 357 forks source link

breaking ansicolor! #140

Open mattvonrocketstein opened 6 years ago

mattvonrocketstein commented 6 years ago

First, this theme is amazing.. thank you very much for making jenkins-classic look presentable. I can't give up this awesomeness, but I think CSS might be breaking the ansicolor plugin which I also can't live without. Bold styles seem to have some kind of support, but colors get lost in my output on my chrome.

I'm using this CDN link: https://cdn.rawgit.com/afonsof/jenkins-material-theme/gh-pages/dist/material-blue-grey.css

From my debugger I see this for CSS classes

-output, .console-output * {
    position: relative;
    font-family: Roboto Mono,monospace!important;
    font-size: 14px;
    background: #263238;
    color: #e9eded;
    cursor: text;
}

Turning off this mention of "color"above wrecks the visibility of uncolored console text , but does bring back color text as expected.

The jenkins ANSI color plugin is generating ansi-to-html that looks for instance like this: <span style="color: #00CD00;"><b>green</b></span>

It shouldn't matter since I think the problem is conflicting CSS, but I'm using python's colored module for generating the console colors (I've also tried with colorama previously)

Sylwekqaz commented 6 years ago

It seems to me that the problem is through universal selector. Universal selector select all nested objects, and it's hard to overwrite this rule. Changing -output, .console-output * to -output, .console-output pre solves the problem