重新设计用户/作者卡片小工具:消除多层卡片堆叠

- WidgetUserCard/WidgetAuthorCard 内层根节点去掉重复的 zib-widget widget 类
- 用户卡片补 classname=widget_aksrt_user_card 钩子
- widget-batch5.css 新增外层 .zib-widget 包裹层透明化规则(含首页侧栏覆盖)
- 内层 .aksrt-user-card/.aksrt-author-card margin-bottom 归零,间距由外层统一
- 删除 custom-amount.css 重复的 .aksrt-user-card* 段
- 删除 sidebar.css 失效的 .widget-user-card* 死代码
- author-actions.css .user-card.author.zib-widget → .user-card.author
This commit is contained in:
2026-08-01 10:38:54 +08:00
parent 9027446bdc
commit 0fd5848884
7 changed files with 23 additions and 144 deletions
@@ -110,116 +110,6 @@
animation-play-state: paused;
}
/* ============================================================
* 10. 用户卡片 Widget
* ============================================================ */
.aksrt-user-card {
text-align: center;
padding: 20px;
}
.aksrt-user-card__avatar {
width: 72px;
height: 72px;
border-radius: 50%;
margin: 0 auto 12px;
overflow: hidden;
border: 3px solid var(--color-primary-soft, rgba(136,171,218,0.1));
}
.aksrt-user-card__avatar img {
width: 100%;
height: 100%;
object-fit: cover;
}
.aksrt-user-card__name {
margin: 0 0 4px;
font-size: 16px;
font-weight: 600;
color: var(--color-ink);
}
.aksrt-user-card__name a {
color: inherit;
text-decoration: none;
}
.aksrt-user-card__name a:hover {
color: var(--color-primary, var(--color-primary));
}
.aksrt-user-card__bio {
margin: 0 0 12px;
font-size: 13px;
color: var(--color-ink-3);
line-height: 1.5;
display: -webkit-box;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
overflow: hidden;
}
.aksrt-user-card__stats {
display: flex;
justify-content: center;
gap: 20px;
margin-bottom: 16px;
}
.aksrt-user-card__stat {
text-align: center;
}
.aksrt-user-card__stat-value {
display: block;
font-size: 18px;
font-weight: 600;
color: var(--color-ink);
}
.aksrt-user-card__stat-label {
font-size: 12px;
color: var(--color-ink-4, #8A8F98);
}
.aksrt-user-card__actions {
display: flex;
gap: 8px;
justify-content: center;
}
.aksrt-user-card__btn {
display: inline-flex;
align-items: center;
gap: 4px;
padding: 6px 16px;
border-radius: var(--radius, 10px);
font-size: 13px;
text-decoration: none;
transition: all 0.15s;
}
.aksrt-user-card__btn--primary {
background: var(--color-primary, var(--color-primary));
color: #fff;
}
.aksrt-user-card__btn--primary:hover {
opacity: 0.85;
color: #fff;
}
.aksrt-user-card__btn--ghost {
border: 1px solid var(--color-line);
color: var(--color-ink-2);
}
.aksrt-user-card__btn--ghost:hover {
border-color: var(--color-primary, var(--color-primary));
color: var(--color-primary, var(--color-primary));
}
/* ============================================================
* 11. 滚动触发动画初始状态
* ============================================================ */
-27
View File
@@ -129,33 +129,6 @@
margin-top: 2px;
}
/* 用户卡片 widget */
.widget-user-card {
text-align: center;
padding: 20px 16px;
}
.widget-user-card__avatar {
width: 64px;
height: 64px;
border-radius: 50%;
object-fit: cover;
margin-bottom: 10px;
}
.widget-user-card__name {
font-size: 15px;
font-weight: 600;
color: var(--color-ink, #333);
margin-bottom: 4px;
}
.widget-user-card__desc {
font-size: 12px;
color: var(--color-ink-3, #777);
margin-bottom: 12px;
}
/* 侧边栏响应式 — width/float 由 layout.css 的 --sidebar-width + site-layout-* 拥有。
* 禁止在这里硬编码 280px(会与 content-layout gutter 失配导致叠层/空隙)。 */
@media (max-width: 991px) {
@@ -636,7 +636,7 @@ html.dark .post-drop-meta__item:hover {
/* ===== Zibll user-card after-box ===== */
.user-card.author.zib-widget { margin-bottom: 16px; overflow: hidden; }
.user-card.author { margin-bottom: 16px; overflow: hidden; }
.user-card.author .user-avatar { display: flex; justify-content: center; }
.user-card.author .user-avatar .avatar,
.user-card.author .user-avatar img { width: 80px; height: 80px; border-radius: 50%; object-fit: cover; }
+1 -1
View File
@@ -7,7 +7,7 @@
overflow: hidden;
border: 1px solid var(--color-line, #e5e7eb);
background: var(--surface-1, #fff);
margin-bottom: 12px;
margin-bottom: 0;
text-align: center;
}
.aksrt-author-card__cover {
+14 -1
View File
@@ -2,13 +2,26 @@
* Batch5: user card guest/login depth, main posts, term aggregation.
*/
/* 用户卡/作者卡:外层 .zib-widget 包裹层不再画卡片,内层 .aksrt-*-card 是唯一卡片 */
.zib-widget.widget_aksrt_user_card,
.zib-widget.widget_aksrt_author_card,
.aksrt-homepage__aside > .zib-widget.widget_aksrt_user_card,
.aksrt-homepage__aside > .zib-widget.widget_aksrt_author_card {
background: none;
border: 0;
box-shadow: none;
padding: 0;
margin-bottom: 20px;
border-radius: 0;
}
.aksrt-user-card {
border-radius: 12px;
overflow: hidden;
border: 1px solid var(--color-line, #e5e7eb);
background: var(--surface-1, #fff);
text-align: center;
margin-bottom: 12px;
margin-bottom: 0;
}
.aksrt-user-card__cover {
height: 90px;
+1 -1
View File
@@ -101,7 +101,7 @@ class WidgetAuthorCard extends \WP_Widget {
echo $args['before_title'] . esc_html($title) . $args['after_title']; // phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped
}
$card_cls = 'aksrt-author-card user-card author zib-widget' . ($show_bg ? ' has-cover' : '') . $affix['class'];
$card_cls = 'aksrt-author-card user-card author' . ($show_bg ? ' has-cover' : '') . $affix['class'];
echo '<div class="' . esc_attr($card_cls) . '"' . $affix['attr'] . '>';
if ($show_bg) {
$bg = $cover !== '' ? ' style="background-image:url(' . esc_url($cover) . ')"' : '';
+6 -3
View File
@@ -18,7 +18,10 @@ class WidgetUserCard extends \WP_Widget {
parent::__construct(
'aksrt_user_card',
__('用户卡片', 'aksrt'),
['description' => __('未登录显示登录入口;登录后显示当前用户卡片、签到、快捷按钮与更多文章。', 'aksrt')]
[
'description' => __('未登录显示登录入口;登录后显示当前用户卡片、签到、快捷按钮与更多文章。', 'aksrt'),
'classname' => 'widget_aksrt_user_card',
]
);
}
@@ -122,7 +125,7 @@ class WidgetUserCard extends \WP_Widget {
? aksrt_get_user_name(['id' => $user_id, 'follow' => !$is_self, 'class' => 'flex ac jc'])
: '<a href="' . esc_url($profile_url) . '">' . esc_html($user->display_name) . '</a>';
echo '<div class="aksrt-user-card user-card zib-widget widget">';
echo '<div class="aksrt-user-card user-card">';
if ($show_cover) {
if ($cover !== '') {
echo '<div class="aksrt-user-card__cover user-cover graphic" style="background-image:url(' . esc_url($cover) . ')"></div>';
@@ -209,7 +212,7 @@ class WidgetUserCard extends \WP_Widget {
}
}
echo '<div class="aksrt-user-card user-card zib-widget widget is-guest">';
echo '<div class="aksrt-user-card user-card is-guest">';
if ($show_cover) {
$default_cover = '';
if (class_exists('\AKSRT\Settings\Settings') && method_exists('\AKSRT\Settings\Settings', 'get_user_cover_default')) {