重新设计用户/作者卡片小工具:消除多层卡片堆叠
- 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:
1 parent
9027446bdc
commit
0fd5848884
7 files changed
+23
-144
No files matched your search
@@ -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. 滚动触发动画初始状态
|
||||
* ============================================================ */
|
||||
|
||||
@@ -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; }
|
||||
|
||||
@@ -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 {
|
||||
|
||||
@@ -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;
|
||||
|
||||
Reference in new issue
Block a user