@import url("nav/zib-navbar-fixed.css"); @import url("nav/zib-navbar-core.css"); @import url("nav/zib-mobile-navbar.css"); @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"); /* ========================================================================== * Top navbar icon/text alignment — 1:1 zibll (demo.zibll.com / main.css) * Kept INLINE in the aggregator so browsers cannot miss it via stale @import. * ========================================================================== */ /* --- Shell row --- */ .navbar-top { margin: 0; border-radius: 0 !important; font-size: 15px; } .navbar-top .navbar-form, .navbar-top .navbar-right, .navbar-top .navbar-form.flex.ac { display: flex !important; align-items: center !important; margin-top: 0; margin-bottom: 0; } .navbar-top .list-inline { display: flex; align-items: center; margin: 0; padding: 0; list-style: none; } .navbar-top .list-inline > li { display: flex; align-items: center; margin: 0; vertical-align: middle; } .navbar-top .list-inline.splitters > li + li { margin-left: 6px; } /* --- Logo --- */ .navbar-top .navbar-brand { display: flex; align-items: center; padding: 7px 10px; line-height: 1; } .navbar-logo { display: inline-flex; align-items: center; line-height: 0; } .navbar-logo > img { display: block; height: 36px; padding: 0 30px; width: auto; max-height: 36px; } /* --- Primary menu text/icons --- */ .navbar-top .nav > li > a { padding-left: 10px; padding-right: 10px; border-radius: 4px; display: inline-flex !important; align-items: center !important; overflow: hidden; line-height: 1.44; } .navbar-top .nav > li > a > .menu-item-title { text-overflow: ellipsis; white-space: nowrap; overflow: hidden; 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, .navbar-top .nav > li > a > .fa.menu-item-icon, .navbar-top .nav > li > a > .fas.menu-item-icon { margin-right: 0.25em !important; margin-left: 0 !important; line-height: 1 !important; position: static !important; transform: none !important; top: auto !important; flex-shrink: 0; vertical-align: 0 !important; } .navbar-top .nav > li > a > .fa-angle-down { margin-left: 0.2em; margin-right: 0 !important; line-height: 1; flex-shrink: 0; } .navbar-nav li a, .navbar-nav li { max-height: 50px; position: relative; } /* --- CTA (发布 / 会员): icon + label --- */ .navbar-top .navbar-but .but, .navbar-top a.navbar-cta.but { font-size: 0.8em; padding: 0.3em 1em !important; margin: 0.4em; display: inline-flex !important; align-items: center !important; justify-content: center !important; line-height: 1.44 !important; vertical-align: middle; box-sizing: border-box; gap: 0; } .navbar-top .navbar-but .but > i, .navbar-top a.navbar-cta.but > i, .navbar-top .navbar-but .but > .fa, .navbar-top .navbar-but .but > .fas, .navbar-top a.navbar-cta.but > .fa, .navbar-top a.navbar-cta.but > .fas { margin: 0 0.25em 0 0 !important; line-height: 1 !important; position: static !important; transform: none !important; top: auto !important; flex-shrink: 0; vertical-align: 0 !important; display: inline-block; } .navbar-top .navbar-but .but > .navbar-cta-text, .navbar-top a.navbar-cta.but > .navbar-cta-text { line-height: 1.44; display: inline-block; vertical-align: middle; white-space: nowrap; } /* --- 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-width: 36px !important; min-height: 36px !important; max-height: 36px !important; padding: 0 !important; gap: 0 !important; line-height: 1 !important; border-radius: 4px; box-sizing: border-box; vertical-align: middle; font-size: 16px; } .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; left: auto !important; right: auto !important; width: 1em; height: 1em; display: inline-flex !important; align-items: center; justify-content: center; vertical-align: 0 !important; } /* Avatar trigger */ .navbar-top a.navbar-avatar { display: inline-flex !important; align-items: center; justify-content: center; width: 36px; height: 36px; padding: 0 !important; line-height: 0; } .navbar-top a.navbar-avatar img, .navbar-top a.navbar-avatar .avatar { width: 32px !important; height: 32px !important; border-radius: 50%; display: block; margin: 0 !important; } /* --- Theme toggle (zibll toggle-radius 29px) --- */ .navbar-top a.toggle-theme.toggle-radius, .navbar-top .toggle-theme.toggle-radius, .navbar-but-cluster .toggle-theme { position: relative !important; width: 29px !important; height: 29px !important; min-width: 29px !important; min-height: 29px !important; display: inline-block !important; overflow: hidden !important; vertical-align: middle; border-radius: 100% !important; box-sizing: border-box; padding: 0 !important; flex: 0 0 auto; line-height: 1; } .navbar-top a.toggle-theme.toggle-radius > i, .navbar-top .toggle-theme.toggle-radius > i, .navbar-top a.toggle-theme.toggle-radius .fa, .navbar-top a.toggle-theme.toggle-radius .fas { 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 !important; height: 1em !important; display: inline-flex !important; align-items: center !important; justify-content: center !important; text-align: center; vertical-align: 0 !important; } /* Only one glyph visible */ .navbar-top .toggle-theme .theme-icon-sun[style*="display:none"], .navbar-top .toggle-theme .theme-icon-moon[style*="display:none"] { display: none !important; } /* --- Dropdown circular badges (header-user-href) keep 36px --- */ .navbar-top .header-user-href .toggle-radius, .navbar-top .badg.toggle-radius { position: relative !important; width: 36px !important; height: 36px !important; display: inline-block !important; text-align: center; vertical-align: middle; overflow: hidden; border-radius: 100%; box-sizing: border-box; } .navbar-top .header-user-href .toggle-radius > i, .navbar-top .header-user-href .toggle-radius .fa, .navbar-top .header-user-href .toggle-radius .fas, .navbar-top .badg.toggle-radius > i, .navbar-top .badg.toggle-radius .fa, .navbar-top .badg.toggle-radius .fas { 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; vertical-align: 0 !important; } /* --- FA general --- */ .navbar-top .fa, .navbar-top .fas, .navbar-top .far, .navbar-top .fab { line-height: 1; transition: 0.2s; } .navbar-top .css-icon { width: 1em; height: 1em; vertical-align: -0.15em; display: inline-block; position: relative; } /* Fold / bars but in mid widths */ .navbar-top .show-nav-but .but { display: inline-flex !important; align-items: center; justify-content: center; line-height: 1; padding: 0.3em 0.6em !important; } .navbar-top .show-nav-but .but > i { margin: 0 !important; line-height: 1 !important; }