返信ボタンを CSS で修正するのが最も難しいことがわかりました。
マウスオーバー/フォーカス時に返信ボタンが明るくなるのを防いでいます。また、マウスオーバー時に「Reply」という単語が太字になるのも気に入らない点です。
直接マウスオーバーするとフォントの色も変わりますが、「Reply」という単語ではなくアイコンだけが変わるので、デフォルトを統一するための CSS が必要です。
返信ボタンには多くのエフェクトがかかっており、何らかの太字化/フォントの重み付けも適用されているようです。
これは私が持っているコードですが、まだフォントが拡大されるエフェクトが発生しています。明るくなるエフェクトは取り除くことができました。
.post-info.edits .btn-flat svg,
.post-info.edits .btn-flat .d-button-label,
.topic-post .post-controls .create svg,
.topic-post .post-controls .create .d-button-label {
fill: #7b7b7b !important;
color: #7b7b7b !important;
}
/* 2. ホバー状態: e0e0e0 に変更 */
.post-info.edits .btn-flat:hover svg,
.post-info.edits .btn-flat:hover .d-button-label,
.topic-post .post-controls .create:hover svg,
.topic-post .post-controls .create:hover .d-button-label {
fill: #e0e0e0 !important;
color: #e0e0e0 !important;
}
/* 3. 明るさ/グローを無効にし、遷移を遅くする */
.post-info.edits .btn-flat,
.topic-post .post-controls .create {
opacity: 1 !important;
filter: none !important;
transition: none !important;
animation: none !important;
}
/* 4. スクロールハイライトで色が薄くなるのを防ぐ */
.topic-post.highlighted .post-controls .create,
.topic-post.highlighted .post-info.edits .btn-flat {
filter: none !important;
opacity: 1 !important;
}
組み込みのスタイリング機能を使ってアイコン/フォント/テキストを変更できると非常にありがたいです。なぜなら、私のニーズに合わせてデフォルトの外観を良くするために多くの CSS を適用しているからです。
以前はもっと良く見えていたのですが、二重のボタンや適用されているさまざまなスタイルのために多くの問題が発生したため、持っていた CSS を削除しなければなりませんでした。