Clicking 加载更多 in the 多栏目文章 widget showed no skeleton at all — the
list simply stayed still until the response arrived, then the new cards
appeared. The homepage stream, archives and comments already had a working
skeleton; the widget's AJAX load goes through a different client and never
found its loader.
Root cause was DOM placement, not visibility: ContentRenderer emitted
.post_ajax_loader as a *sibling* of .widget-ajaxpager, while the widget REST
client resolves it with container.querySelector('.post_ajax_loader'). The
node existed but could never match, so .is-loading was never added and the
skeleton stayed display:none. Inactive tab panes had the same shape, and the
direct-load branch of ajaxpager() emitted no loader at all.
Changes, all following the reference theme's post_ajax() contract in
zibll/js/main.js (beforeSend anchors the loader to the end of the list;
success only hides it, never removes it):
- ContentRenderer: nest the loader inside .widget-ajaxpager for both the
direct-load and inactive-tab branches, and drop the sibling append.
- widgets/frontend.js: anchorLoader() moves the loader to the end of the
list before .ajax-pag on every request; appended cards are inserted before
it; a replace preserves the node instead of wiping it with innerHTML; a
fallback loader is created when the DOM has none; loadItems() now returns
its promise; drop the unreachable is-loading auto-load branch.
- Message centre, user-home panels and the search page switch from spinner /
opacity feedback to the same .posts-item-shaped skeleton, so all AJAX
surfaces share one loading contract.
- Remove the second, never-wired skeleton system (.aksrt-skeleton-* in
core-ui.css) and the dead spinner stylesheets/rules (skeleton.css,
ajax-spinner.css, .load-more__*, --skeleton-base/--skeleton-shine) plus the
unregistered assets/js/waterfall.js.
- Extend the widget, message-centre, user-home and asset-ledger contract
tests to pin the loader inside the container, the class-only visibility
switch, and the absence of the deleted dead code.
Verified: 470 node tests, 136 PHP widget assertions, admin-contract and
widget-system audits all green; rebuilt public assets after the CSS/JS
removals.
Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
Set --text-base to 0.875rem to match the reference bootstrap body
metrics; em-based reference components (.img-badge, em utilities) now
render at reference scale site-wide. Compensate .btn-lg with
--text-md (18px, bootstrap btn-lg) to keep the size hierarchy. Simplify
the user-card badge rule to the line-height pin only.
Slide-mode images rendered at intrinsic ratio, top-aligned inside the
swiper chain (--pc-height:auto left .swiper-wrapper content-sized), so
the taller box showed a gap at the bottom and never center-cropped like
the image cover. The video cover had the same problem through
video-player.js (height:auto, capped at 70vh).
- aksrt_render_slider scale mode emits --pc-height/--m-height 100% so
the wrapper/slide/img chain fills the ratio box and object-fit: cover
center-crops inside it (same pattern as the .scale-height widgets)
- video-player.js renders the video at height:100% + object-fit:cover;
with an undimensioned container height:100% degrades to auto,
matching the previous behavior
- drop the dead .single-cover padding-bottom rules (every producer owns
its height inline, and the rule squeezed the absolutely positioned
slide inner) and the orphaned --single-cover-scale var in
tokens.css/compat-vars.css/main.css/InlineStyleBuilder
- rebuild public bundles; extend the single-cover-height contract
Reference contract: widget cards carry their own 15px padding and
.widget-content is bare. The added 20px padding inset every widget
card from the content max width on the fixed homepage (the only
bundle loading sidebar.css).
- drop the root padding rule and the unreferenced --flush modifier
- drop the now-redundant user-widget padding:0 workaround
- drop the dead --card-padding-lg token
- lock the contract with negative assertions in the display test
.aksrt-wave was injected into .but without position:absolute, so the
oversized span expanded header publish/VIP buttons on click. Make the
wave absolute, honor .nowave, and skip navbar CTA roots.
Center FA icons in toggle-radius/btn chips, restore menu-item title flex baseline, and match CTA/logo vertical alignment so top bar text and icons no longer drift.
kate522andClaude Fable 5