【JIN】に乗り換えましたが、【stork】のテプラみたいなカテゴリのレイアウトが好きだったので、【JIN】の丸っぽさを四角く変更したくて試行錯誤しました。私はこれを、このまま「外観/カスタマイズ/追加CSS」に書き込んでいます。
カスタマイズの途中ですが、お知らせします
/* 角丸のサイズを指定する */
と書かれている行の数値を修正すると、お好みの角丸感に変更できます。
/* 記事のカテゴリの角丸をとる */
.cps-post .cps-post-header .cps-post-cat a {
font-size: 0.8rem;
color: #fff !important;
border-radius: 0px; /* 角丸のサイズを指定する */
line-height: 0;
padding: 1px 8px 1px 8px; /* 天左地右の余白を指定する */
}
/* topページマガジン型のカテゴリの角丸をとる */
.post-list-mag .post-list-item .post-list-inner .post-list-meta .post-list-cat, .post-list-mag3col .post-list-item .post-list-inner .post-list-meta .post-list-cat {
position: absolute;
color: #fff !important;
letter-spacing: 0;
border-radius: 0px; /* 角丸のサイズを指定する */
top: 0px; /* 天からのアキを指定する */
left: 0px; /* 左端からのアキを指定する */
font-size: 0.7rem;
padding: 1px 8px 1px 8px; /* 天左地右の余白を指定する */
margin-left: -1px;
font-weight: 500;
}
/* topページベーシックのカテゴリの角丸をとる */
.post-list.basicstyle .post-list-item .post-list-inner .post-list-cat {
display: inline;
font-size: 0.7rem;
font-weight: 400;
letter-spacing: 0;
position: absolute;
color: #fff !important;
border-radius: 2px; /* 角丸のサイズを指定する */
top: 0px; /* 天からのアキを指定する */
left: 0px; /* 左端からのアキを指定する */
padding: 1px 8px 1px 8px; /* 天左地右の余白を指定する */
}
550600
できた〜!と喜んでいたら、ピックアップコンテンツの角丸が抜けていました…。そのうち修正…しないままテーマを乗り換えました。