feat(widgets): category recommend/tabs residual + batch22-24 CSS

Use graphic_card heroes and mini post strips for category recommend,
prefer shared mini list in category block sidebar fallback, admin empty
for product tabs, and forum/user residual styles.
This commit is contained in:
2026-07-21 10:39:17 +08:00
parent 8b5ca8f287
commit 4368a3c586
5 changed files with 184 additions and 67 deletions
+83
View File
@@ -2296,3 +2296,86 @@ a.main-color > .icon-cover-card:hover,
}
.tag-cloud.aksrt-tag-cloud a { transition: transform .15s ease; }
.tag-cloud.aksrt-tag-cloud a:hover { transform: translateY(-1px); }
/* batch22-24 forum/user residual */
.forum-posts.mini.aksrt-ftopic-mini,
.forum-posts.detail.aksrt-ftopic-detail {
display: block;
position: relative;
padding: 12px 0;
border-bottom: 1px solid var(--color-line-soft, #f0f1f3);
}
.forum-posts.mini.aksrt-ftopic-mini:last-child,
.forum-posts.detail.aksrt-ftopic-detail:last-child { border-bottom: 0; }
.forum-posts .forum-posts-header .avatar-img img,
.forum-posts .avatar-img img {
width: 28px; height: 28px; border-radius: 50%; object-fit: cover; display: block;
}
.forum-posts.detail .avatar-img img { width: 40px; height: 40px; }
.forum-posts .forum-title { margin: 0; font-size: 14px; font-weight: 600; line-height: 1.4; }
.forum-posts .forum-title a { color: inherit; text-decoration: none; }
.forum-posts .forum-title a:hover { color: var(--theme-color, #f04494); }
.forum-posts .item-meta { gap: 2px; }
.forum-posts .forum-excerpt { line-height: 1.5; }
.forum-posts badge.img-badge { z-index: 2; }
.plate-lists .plate-item,
.aksrt-plate-lists .plate-item {
display: flex;
gap: 12px;
align-items: flex-start;
padding: 10px 0;
border-bottom: 1px solid var(--color-line-soft, #f0f1f3);
color: inherit;
text-decoration: none;
}
.plate-lists .plate-item:last-child { border-bottom: 0; }
.plate-thumb,
.aksrt-plate-item__thumb {
width: 48px; height: 48px; border-radius: 10px; overflow: hidden;
flex: 0 0 auto; display: inline-flex; align-items: center; justify-content: center;
background: var(--surface-2, #f3f4f6); color: #999;
}
.plate-thumb img, .aksrt-plate-item__thumb img { width: 100%; height: 100%; object-fit: cover; display: block; }
.panel-plate.scroll-plate,
.aksrt-plate-cards {
display: flex; gap: 12px; overflow-x: auto; padding-bottom: 4px; scrollbar-width: thin;
}
.plate-card, .aksrt-plate-card {
flex: 0 0 160px; width: 160px; text-decoration: none; color: inherit;
}
.plate-card .plate-thumb, .aksrt-plate-card__cover {
width: 100%; aspect-ratio: 1; border-radius: 12px; overflow: hidden;
background: var(--surface-2, #f3f4f6); display: flex; align-items: center; justify-content: center;
}
.plate-card .plate-thumb img, .aksrt-plate-card__cover img { width: 100%; height: 100%; object-fit: cover; }
.moderator-box.aksrt-plate-mods__list,
.aksrt-plate-mods__list { display: flex; flex-direction: column; gap: 12px; }
.aksrt-plate-mods.style-grid .aksrt-plate-mods__list {
display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 12px;
}
.aksrt-plate-mods__item { gap: 4px; }
.aksrt-plate-mods__avatar { width: 40px; height: 40px; border-radius: 50%; object-fit: cover; display: block; }
.aksrt-plate-mods.style-grid .aksrt-plate-mods__item { text-align: center; }
.aksrt-plate-mods.style-grid .aksrt-plate-mods__avatar { width: 48px; height: 48px; margin: 0 auto 6px; }
.user-ranking-box .user-ranking-item,
.aksrt-user-ranking-box .user-ranking-item { position: relative; }
.user-ranking-item .avatar-img img { width: 36px; height: 36px; border-radius: 50%; object-fit: cover; display: block; }
.user-ranking-item .badg { white-space: nowrap; }
.aksrt-category-recommend__card[data-aksrt-animate] { will-change: transform, opacity; }
.aksrt-category-recommend__posts.posts-mini-wrap { margin-top: 8px; }
.aksrt-plate-info.plate-info-sidebar { overflow: hidden; }
.aksrt-plate-info__cover.plate-thumb {
width: 100%; height: 110px; border-radius: 12px; overflow: hidden;
background: var(--surface-2, #f3f4f6); display: flex; align-items: center; justify-content: center;
}
.aksrt-plate-info__cover.plate-thumb img { width: 100%; height: 100%; object-fit: cover; display: block; }
.aksrt-plate-info__stats.count-mates { gap: 8px; flex-wrap: wrap; }
.aksrt-ftag-list { display: flex; flex-wrap: wrap; gap: 8px; }
.aksrt-ftag-item.is-card { min-width: 120px; justify-content: space-between; }