kate522/wordpress-theme-aksrt
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix(nav): inline top-bar icon/text alignment into nav.css

Browse Source 
Bypass @import cache for critical FA centering, CTA baseline, and menu title flex so navbar offsets match zibll after hard refresh.
This commit is contained in:
kate522
2026-07-24 12:16:59 +08:00
parent 879e48a37a
commit a5fd5105f4
1 changed files with 142 additions and 1 deletions
Download Patch File Download Diff File Expand all files Collapse all files
assets/css/frontend/nav.css
+142 -1
View File
@@ -7,4 +7,145 @@
@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");
/* === Inline critical nav icon/text alignment (bypass @import cache) === */
/* zibll toggle-radius icon center */
.navbar-top .toggle-radius,
.navbar-top a.toggle-theme.toggle-radius,
.navbar-but-cluster .toggle-theme {
position: relative;
width: 29px;
height: 29px;
display: inline-block;
overflow: hidden;
vertical-align: middle;
box-sizing: border-box;
}
.navbar-top .toggle-radius > i,
.navbar-top .toggle-radius .fa,
.navbar-top .toggle-radius .fas,
.navbar-top .toggle-theme > i {
position: absolute !important;
top: 50% !important;
left: 0 !important;
right: 0 !important;
margin: auto !important;
transform: translateY(-50%) !important;
line-height: 1 !important;
width: 1em;
height: 1em;
display: inline-flex !important;
align-items: center;
justify-content: center;
text-align: center;
}
/* Icon-only .btn chips (user / search) */
.navbar-top .list-inline > li > a.btn,
.navbar-top a.btn.signin-loader,
.navbar-top a.btn.nav-search-btn,
.navbar-top a.btn.main-search-btn {
display: inline-flex !important;
align-items: center !important;
justify-content: center !important;
width: 36px !important;
height: 36px !important;
min-height: 36px !important;
padding: 0 !important;
gap: 0 !important;
line-height: 1 !important;
box-sizing: border-box;
vertical-align: middle;
}
.navbar-top .list-inline > li > a.btn > i,
.navbar-top a.btn.signin-loader > i,
.navbar-top a.btn.nav-search-btn > i,
.navbar-top a.btn.main-search-btn > i {
margin: 0 !important;
line-height: 1 !important;
position: static !important;
transform: none !important;
top: auto !important;
width: 1em;
height: 1em;
display: inline-flex;
align-items: center;
justify-content: center;
}
/* CTA icon + label baseline */
.navbar-top a.navbar-cta.but,
.navbar-top .navbar-but .but {
display: inline-flex !important;
align-items: center !important;
justify-content: center !important;
line-height: 1 !important;
vertical-align: middle;
}
.navbar-top a.navbar-cta.but > i,
.navbar-top .navbar-but .but > i {
margin: 0 0.25em 0 0 !important;
line-height: 1 !important;
position: static !important;
transform: none !important;
top: auto !important;
flex-shrink: 0;
}
.navbar-top a.navbar-cta.but > .navbar-cta-text,
.navbar-top .navbar-but .but > .navbar-cta-text {
line-height: 1.2;
display: inline-block;
vertical-align: middle;
}
/* Menu text baseline */
.navbar-top .nav > li > a {
display: inline-flex !important;
align-items: center !important;
line-height: 1.44;
}
.navbar-top .nav > li > a > .menu-item-title {
line-height: 1.44;
display: inline-block;
vertical-align: middle;
}
.navbar-top .nav > li > a > .menu-item-icon,
.navbar-top .nav > li > a > i.menu-item-icon {
margin-right: 0.25em;
line-height: 1 !important;
position: static !important;
transform: none !important;
flex-shrink: 0;
}
/* FA baseline in bar */
.navbar-top .fa,
.navbar-top .fas,
.navbar-top .far,
.navbar-top .fab {
line-height: 1;
}
/* Logo */
.navbar-top .navbar-brand {
display: flex;
align-items: center;
line-height: 1;
}
.navbar-logo {
display: inline-flex;
align-items: center;
line-height: 0;
}
.navbar-logo > img {
display: block;
height: 36px;
}
/* Right clusters vertical center */
.navbar-top .navbar-form,
.navbar-top .navbar-right {
display: flex;
align-items: center;
}