208 lines
4.4 KiB
CSS
208 lines
4.4 KiB
CSS
/* ============================================================
|
||
* AKSRT Comments — 主布局(1:1 自有版权)
|
||
*
|
||
* 自参考主题评论区段全量移植(表情与快捷短语不在复刻范围),
|
||
* 是评论区布局规则的唯一来源;vendor main.min.css 已剥离同段规则。
|
||
* 依赖 bundle 中更早加载的 bootstrap 3(.list-unstyled/.list-inline/
|
||
* .dropdown-menu)与 core/tokens.css 的 CSS 变量。
|
||
* ============================================================ */
|
||
|
||
#comments .comment-box .comments-closed,
|
||
#comments .action-text,
|
||
#comments #cancel-comment-reply-link {
|
||
display: none;
|
||
}
|
||
|
||
#comments #postcomments .action-text,
|
||
#comments #postcomments #cancel-comment-reply-link {
|
||
display: inline-block;
|
||
}
|
||
|
||
#comments .comt-title {
|
||
width: 90px;
|
||
}
|
||
|
||
#comments .comt-title .comt-avatar .avatar {
|
||
width: 60px;
|
||
height: 60px;
|
||
}
|
||
|
||
#comments #postcomments .comt-title {
|
||
display: none;
|
||
}
|
||
|
||
#respond:not(.mobile-fixed) #postcomments .comt-box {
|
||
padding: 5px 5px 4px 5px;
|
||
background: var(--main-bg-color);
|
||
border-radius: 4px;
|
||
margin-top: 12px;
|
||
}
|
||
|
||
#comments #postcomments .comt-ctrl .but {
|
||
margin-bottom: 2px;
|
||
}
|
||
|
||
#comments .list-inline {
|
||
padding: 15px;
|
||
}
|
||
|
||
#comment {
|
||
margin-bottom: 5px;
|
||
}
|
||
|
||
.comment-signarea {
|
||
background: var(--main-shadow);
|
||
}
|
||
|
||
#respond + #postcomments .comment-filter,
|
||
.comment-signarea + #postcomments .comment-filter {
|
||
margin-top: 20px;
|
||
}
|
||
|
||
#postcomments .tab-nav-theme {
|
||
margin-top: 0;
|
||
}
|
||
|
||
#postcomments .tab-nav-theme li {
|
||
padding-bottom: 1px;
|
||
}
|
||
|
||
#postcomments .tab-nav-theme li::before {
|
||
bottom: -2px;
|
||
}
|
||
|
||
#postcomments .comment-footer {
|
||
position: relative;
|
||
}
|
||
|
||
#postcomments .avatar-img {
|
||
--this-size: 45px;
|
||
margin-right: 20px;
|
||
}
|
||
|
||
#postcomments .children .avatar-img {
|
||
--this-size: 26px;
|
||
vertical-align: 2px;
|
||
margin-right: 6px;
|
||
}
|
||
|
||
#postcomments .commentlist > .comment > .list-inline .author-box {
|
||
align-items: start;
|
||
/* 阻断外部作者卡片样式(如 single-post/author-actions 的 .author-box 卡片)
|
||
渗入评论头部:legacy 中评论头部是无装饰的 flex 行。 */
|
||
margin-bottom: 0;
|
||
padding: 0;
|
||
background: none;
|
||
border-radius: 0;
|
||
box-shadow: none;
|
||
}
|
||
|
||
#postcomments .commentlist > .comment > .list-inline .comment-footer {
|
||
margin-left: 65px;
|
||
margin-top: -25px;
|
||
}
|
||
|
||
#postcomments .comment .list-inline > .comt-main {
|
||
width: 100%;
|
||
}
|
||
|
||
#postcomments .commentlist .comment + .comment {
|
||
border-top: 1px solid var(--main-border-color);
|
||
}
|
||
|
||
#postcomments .comment .list-inline > li {
|
||
padding: 10px;
|
||
vertical-align: top;
|
||
}
|
||
|
||
#postcomments .comment-header {
|
||
font-size: 15px;
|
||
position: relative;
|
||
}
|
||
|
||
.comment-header .badge-status {
|
||
margin-top: 0;
|
||
width: 68px;
|
||
z-index: 0;
|
||
}
|
||
|
||
#postcomments .action count {
|
||
margin-left: 4px;
|
||
}
|
||
|
||
#postcomments .comt-meta > span:not(:empty) {
|
||
margin-right: 10px;
|
||
vertical-align: middle;
|
||
}
|
||
|
||
#postcomments .comt-meta > span a {
|
||
color: inherit;
|
||
}
|
||
|
||
#postcomments .comt-meta > span .but {
|
||
padding: 0.2em 0.8em;
|
||
}
|
||
|
||
#postcomments .comment-approve-link.unapprove {
|
||
color: #e87725;
|
||
}
|
||
|
||
#postcomments .comment-approve-link.approve {
|
||
color: #3695ff;
|
||
}
|
||
|
||
#postcomments .comt-meta > span .comment-trash-link {
|
||
color: #ff4b4b;
|
||
}
|
||
|
||
/* walker 输出的 <ol class="children"> 不带 .list-unstyled,而全局 reset 只覆盖 ul,
|
||
必须在此重置,否则二级评论回潮出 ol 默认的 "1." 序号和 40px 缩进。 */
|
||
#postcomments .children {
|
||
list-style: none;
|
||
padding-left: 0;
|
||
margin-left: 86px;
|
||
background: var(--main-shadow);
|
||
border-radius: var(--main-radius);
|
||
margin-bottom: 6px;
|
||
}
|
||
|
||
#postcomments .children .children {
|
||
margin-left: 23px;
|
||
}
|
||
|
||
#postcomments .children .avatar-icontag {
|
||
font-size: 8px;
|
||
height: 14px;
|
||
width: 14px;
|
||
}
|
||
|
||
.comment-content {
|
||
word-wrap: break-word;
|
||
white-space: pre-wrap;
|
||
}
|
||
|
||
.comment-content .enlighter-default {
|
||
margin-bottom: 0;
|
||
opacity: 0.9;
|
||
}
|
||
|
||
#postcomments .comment-content img {
|
||
max-width: 260px;
|
||
max-height: 350px;
|
||
display: block;
|
||
width: auto;
|
||
height: auto;
|
||
}
|
||
|
||
/* 假输入条仅移动端显示。必须带 #comments 前缀(id 特异性):
|
||
标记上自带的 .flex{display:flex} 等单类工具规则无论加载顺序
|
||
如何都压不过它,宽屏不会再重复出现假输入条。 */
|
||
#comments .virtual-input {
|
||
display: none;
|
||
}
|
||
|
||
.commentlist .no-more {
|
||
margin: 0;
|
||
padding-bottom: 10px;
|
||
}
|