navクラスのボタンのホバー背景色を変更

[patrickemin]

こんにちは、このディスカッションを見つけました。

Button color changes

[34%20PM][01%20PM]Hello all, how do you change the orange default button color? I’ve changed it to the desired hex color in Settings>Customize>Colors but the buttons remain the default orange.

これを自分のケースに適用しようとしましたが、それは ナビゲーションボタンの背景色をホバー時に（アクティブ時ではなく）変更する方法 です。私の貧弱なCSS知識では不十分でした…助けていただけると幸いです

[awesomerobot (Kris)]

そのトピックは古くなったのでアーカイブします…

トピックリストの上にあるこれらのフィルターボタンのホバー色を変更したい場合：

いくつかの変数を使用しているため、次のように変更できます。

:root {
  --d-nav-bg-color--hover: #fab1ed;
}

このナビゲーションには、同じ方法で編集できる変数が一式用意されています。

@awesomerobot

:root {
  --d-nav-color: var(--primary);
  --d-nav-bg-color: transparent;
  --d-nav-color--hover: var(--primary);
  --d-nav-bg-color--hover: var(--d-hover);
  --d-nav-color--active: var(--tertiary);
  --d-nav-bg-color--active: transparent;
  --d-nav-border-color--active: var(--d-nav-color--active);
  --d-nav-underline-height: 0.125em;
}

一般的な参考情報：Making custom CSS changes on your site

[patrickemin]

@awesomerobot さん、ありがとうございます！カスタムCSSに追加しましたが、変化が見られません。「固定」カラーも試しましたが、同じく効果がありません。

:root {
  --d-nav-bg-color--hover: var(--quaternary);
}

[Vaping_Community]

試すことができます

:root {
  --d-nav-bg-color--hover: var(--quaternary) !important;
}

[patrickemin]

@Vaping_Community

!important;

いいえ、まだ何も変わりません。変ですね。

[Vaping_Community]

CSSを追加するためのテーマコンポーネントを作成しましたか？

[patrickemin]

はい、他のCSSコードも動作しています。

[Vaping_Community]

:root を使ったことがありません。常にクラス名を使ってきました。今見てみる必要があります

[Vaping_Community]

私には !important なしで機能しました。

[patrickemin]

どうやってやったのですか？

[Vaping_Community]

あなたと同じです。最新のものの上では何も変わりませんでした。管理メニュー項目とユーザー設定メニュー項目が変更されました。

[patrickemin]

私の場合は、それらのどれにも目に見える変化はありません。

[Vaping_Community]

これは愚かな質問かもしれませんが、保存をクリックしていますか？

[patrickemin]

はい、やりました

[patrickemin]

必須ではありません。他の誰かが試すのを待ちましょう… @Steven、私のサイトの管理者なので、あなたが試していただけますか…

[Firepup650 (Firepup Sixfifty)]

念のため確認ですが、使用中のテーマには変更が適用されたテーマコンポーネントが含まれていますよね？

[patrickemin]

はい、テーマは一つだけです。

[Firepup650 (Firepup Sixfifty)]

キャッシュを更新（Ctrl/Cmd+Shift+R）しても、表示されませんか？

[patrickemin]

変更なし。

[patrickemin]

はい、他のDiscourseサイトが2つあるので、別のサイトでテストしたところ、うまくいきました！
dessein-tech.comサイトで、このMODと干渉しているものがあるようです。

すべてのコンポーネントを一つずつ無効にしましたが、効果はありませんでした。