テンプレート:Hatnote/styles.css

/* {{pp-template}} */
.hatnote {
    margin: 0.5em 0;
    padding: 3px 2em;
    background-color: transparent;
    border-bottom: 1px solid #a2a9b1;
    font-size: 90%;
}

/**
 * ダークモードに対応
 *
 * ".hatnote" は上記の通り "background-color: transparent;" 指定のため、
 * ダークモードではこのクラスの子要素の文字色が白になるよう調整する必要あり。
 * とりあえずは、[[Template:Dablink]]や[[Template:混同]]など{{Hatnote}}を
 * 呼び出しているテンプレートが "div.hatnote" 内にtableを生成するため、
 * それをカバーできるよう指定。
 */
html.skin-theme-clientpref-night .hatnote > table {
	color: inherit;
}

@media screen and (prefers-color-scheme: dark) {
	html.skin-theme-clientpref-os .hatnote > table {
		color: inherit;
	}
}
/* [[Category:テンプレートスタイル]] */