Merge pull request 'Worktree fix top multifunc cards' (#272) from worktree-fix-top-multifunc-cards into main

Reviewed-on: CYL/wordpress-theme-aksrt#272

assets/css/frontend/header-components.css

@@ -4,3 +4,71 @@
 @import url("header-components/dark-theme.css");
 @import url("header-components/card-device-visibility.css");
 @import url("header-components/search-keywords-row.css");
+
+/* === homepage icon-card seams (must not rely solely on @import cache) === */
+.header-slider-card .flex,
+.header-components-card .flex { display: flex; }
+.header-slider-card .flex.jse,
+.header-components-card .flex.jse,
+.header-slider-card .jse,
+.header-components-card .jse { justify-content: space-evenly; }
+.header-slider-card .flex-row,
+.header-components-card .flex-row { flex-direction: row; }
+.header-slider-card .flex.ac,
+.header-components-card .flex.ac,
+.header-slider-card .ac,
+.header-components-card .ac { align-items: center; }
+.header-slider-card .gutters-5,
+.header-components-card .gutters-5,
+.header-slider-card .flex.jse.flex-row,
+.header-components-card .flex.jse.flex-row {
+  margin: -5px;
+}
+.header-slider-card .gutters-5 > *,
+.header-components-card .gutters-5 > *,
+.header-slider-card .flex.jse.flex-row > *,
+.header-components-card .flex.jse.flex-row > * {
+  padding: 5px !important;
+  box-sizing: border-box;
+}
+.header-slider-card .flex1,
+.header-components-card .flex1,
+.header-slider-card .flex .flex1,
+.header-components-card .flex .flex1 {
+  flex: 1 1 0;
+  overflow: hidden;
+  min-width: 0;
+}
+.header-slider-card,
+.header-components-card {
+  position: relative;
+  margin-top: -40px;
+  z-index: 1;
+  width: 100%;
+}
+.header-slider-card.container,
+.header-components-card.container {
+  width: 100%;
+  max-width: var(--container, var(--mian-max-width, 1200px));
+  margin-left: auto;
+  margin-right: auto;
+  padding-left: 15px;
+  padding-right: 15px;
+  box-sizing: border-box;
+}
+.header-slider-card .icon-cover-card.zib-widget,
+.header-components-card .icon-cover-card.zib-widget {
+  margin-bottom: 0;
+  padding: var(--card-padding, 15px);
+  box-shadow: 0 0 10px var(--main-shadow, var(--shadow-sm, rgba(116, 116, 116, 0.08)));
+  border-radius: var(--main-radius, var(--radius, 8px));
+  background-color: var(--main-bg-color, var(--surface-1, #fff));
+  height: 100%;
+  box-sizing: border-box;
+}
+.filter-blur .header-slider-card .zib-widget,
+.filter-blur .header-components-card .zib-widget {
+  -webkit-backdrop-filter: saturate(5) blur(20px);
+  backdrop-filter: saturate(5) blur(20px);
+  background: var(--blur-bg, rgba(255, 255, 255, 0.75));
+}

assets/css/frontend/header-components/dark-theme.css

@@ -16,7 +16,64 @@ body.dark-theme .header-components-search__input {
  * DOM: .header-slider-card.container > (.zib-widget.padding-10|div)
  *        > .flex.jse.flex-row.gutters-5.flex-col-sm-2
  *          > (.flex1|.relative-h) > [.main-color >] .icon-cover-card.flex.ac.(zib-widget|padding-10)
+ *
+ * IMPORTANT: gutters/flex helpers must live here (not only zibll-utilities.css).
+ * zibll-utilities was single-post-only, so homepage cards stuck together while
+ * other pages that load utilities showed 10px gaps — exact user screenshot bug.
  * ============================================================ */
+
+/* Self-contained zibll flex + gutters for header cards (page-type independent) */
+.header-slider-card .flex,
+.header-components-card .flex {
+    display: flex;
+}
+.header-slider-card .flex.jse,
+.header-components-card .flex.jse,
+.header-slider-card .jse,
+.header-components-card .jse {
+    justify-content: space-evenly;
+}
+.header-slider-card .flex-row,
+.header-components-card .flex-row {
+    flex-direction: row;
+}
+.header-slider-card .flex.ac,
+.header-components-card .flex.ac,
+.header-slider-card .ac,
+.header-components-card .ac {
+    align-items: center;
+}
+/* zibll: .gutters-5 { margin:-5px } > * { padding:5px } → 10px visual gap.
+ * Use both gutters model AND flex gap so homepage (which used to miss
+ * zibll-utilities) and any future cascade zero-padding still show seams. */
+.header-slider-card .gutters-5,
+.header-components-card .gutters-5,
+.header-slider-card .flex.jse.flex-row,
+.header-components-card .flex.jse.flex-row {
+    margin: -5px;
+    gap: 0; /* spacing comes from child padding to match zibll exactly */
+}
+.header-slider-card .gutters-5 > *,
+.header-components-card .gutters-5 > *,
+.header-slider-card .flex.jse.flex-row > *,
+.header-components-card .flex.jse.flex-row > * {
+    padding: 5px !important;
+    box-sizing: border-box;
+}
+.header-slider-card .flex1,
+.header-components-card .flex1,
+.header-slider-card .flex .flex1,
+.header-components-card .flex .flex1 {
+    flex: 1 1 0;
+    overflow: hidden;
+    min-width: 0;
+}
+.header-slider-card .relative-h,
+.header-components-card .relative-h {
+    position: relative;
+    height: 100%;
+}
+
 .header-slider-card,
 .header-components-card {
     position: relative;

src/AKSRT/Core/ScriptsPart1b.php

@@ -72,11 +72,12 @@ trait ScriptsPart1b {
 
         $deps = [$core_dep];
         $enqueue_module = function ($slug) use ($base_uri, $version, $deps) {
+            $path = get_template_directory() . '/assets/css/frontend/' . $slug . '.css';
             wp_enqueue_style(
                 'aksrt-' . $slug,
                 $base_uri . '/assets/css/frontend/' . $slug . '.css',
                 $deps,
-                $version
+                (file_exists($path) ? (string) filemtime($path) : $version)
             );
         };
 
@@ -274,6 +275,16 @@ $hmb_js = get_template_directory() . '/assets/js/header-newadd.js';
 
         // 顶部多功能组件：按 page-type 启用结果入队（对齐 zibll，不绑死首页）
         if (function_exists('aksrt_header_slide_is_show') && aksrt_header_slide_is_show()) {
+            // flex/gutters used by icon cards (same helpers single-post loads via zibll-utilities)
+            $zu_path = get_template_directory() . '/assets/css/frontend/zibll-utilities.css';
+            if (file_exists($zu_path)) {
+                wp_enqueue_style(
+                    'aksrt-zibll-utilities',
+                    $base_uri . '/assets/css/frontend/zibll-utilities.css',
+                    is_string($deps[0] ?? null) ? [$deps[0]] : (array) $deps,
+                    filemtime($zu_path) ?: $version
+                );
+            }
             $enqueue_module('header-components');
         }