件名の通り、North テーマでヘッダーにマウスオーバーした際のバックグラウンドカラーの反転を無効にしたいのですが、上手くいきません。
app.css の下記をコメントアウトしても期待の結果にならず（挙動が変わらず）。解決案を教えていただけますでしょうか。
よろしくお願いします。
.header.hover:after {
opacity: 1; }
.header.hover, .header:hover {
background: #fff; }
Topic summary
Northテーマでヘッダーにマウスオーバーした際の背景色反転を無効化する方法についての質問です。
問題点:
- app.cssの該当箇所をコメントアウトしても挙動が変わらない
- ヘッダーのホバー時の背景色変更を止めたい
提案された解決策:
有料テーマのため詳細調査は困難だが、対処療法として以下を提案:
- テーマカスタマイズ画面 > header のカスタムCSSで調整
- 具体的なCSSコード例が提供されている:
.header.hover,.header:hoverの背景色設定をunsetに- リンクやボタンの色指定
- モバイルトグルスパンの背景色を
#fffに設定
スクリーンショット付きで手順が示されており、カスタムCSS経由での上書きによる解決方法が提案されています。
@TMiura 様
有料テーマなので、詳しく調べることができませんでした。
対処療法でよろしければ、下図のように、
テーマカスタマイズ画面 > header のカスタムCSSで調整するのはどうでしょうか？
カスタムCSSの内容は下記です。
.header.hover,
.header:hover {
background-color: unset;
}
.header.hover a,
.header.hover button,
.header:hover a,
.header:hover button {
color: #fff;
}
.header.hover .mobile-toggle span,
.header:hover .mobile-toggle span {
background: #fff;
}
ご参考まで。
(キュー田辺)