　【Arkhe】カテゴリーラベルの色を変更

当サイトは広告を含んでいます。

2025-05-16

/* 元々のラベルのパディングや色を削除 */
.p-postList__category,
.c-postTerms__item {
    background: none;
    position: relative;
    padding: 0;
}

/* spanの方をボタン形状にする */
.p-postList__category span,
.c-postTerms__item a {
    display: inline-block;
    white-space: nowrap;
    padding: 5px 10px 5px 20px;
}

/* アイコンはabsoluteで重ねる */
.p-postList__category svg,
.c-postTerms__item svg {
    position: absolute;
    left: 5px;
}

/* 各カテゴリーで色を付ける */
.p-postList__category span[data-cat-id="7"],
.c-postTerms__item a[data-cat-id="7"] {
    background: red;
    color: white;
}

.p-postList__category span[data-cat-id="4"] ,
.c-postTerms__item a[data-cat-id="4"] {
    background: blue;
    color: white;
}