feat(widgets): CoverCards via aksrt_graphic_card + batch14 CSS

Rebuild cover cards on shared graphic helper with height/mask/video and row gutters; add comment/friend/iframe/cover polish styles.
2026-07-21 08:59:27 +08:00
parent 8e3b86a21b
commit 0374a08bff
2 changed files with 314 additions and 105 deletions
@@ -1702,3 +1702,126 @@
  .term-aggregation .hide-sm { display: none !important; }
  .aksrt-oneline-swiper .swiper-slide { max-width: 72%; min-width: 140px; }
 }
+
+/* ===== Batch14: recent comments mini + friend links + iframe + cover ===== */
+
+.comment-mini-lists.widget-recent-comments,
+.comment-mini-lists.zib-widget {
+  padding: 4px 0;
+}
+.comment-mini-lists .posts-mini {
+  display: flex;
+  align-items: flex-start;
+  gap: 0;
+  padding: 10px 0;
+  border-bottom: 1px solid var(--color-line, rgba(0,0,0,.06));
+}
+.comment-mini-lists .posts-mini:last-child {
+  border-bottom: 0;
+}
+.comment-mini-lists .avatar-img {
+  flex: 0 0 auto;
+  --this-size: 36px;
+}
+.comment-mini-lists .avatar-img img.avatar {
+  width: 36px;
+  height: 36px;
+  border-radius: 50%;
+  object-fit: cover;
+  display: block;
+}
+.comment-mini-lists .posts-mini-con {
+  min-width: 0;
+  flex: 1;
+}
+.comment-mini-lists .posts-mini-con > p.flex {
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  margin: 0 0 4px;
+  gap: 8px;
+}
+.comment-mini-lists .icon-spot:before {
+  content: "·";
+  margin: 0 6px;
+  opacity: .5;
+}
+.comment-mini-lists a.muted-color {
+  color: var(--muted-2-color, #666);
+  text-decoration: none;
+  display: -webkit-box;
+  -webkit-line-clamp: 3;
+  -webkit-box-orient: vertical;
+  overflow: hidden;
+  line-height: 1.5;
+}
+.comment-mini-lists a.muted-color:hover {
+  color: var(--theme-color, var(--focus-color, #f04494));
+}
+
+/* Friend links reuse bookmark-links styles */
+.aksrt-friend-links.links-box {
+  display: flex;
+  flex-wrap: wrap;
+  gap: 10px;
+}
+.aksrt-friend-links.style-simple {
+  gap: 6px 12px;
+}
+.aksrt-friend-links.style-image {
+  gap: 8px;
+}
+
+/* Iframe lazy shell */
+.wp-block-embed.is-type-video.relative-h,
+.aksrt-iframe-embed .relative-h {
+  position: relative;
+  overflow: hidden;
+  border-radius: 8px;
+  background: #0f172a;
+}
+.aksrt-iframe-ratio {
+  position: relative;
+  width: 100%;
+  height: 0;
+}
+.aksrt-iframe-ratio iframe,
+.aksrt-iframe-el {
+  position: absolute;
+  inset: 0;
+  width: 100%;
+  height: 100%;
+  border: 0;
+}
+
+/* Cover cards row already covered by term-cards col rules — scope shared */
+.widget-graphic-cover .row.gutters-5 {
+  display: flex;
+  flex-wrap: wrap;
+  margin: 0 -4px;
+}
+.widget-graphic-cover .row.gutters-5 > [class*="col-"] {
+  padding: 0 4px;
+  box-sizing: border-box;
+}
+.widget-graphic-cover .col-sm-12 { width: 100%; }
+.widget-graphic-cover .col-sm-6 { width: 50%; }
+.widget-graphic-cover .col-sm-4 { width: 33.333%; }
+.widget-graphic-cover .col-sm-3 { width: 25%; }
+.widget-graphic-cover .col-sm-2 { width: 16.666%; }
+@media (max-width: 767px) {
+  .widget-graphic-cover .col-xs-12 { width: 100%; }
+  .widget-graphic-cover .col-xs-6 { width: 50%; }
+  .widget-graphic-cover .col-xs-4 { width: 33.333%; }
+}
+.widget-graphic-cover .this-font {
+  font-size: var(--font-size, 18px);
+  font-weight: var(--font-weight, 600);
+  color: var(--color, #fff);
+}
+@media (max-width: 767px) {
+  .widget-graphic-cover .this-font {
+    font-size: var(--font-size-sm, 14px);
+    font-weight: var(--font-weight-sm, 600);
+  }
+}