Files
wordpress-theme-aksrt/assets/css/frontend/comments/layout.css
T
2026-08-30 20:38:25 +08:00

208 lines
4.4 KiB
CSS
Raw Blame History

This file contains ambiguous Unicode characters
This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.
/* ============================================================
* 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;
}