Jenkinsの見た目をカスタマイズ

Simple Themeというプラグインを使うと、任意のCSSやJSを読み込ませる事ができるらしい。

イラストはこちら。ほむらさんが「どうして？…どうしてなの？何度やってもビルドできない」とソウルジェムを真っ黒にしながら継続的インテグレーションしてくれますお（バックアップごときがやたらと失敗してるのはバックアップ先のNASの電源が入ってないからでワルプルギスが倒せないわけではありません）

しかしJenkinsのHTMLは、ユーザによるCSSカスタマイズを考えずに書かれているようで、結構面倒くさい。左上のJenkinsというロゴは画像で、display:noneで消してしまうとタイトルが無くなってしまうので、JSで画像を文字列に置き換えている。

document.addEventListener("DOMContentLoaded", function(){
  var img = document.querySelector("#top-panel img:first-of-type")
  var a = img.parentNode;
  a.removeChild(img);
  a.appendChild(document.createTextNode('Jenkins'));
  a.setAttribute("class", "title-text");
}, false);

他にも、インラインでスタイルが指定されているため、!important をつけないと上書きできない属性がある。たとえば、背景画像のJenkins氏とか。