デフォルトのバッジの色を変更する (ブロンズ、シルバー、ゴールド)

開発
1

メダルを金、銀、銅から、テーマカラーによりマッチする3色に変更することは可能ですか？もう少しマッチするように変更したいです。

2

CSSの達人ではありませんが、これが私の解決策です… 下の色をテーマカラーに合わせて好きなように変更するだけです。また、このトピックを読むことをお勧めします。過去に私のサイトでクールなことをする方法を学ぶのに役立ったので、非常に役立ちました。

Bronze

.badge-card .badge-contents .badge-icon.badge-type-bronze .fa {
    color: #cd7f32 !important;
}

Silver

.badge-card .badge-contents .badge-icon.badge-type-silver .fa {
    color: silver !important;
}

Gold

.badge-card .badge-contents .badge-icon.badge-type-gold .fa {
    color: #e7c300 !important;
}
4

伝説。本当にありがとうございます！

5

何かを見つけるためにインスペクトを使っているだけですか？すべて変更しましたが、ユーザーカードに表示されるものを修正しようとしています。Chromeのインスペクトは、物事の名前を見つけるための方法ですか？

6

はい、カスタマイズしたいもののクラスを見つけるには、要素をインスペクトするだけです。スタイルガイドも役立つと思います。

7

素晴らしい！そのスタイルガイドは重要ですね。文字通り、すべてを調整するのに役立ちました（ローンチ前のスタイリング）。

それから管理セクションにアクセスできるか知っていますか？見つけられませんでした。

対処すべき残りの唯一のことは、信頼レベルごとのユーザーの色です。検査してみましたが、この小さなブロンズ色のコンテナを変更するものは何もありませんでした。これは最後のタスクであり、今日中に終わらせる決意をしています（笑）

Screenshot 2023-07-30 at 8.02.18 AM
Screenshot 2023-07-30 at 8.02.18 AM560×222 4.31 KB

8

それは管理ダッシュボードにあるので、通常のユーザーには表示されません。でも、どうぞ：

TL 1：

.user-metrics .table-cell.user-basic {
    background: [ここにカラーコードまたは変数を挿入];
}

TL 2：

.user-metrics .table-cell.user-member {
    background: [ここにカラーコードまたは変数を挿入];
}

TL 3：

.user-metrics .table-cell.user-regular {
    background: [ここにカラーコードまたは変数を挿入];
}

TL 4：

.user-metrics .table-cell.user-leader {
    background: [ここにカラーコードまたは変数を挿入];
}
9

素晴らしい。私の強迫性障害は大変感謝しています！！！:joy: