feat(nav): close P0/P1 parity gaps (nav style, history, plate, admin build)
Wire header_nav_style transparent/blur, login history sync, plate publish type, clean dead search CSS, rebuild admin SPA locally (build gitignored).
This commit is contained in:
1 parent
1d1fef50af
commit
0d9db942f8
13 files changed
+181
-85
No files matched your search
@@ -138,11 +138,13 @@ export const pageDisplaySchemas = {
|
||||
{ label: '文章', value: 'post' },
|
||||
{ label: '帖子', value: 'topic' },
|
||||
{ label: '商品', value: 'product' },
|
||||
{ label: '版块', value: 'plate' },
|
||||
], dependsOn: { key: 'header_newposts_enabled', value: true }, help: '未开启的模块不会显示' },
|
||||
{ key: 'header_user_newposts_btn', label: '用户卡发布类型', type: 'select', default: 'post', options: [
|
||||
{ label: '文章', value: 'post' },
|
||||
{ label: '帖子', value: 'topic' },
|
||||
{ label: '商品', value: 'product' },
|
||||
{ label: '版块', value: 'plate' },
|
||||
] },
|
||||
{ key: 'header_user_newposts_text', label: '用户卡发布文案', type: 'input', default: '发布内容' },
|
||||
{ key: 'header_nav_pay_vip', label: '导航栏开通会员按钮', type: 'switch', default: true, help: '顶部导航显示开通会员' },
|
||||
|
||||
@@ -4,6 +4,7 @@
|
||||
@import url("nav/zib-senior-submenu.css");
|
||||
@import url("nav/zib-utilities.css");
|
||||
@import url("nav/zib-search-box.css");
|
||||
@import url("nav/zib-nav-style.css");
|
||||
@import url("nav/header-menu-buttons.css");
|
||||
@import url("nav/header-userbox.css");
|
||||
@import url("nav/dark-mode-submenu.css");
|
||||
@import url("nav/dark-mode-submenu.css");
|
||||
@@ -0,0 +1,39 @@
|
||||
/* Header nav style: transparent / blur (header_nav_style) */
|
||||
|
||||
body.header-nav-style-transparent .header:not(.show-slide) .navbar-top,
|
||||
body.header-nav-style-transparent .header.nav-style-transparent .navbar-top {
|
||||
background: transparent !important;
|
||||
box-shadow: none !important;
|
||||
}
|
||||
|
||||
body.header-nav-style-blur .header:not(.show-slide) .navbar-top,
|
||||
body.header-nav-style-blur .header.nav-style-blur .navbar-top,
|
||||
.header.nav-style-blur .navbar-top {
|
||||
background: var(--blur-bg, rgba(255, 255, 255, 0.72)) !important;
|
||||
-webkit-backdrop-filter: saturate(5) blur(16px);
|
||||
backdrop-filter: saturate(5) blur(16px);
|
||||
box-shadow: 0 1px 0 rgba(0, 0, 0, 0.04);
|
||||
}
|
||||
|
||||
body.theme-dark.header-nav-style-blur .header:not(.show-slide) .navbar-top,
|
||||
html.dark body.header-nav-style-blur .header:not(.show-slide) .navbar-top,
|
||||
body.dark-theme.header-nav-style-blur .header:not(.show-slide) .navbar-top {
|
||||
background: var(--blur-bg, rgba(20, 22, 28, 0.72)) !important;
|
||||
}
|
||||
|
||||
/* When show-slide + fixed, keep zibll transparent gradient (already in core).
|
||||
Transparent style reinforces that paint while resting at top of hero. */
|
||||
body.nav-fixed.header-nav-style-transparent:not(.body-scroll):not(.mobile-navbar-show) .header.show-slide,
|
||||
body.nav-fixed.header-nav-style-blur:not(.body-scroll):not(.mobile-navbar-show) .header.show-slide {
|
||||
--header-bg: linear-gradient(0, rgba(0, 0, 0, 0) 5%, rgba(0, 0, 0, 0.12) 80%);
|
||||
--header-color: #fff;
|
||||
}
|
||||
|
||||
body.header-nav-style-transparent .header.show-slide .navbar-top,
|
||||
body.header-nav-style-blur .header.show-slide .navbar-top {
|
||||
background: transparent !important;
|
||||
-webkit-backdrop-filter: unset;
|
||||
backdrop-filter: unset;
|
||||
box-shadow: none !important;
|
||||
color: var(--header-color, inherit);
|
||||
}
|
||||
@@ -92,9 +92,8 @@
|
||||
display: none;
|
||||
}
|
||||
|
||||
/* Full navbar-search slide (layout 1/3) */
|
||||
/* Full navbar-search slide (layout 1/3) — position/transition from zib-navbar-core */
|
||||
.navbar-search {
|
||||
position: fixed;
|
||||
left: 0;
|
||||
right: 0;
|
||||
top: 0;
|
||||
|
||||
@@ -163,71 +163,6 @@ body.mobile-navbar-show { overflow: hidden; }
|
||||
.aksrt-sme-field span { display: block; font-size: 12px; color: #646970; }
|
||||
.aksrt-sme-card, .aksrt-sme-col { border: 1px solid #dcdcde; padding: 8px; margin: 8px 0; border-radius: 4px; }
|
||||
|
||||
/* Layout-2 remote menu search panel (zibll menu_search) */
|
||||
.aksrt-remote-box[data-aksrt-menu-search-remote] {
|
||||
min-height: 8px;
|
||||
}
|
||||
.navbar-inline-search-panel {
|
||||
min-width: 300px;
|
||||
max-width: 380px;
|
||||
max-height: 70vh;
|
||||
overflow: auto;
|
||||
}
|
||||
.aksrt-menu-search-posts__item {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 2px;
|
||||
padding: 6px 2px;
|
||||
color: inherit;
|
||||
text-decoration: none;
|
||||
border-bottom: 1px solid rgba(0,0,0,.04);
|
||||
}
|
||||
.aksrt-menu-search-posts__item:last-child { border-bottom: 0; }
|
||||
.aksrt-menu-search-posts__item:hover { color: var(--focus-color); }
|
||||
.aksrt-menu-search-history__list .but,
|
||||
.navbar-inline-search-hots .but { margin: 0 4px 4px 0; }
|
||||
.loading-spot {
|
||||
display: inline-block;
|
||||
width: 1em;
|
||||
height: 1em;
|
||||
margin: 8px;
|
||||
border: 2px solid rgba(0,0,0,.15);
|
||||
border-top-color: var(--focus-color, #f04494);
|
||||
border-radius: 50%;
|
||||
animation: aksrt-spin .7s linear infinite;
|
||||
}
|
||||
@keyframes aksrt-spin { to { transform: rotate(360deg); } }
|
||||
.navbar-but .radius,
|
||||
.navbar-but .but.radius,
|
||||
.navbar-cta.radius {
|
||||
border-radius: 999px !important;
|
||||
}
|
||||
|
||||
/* Active menu underline (zibll-like) */
|
||||
.navbar-top .nav > li.current-menu-item > a,
|
||||
.navbar-top .nav > li.current-menu-ancestor > a {
|
||||
color: var(--focus-color);
|
||||
}
|
||||
.navbar-top .nav > li.current-menu-item > a::before,
|
||||
.navbar-top .nav > li.current-menu-ancestor > a::before {
|
||||
content: "";
|
||||
position: absolute;
|
||||
left: 10px;
|
||||
right: 10px;
|
||||
top: 0;
|
||||
height: 3px;
|
||||
border-radius: 0 0 3px 3px;
|
||||
background: var(--focus-color);
|
||||
}
|
||||
.navbar-top .nav > li > a { position: relative; }
|
||||
|
||||
/* Type chips in menu search */
|
||||
.aksrt-menu-search-types .but { margin: 0 4px; }
|
||||
.aksrt-menu-search-types .but.active {
|
||||
--this-bg: var(--focus-color-opacity1, rgba(240,68,148,.12));
|
||||
--this-color: var(--focus-color);
|
||||
color: var(--focus-color);
|
||||
}
|
||||
/* Navbar form vertical align */
|
||||
.navbar-top .navbar-form {
|
||||
margin: 0;
|
||||
@@ -266,3 +201,11 @@ body.mobile-navbar-show { overflow: hidden; }
|
||||
@media (min-width: 992px) {
|
||||
.navbar-top .show-nav-but { display: none !important; }
|
||||
}
|
||||
|
||||
/* focus-show: reveal sibling dropdown when input focused (zibll) */
|
||||
.form-group:focus-within .dropdown-menu.hover-show-con,
|
||||
.hover-show:focus-within .hover-show-con {
|
||||
visibility: unset;
|
||||
opacity: 1;
|
||||
transform: translateY(0);
|
||||
}
|
||||
@@ -41,6 +41,34 @@
|
||||
} catch (e) {}
|
||||
}
|
||||
|
||||
|
||||
function saveLoggedHistory(keyword, type) {
|
||||
if (!(window.aksrtData && aksrtData.isLoggedIn) || !ajaxUrl() || !keyword) return;
|
||||
var items = readLocalHistory().filter(function (k) { return k !== keyword; });
|
||||
items.unshift(keyword);
|
||||
items = items.slice(0, 20);
|
||||
// Also update local cache for panel paint consistency.
|
||||
writeLocalHistory(items);
|
||||
var payload =
|
||||
"action=aksrt_search_history&nonce=" +
|
||||
encodeURIComponent(nonce()) +
|
||||
"&mode=save&items=" +
|
||||
encodeURIComponent(
|
||||
JSON.stringify(
|
||||
items.map(function (k) {
|
||||
return { keyword: k, type: type || "post" };
|
||||
})
|
||||
)
|
||||
);
|
||||
try {
|
||||
var xhr = new XMLHttpRequest();
|
||||
xhr.open("POST", ajaxUrl(), true);
|
||||
xhr.setRequestHeader("Content-Type", "application/x-www-form-urlencoded; charset=UTF-8");
|
||||
xhr.send(payload);
|
||||
} catch (e) {}
|
||||
}
|
||||
|
||||
|
||||
function keywordChips(list) {
|
||||
return (list || [])
|
||||
.map(function (kw) {
|
||||
@@ -232,7 +260,9 @@
|
||||
form.addEventListener("submit", function () {
|
||||
var q = (input.value || "").trim();
|
||||
if (!q) return;
|
||||
if (!(window.aksrtData && aksrtData.isLoggedIn)) {
|
||||
if (window.aksrtData && aksrtData.isLoggedIn) {
|
||||
saveLoggedHistory(q, typeValue());
|
||||
} else {
|
||||
var list = readLocalHistory().filter(function (k) {
|
||||
return k !== q;
|
||||
});
|
||||
@@ -297,8 +327,33 @@
|
||||
});
|
||||
}
|
||||
|
||||
|
||||
function bindFullSearchBoxHistory() {
|
||||
document.querySelectorAll('form[data-aksrt-search-form="box"]').forEach(function (form) {
|
||||
if (form._aksrtHistBound) return;
|
||||
form._aksrtHistBound = 1;
|
||||
form.addEventListener("submit", function () {
|
||||
var input = form.querySelector('input[name="s"]');
|
||||
var q = input ? (input.value || "").trim() : "";
|
||||
if (!q) return;
|
||||
var typeInput = form.querySelector('input[name="aksrt_search_type"], input[name="type"]');
|
||||
var type = (typeInput && typeInput.value) || "post";
|
||||
if (window.aksrtData && aksrtData.isLoggedIn) {
|
||||
saveLoggedHistory(q, type);
|
||||
} else {
|
||||
var list = readLocalHistory().filter(function (k) {
|
||||
return k !== q;
|
||||
});
|
||||
list.unshift(q);
|
||||
writeLocalHistory(list);
|
||||
}
|
||||
});
|
||||
});
|
||||
}
|
||||
|
||||
function init() {
|
||||
bindRemoteBoxes(document);
|
||||
bindFullSearchBoxHistory();
|
||||
bindNavbarSearchSlide();
|
||||
var form = document.querySelector('form[data-aksrt-search-form="inline"]');
|
||||
if (form) enhancePanel(form);
|
||||
|
||||
@@ -45,7 +45,7 @@
|
||||
openMenu.classList.remove('is-open');
|
||||
openMenu.setAttribute('hidden', '');
|
||||
openMenu.setAttribute('aria-hidden', 'true');
|
||||
if (openToggle) openToggle.setAttribute('aria-expanded', 'false');
|
||||
if (openToggle && openToggle.setAttribute) openToggle.setAttribute('aria-expanded', 'false');
|
||||
if (openRoot) openRoot.classList.remove('is-open');
|
||||
// Return menu to original root so SSR structure stays consistent.
|
||||
if (openRoot && openMenu.parentNode !== openRoot) {
|
||||
@@ -60,6 +60,11 @@
|
||||
var toggle = root.querySelector('.newadd-btns__toggle');
|
||||
var menu = root.querySelector('.drop-newadd');
|
||||
if (!toggle || !menu) return;
|
||||
if (toggle.tagName === 'SPAN' || toggle.tagName === 'DIV') {
|
||||
toggle.setAttribute('role', 'button');
|
||||
toggle.setAttribute('tabindex', '0');
|
||||
if (!toggle.hasAttribute('aria-expanded')) toggle.setAttribute('aria-expanded', 'false');
|
||||
}
|
||||
|
||||
if (openRoot && openRoot !== root) closeMenu();
|
||||
|
||||
@@ -75,7 +80,7 @@
|
||||
menu.setAttribute('aria-hidden', 'false');
|
||||
menu.classList.add('is-open');
|
||||
root.classList.add('is-open');
|
||||
toggle.setAttribute('aria-expanded', 'true');
|
||||
if (toggle.setAttribute) toggle.setAttribute('aria-expanded', 'true');
|
||||
placeMenu(toggle, menu);
|
||||
}
|
||||
|
||||
@@ -136,6 +141,11 @@
|
||||
var toggle = root.querySelector('.newadd-btns__toggle');
|
||||
var menu = root.querySelector('.drop-newadd');
|
||||
if (!toggle || !menu) return;
|
||||
if (toggle.tagName === 'SPAN' || toggle.tagName === 'DIV') {
|
||||
toggle.setAttribute('role', 'button');
|
||||
toggle.setAttribute('tabindex', '0');
|
||||
if (!toggle.hasAttribute('aria-expanded')) toggle.setAttribute('aria-expanded', 'false');
|
||||
}
|
||||
|
||||
// CSS hover no longer drives this control.
|
||||
root.classList.add('is-js-portal');
|
||||
|
||||
Reference in new issue
Block a user