jQuery UI ダイアログの背景色を変更するメモ

jQuery CSS Wicket

Wicket ばかり書いていると、Wicket の ModalWindow が便利で、jQuery UI の Dialog を書く機会が減り、
jQuery UI ダイアログの背景色を変更するの、どうやるんだっけ？
と少し気分が落ちる。。。（面倒くさいなあ！みたいな。。）

jQuery UI ダイアログの背景は、デフォルトで以下のスタイルが適用されてる。

.ui-widget-overlay {
    background: #aaaaaa;
    opacity: .3;
    filter: Alpha(Opacity=30);
}

この ui-widget-overlay クラスの background を変更すれば良い。
こんな風に。。

.ui-widget-overlay {
    background: #444444;
    opacity: .3;
    filter: Alpha(Opacity=30);
}

Wicket の方を調べてみる。
wicket-extensions-8.0.0.jar の中、
org.apache.wicket.extensions.ajax.markup.html.modal.ModalWindow
クラスが参照するリソース、
org.apache.wicket.extensions.ajax.markup.html.modal.res
の下に、modal.css があり、
以下のように transparent2.png という width:100px height:100px のＰＮＧ画像を
背景にしている。
↓↓↓↓↓↓

div.wicket-mask-dark{
    opacity: 0.1;
    background-color: black;
    filter: alpha(opacity=10);
    background-image: url(transparent2.png);
}

これをもっと暗くしたければ、以下をページＣＳＳに書けば良い。

div.wicket-mask-dark{
    background: #444444;
    opacity: .3;
    filter: Alpha(Opacity=30);
}