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>
Loading indication now matches the reference theme's post_ajax() contract:
- Stop overwriting the 加载更多 button label with 正在加载...; the button
keeps its own text and the .post_ajax_loader skeleton carries the busy
state instead.
- Add the reference fallback loader (.loading ring + 加载中...) when no
skeleton exists in the DOM, and reinsert the skeleton after the last
card on every page load like beforeSend does.
- Retext the loader string to 加载中... (zib__('loading')) and make the
ajax_trigger default a translatable string.
- Route ajax-list.js / comments.js / widgets frontend.js through the
.is-loading class instead of inline display, which outranked the class
rule and could freeze the skeleton shut.
- Drop the search.php inline display:none that defeated .is-loading, and
remove the unproduced .post-ajax-loader / [data-aksrt-ajax-loader] shims.
Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
Clicking 加载更多 showed no skeleton at all, and the placeholder shape did
not match the reference theme's post cards.
- Class-name mismatch: pagination.js queried .post-ajax-loader while every
PHP producer emits .post_ajax_loader, so showSkeleton() never found a
target and the loader stayed hidden. Accept both spellings.
- Inline display:none on the loader (pagination, comments, widget tab
panes) outranked .is-loading, so even the correct selector could not
reveal it. Drop the inline style; the reference uses a bare
<div class="post_ajax_loader"> and toggles visibility from JS.
- loadNextPage() set indicator.style.display = "flex", which forced the
.posts-item.card skeleton blocks (inline-block layout) into a single
row instead of stacking vertically — the visible symptom. Remove those
inline writes and drive .is-loading from CSS for every surface.
- Scope the hide/show rules on the class itself rather than requiring an
.ajaxpager ancestor: homepage tab panes, archive streams and comment
lists sit at three different depths.
- Rebuild aksrt_render_placeholder() on zib_get_post_placeholder's
structure — list = t1/k1/k2 + two s1, card = t1 item-heading/k2 + two
s1, thumb wrapped in post-graphic + radius8 item-thumbnail, all carrying
ajax-item so the loader is not mistaken for a real card.
- Add mini/mini_thumb modes so ContentRenderer::placeholder() stops
hand-rolling the same markup; normalize its 'lists' arg to 'list'.
Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
The action bar used a locally invented pill-chip style that overrode the
reference theme's 80px icon-over-text columns, and the JS toggled a
class no stylesheet targeted — so likes/favorites showed no selected
state at all.
- restore reference markup: <svg class="icon"> + <text>/<count> and the
actived class, with data-stat-count/data-base-count preserved
- toggle actived plus a transient action-animation so the lovestar
keyframes finally reach the DOM
- drop the CSS overrides and now-dead action-btn/.action-btn--reward
and .post-actions-card rules; main.css already carried the reference
rules the overrides were shadowing
1:1 replicate the reference theme user-ban flow on the frontend:
- Ban/unban modal rendered by inc/helpers/user-ban.php, opened via
AksrtModalRuntime.openRemote (600px desktop dialog, 360px initial
height, mobile bottom drawer, c-yellow colorful unban header).
- Three entry points wired: user homepage cover three-dot menu,
comment section menu, article author card menu (ban item takes
priority over report, matching the reference hook order).
- REST endpoints /user-ban/modal and /user-ban/set under aksrt/v1,
guarded by check_permission, persisted through User\Restriction.
- Submit semantics match zib_ajax_set_user_ban: ban reloads the page,
unban only closes the modal.
Cleanup (no dual-track): the backend ban-restrictions tab, its form
handlers and flash keys are removed; ticket processing links to the
frontend user homepage as the reference theme does; admin/report and
appeal notification URLs move to type/status query args.
Verification: 337/337 widget-system contract tests, 41/41 admin and
front-submit tests, php -l clean on all changed PHP files.
main.css already ships the reference plus icon (.preview .add:before/:after,
25px rounded bars centered via inset:0 + margin:auto). The duplicate
left/top:50% + translate version in modal-runtime.css over-constrained
the same pseudo elements (right/bottom:0 + margin:auto from main.css
still applied), pushing the bars to 75%/75% so only an L-shaped corner
was visible. Drop the duplicate and lock the single-source contract in
the report test.
- read preset reasons from the real source (ban_preset_reason via
UserRuntime::ban_settings); the previous injection read a
nonexistent report.categories key, so backend reasons never showed
- rebuild the modal on the reference markup contract: edit-header
warning header, reason chips toggling the reference .active class
(focus color), other-reason textarea, violation link, description,
but-average modal-buts footer
- add image evidence upload gated by user_report_img_s: new
/report/upload-image route reusing the comment upload handler with
its own permission, preview/remove UI, up to 3 images appended to
the report content
- render the backend report notice (user_report_desc, sanitized HTML)
inside the modal
- widen the dialog to the reference 600px desktop geometry and share
the form-upload preview styles with the order review modal
- extend the report contract test accordingly
The global .container is padding-free at >=992px (1200px dual-column
geometry), but the header slider card container re-added 15px side
padding, visibly insetting the icon cards ~15px per side relative to
the main content below. Zibll keeps header and content boxes equal by
sharing one container model; drop the local gutter so AKSRT does the
same. Mobile keeps its 15px via the <=991.98px media rule.
The reference theme renders header slider icon cards on the bootstrap
14px body baseline (title .em12 -> 16.8px, desc 14px). A local
.header-slider-card .icon-cover-card { font-size: 12px } override shrank
text to 14.4/12px, making AKSRT cards visibly smaller than the reference.
Remove the pin from base.css and the public bundle; container gutter
restoration stays.
Trigger classes are applied to the fixed shell; .modal-mini's
width:400px + auto margins collapsed the shell (and its backdrop)
into a centered column. Neutralize dialog-only width classes on the
shell so the fullscreen backdrop covers the viewport again.
The reference modal backdrop is a fullscreen, non-transparent black
50% overlay; drop the mistaken transparent-overlay override for the
checkin shell and keep the shared runtime backdrop.
Reference site keeps the page fully visible while the checkin modal
is open; make the shell overlay transparent (still closes on click
outside) and rebuild public bundles.
- Rebuild checkin details modal HTML 1:1 with reference theme:
colorful header c-blue, user card (points/level), daily reward
card and 7-day continuous mini cards
- Signed entry buttons (header dropdown, user-card badge, user
center) become clickable checkin-details-link modal triggers
instead of disabled buttons
- Swap data-signin-btn to details link in place after successful
signin (reference .initiate-checkin replacement behavior)
- Add aksrt-checkin-details-modal runtime shell (modal-mini 400px)
- Remove dead code: legacy lite modal, admin-ajax details handler,
/signin/history route, signin calendar; rebuild public bundles
- Update contract tests to the new checkin modal contract
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.
Drop the gray is-done/disabled overrides on the header checkin chip
(light and dark); the reference keeps the same colored badge after
signing. Card badge itself already renders white on the jb-yellow
gradient (verified in browser with the full stylesheet chain).
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
The image-mode cover reserves +50px for the title/breadcrumb overlay
(calc(scale% + 50px)), but the slide cover wrapper was given a bare
inline padding-bottom by aksrt_render_slider, permanently defeating the
.cover-slide rule, and the video cover used a bare video_scale%.
- aksrt_render_slider: add scale_extra so scale mode emits
calc(ratio% + extra); the single cover passes 50px so all three
modes share one height formula
- drop the unreachable static slide fallback and function_exists guard
(the helper is unconditionally loaded by inc/bootstrap.php), the
always-true cover_url/ep_count conditions, and the dead --scale-ratio
and inner swiper padding emitted in scale mode
- remove the dead cover CSS cluster with no producer: .single-cover-slide
(main.css/main.min.css/cover.css), .single-cover-slider family
(components/base.css), .single-cover-slide-wrap and .single-cover__*
helpers (cover.css), and initSlideCovers in misc.js
- rebuild public bundles via tools/build-public-assets.mjs
- add single-cover-height-contract test covering the shared formula
and the dead-code removals
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
kate522
