fix(header): restore the payvip surface on the top-nav VIP chip
The 开通会员 chip rendered in the .jb-red orange gradient instead of the legacy metallic .payvip-icon gradient. The markup always carried payvip-icon, but core/buttons.css restates the legacy .but block and is bundled into public.css, which loads after main.css. Same specificity, later in the cascade, so its background / color / border / text-shadow declarations outrank .payvip-icon and replace the payvip surface with whatever .jb-* skin happens to be on the element. The reference theme has no such compatibility layer, so there its .payvip-icon declarations are the last word and the chip shows the metallic gradient with #ece0e0 text, no border and no text shadow. A previous fix restored the surface only for the user-card CTA, scoped to .aksrt-header-userbox .pay-vip.but.payvip-icon, which left the top-nav chip (and the guest CTA, and the user-card status bar) on the wrong gradient. Re-assert the legacy .payvip-icon declarations unscoped in header-userbox.css, which loads after core/buttons.css, and complete the property set with border: none and text-shadow: none so the chip no longer carries the 1px transparent border the .but block adds. Verified with a cascade resolver that replays the real stylesheet load order (bootstrap, main, public, header-userbox) against the reference theme's own order: background, color, --this-color, border, text-shadow, border-radius, padding, margin, font-size, display, overflow and position now resolve identically for both the publish and the VIP chip.
This commit is contained in:
1 parent
0722c4f00e
commit
5810693e01
5 files changed
+30
-6
No files matched your search
@@ -143,6 +143,9 @@ test('header VIP hover cards match the legacy markup and style contract', () =>
|
||||
assert.match(headerMenuButtons, /<span class="hover-show inline-block">/)
|
||||
assert.match(headerMenuButtons, /<div class="sub-menu hover-show-con sub-vip-card">/)
|
||||
assert.match(headerMenuButtons, /'<a class="' \. esc_attr\(\$cls\) \. ' but jb-red radius payvip-icon ml10" href="javascript:;">'/)
|
||||
// The payvip surface must survive the .but compatibility layer for the top-nav
|
||||
// chip too, not just the user-card CTA.
|
||||
assert.match(headerCss, /\.payvip-icon\s*\{[\s\S]*?background:\s*linear-gradient\(300deg,[\s\S]*?--this-color:\s*#ece0e0;/s)
|
||||
assert.match(headerMenuButtons, /<svg class="em12 mr3" aria-hidden="true"><use xlink:href="#icon-vip_1"><\/use><\/svg>'/)
|
||||
assert.match(headerMenuButtons, /'<a rel="nofollow" class="newadd-btns ' \. esc_attr\(\$class\) \. ' btn-newadd"/)
|
||||
assert.equal((headerMenuButtons.match(/Settings::close_sign\(\)/g) || []).length, 2)
|
||||
|
||||
Reference in new issue
Block a user