コメント欄の返信ボタンをシンプルに表示するCSS

目的

muragonのカスタマイズ。

コメトン欄はコメント毎に返信ボタンが付き、ボタンが目立ち過ぎる。
また、投稿と返信コメントで返信ボタンの位置が異なる。
この為、表示を統一しシンプルに表示する。

CSS

/* 投稿 */
.comments li {
border-bottom : 1px solid #ddd;
}

/* 返信 */
.comment-reply {
display : flex;
flex-direction : column-reverse;
}

.comment-reply-contents {
border-left : 0;
}

.comment-reply-contents li {
border-top : 1px solid #ddd;
border-bottom : 0;
}

/* プロフィール画像 */
.comments .avatar img {
width : 32px;
height : 32px;
}

/* ハンドル名 */
.comments .handle-name {
font-weight : bold;
}

/* ユーザーID */
.muragon-id {
display : none;
}

.comment-date {
padding-top : 5px;
}

.comment-content p {
margin : 5px 0;
}

/* 返信ボタン */
.comment-reply-btn {
display : block;
margin : 0 0 5px 0;
border : 0;
padding : 0;
text-align : right;
font-size : 14px;
color : #999;
}

.comment-reply-btn:hover {
background-color : transparent;
text-decoration : underline;
color : #999;
}