fix(nav): align header bar height with zibll main.css
Drop forced 34px CTA chips and container min-height:50 that inflated or shrank the bar vs zibll. Restore .navbar-but .but to 0.8em / 0.3em 1em / margin 0.4em; keep logo 36px, header pad 8px 20px, fixed reserve 88px.
This commit is contained in:
1 parent
ab3d361d46
commit
8a6f6feafb
3 files changed
+81
-113
No files matched your search
@@ -1,13 +1,13 @@
|
||||
/**
|
||||
* Header multi-function publish cluster + VIP CTA + hover VIP cards.
|
||||
*
|
||||
* Live header often uses .navbar-form.navbar-but / .navbar-vip WITHOUT
|
||||
* .navbar-but-cluster. Mirror the 34px chip lock for those roots too.
|
||||
* CTA metrics 1:1 zibll main.css:
|
||||
* .navbar-top .navbar-but .but { font-size:.8em; padding:.3em 1em; margin:.4em; }
|
||||
*
|
||||
* @package AKSRT
|
||||
*/
|
||||
|
||||
/* Shared CTA chip (cluster OR bare navbar-but / navbar-vip forms) */
|
||||
/* Shared CTA (cluster OR bare navbar-but / navbar-vip forms) */
|
||||
.navbar-but-cluster a.navbar-cta,
|
||||
.navbar-but-cluster a.btn-primary,
|
||||
.navbar-but-cluster a.but.btn-primary,
|
||||
@@ -25,17 +25,17 @@
|
||||
display: inline-flex !important;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
gap: 6px;
|
||||
padding: 0 14px !important;
|
||||
height: 34px !important;
|
||||
min-height: 34px !important;
|
||||
max-height: 34px !important;
|
||||
border-radius: var(--navbar-cta-radius, 20px);
|
||||
gap: 0.25em;
|
||||
padding: 0.3em 1em !important;
|
||||
height: auto !important;
|
||||
min-height: 0 !important;
|
||||
max-height: 50px !important;
|
||||
border-radius: var(--navbar-cta-radius, 50px);
|
||||
color: #fff !important;
|
||||
text-decoration: none;
|
||||
border: 0;
|
||||
font-size: 13px !important;
|
||||
line-height: 1 !important;
|
||||
font-size: 0.8em !important;
|
||||
line-height: 1.44 !important;
|
||||
white-space: nowrap;
|
||||
box-sizing: border-box !important;
|
||||
vertical-align: middle;
|
||||
@@ -43,7 +43,7 @@
|
||||
width: fit-content !important;
|
||||
max-width: fit-content !important;
|
||||
min-width: 0 !important;
|
||||
margin: 0 4px !important;
|
||||
margin: 0.4em !important;
|
||||
appearance: none;
|
||||
-webkit-appearance: none;
|
||||
cursor: pointer;
|
||||
@@ -51,7 +51,7 @@
|
||||
transform: none !important;
|
||||
}
|
||||
|
||||
/* Paint for publish / VIP when not already gradient-colored by jb-* */
|
||||
/* Paint for publish when not already gradient-colored by jb-* */
|
||||
.navbar-but-cluster a.navbar-cta,
|
||||
.navbar-but-cluster a.btn-primary,
|
||||
.navbar-but-cluster a.but.btn-primary,
|
||||
@@ -123,7 +123,7 @@
|
||||
max-width: fit-content !important;
|
||||
min-width: 0 !important;
|
||||
flex: 0 0 auto !important;
|
||||
height: 34px;
|
||||
height: auto;
|
||||
}
|
||||
|
||||
.navbar-but-cluster .payvip-icon.but,
|
||||
@@ -131,7 +131,7 @@
|
||||
background: linear-gradient(90deg, #ff6b6b, #f04494);
|
||||
color: #fff;
|
||||
padding: 0 12px !important;
|
||||
height: 34px !important;
|
||||
height: auto !important;
|
||||
border-radius: var(--navbar-cta-radius, 20px);
|
||||
text-decoration: none;
|
||||
font-size: 13px;
|
||||
@@ -155,7 +155,7 @@
|
||||
width: fit-content !important;
|
||||
max-width: fit-content !important;
|
||||
min-width: 0 !important;
|
||||
height: 34px !important;
|
||||
height: auto !important;
|
||||
flex: 0 0 auto !important;
|
||||
position: relative;
|
||||
overflow: visible !important;
|
||||
@@ -170,8 +170,8 @@ div.newadd-btns.hover-show {
|
||||
width: fit-content !important;
|
||||
max-width: fit-content !important;
|
||||
min-width: 0 !important;
|
||||
height: 34px !important;
|
||||
max-height: 34px !important;
|
||||
height: auto !important;
|
||||
max-height: 50px !important;
|
||||
padding: 0 !important;
|
||||
margin: 0 !important;
|
||||
border: 0 !important;
|
||||
@@ -193,10 +193,10 @@ div.newadd-btns.hover-show {
|
||||
align-items: center !important;
|
||||
justify-content: center !important;
|
||||
gap: 6px !important;
|
||||
height: 34px !important;
|
||||
min-height: 34px !important;
|
||||
max-height: 34px !important;
|
||||
padding: 0 14px !important;
|
||||
height: auto !important;
|
||||
min-height: 0 !important;
|
||||
max-height: 50px !important;
|
||||
padding: 0.3em 1em !important;
|
||||
margin: 0 !important;
|
||||
width: fit-content !important;
|
||||
max-width: fit-content !important;
|
||||
@@ -218,8 +218,8 @@ div.newadd-btns.hover-show {
|
||||
width: fit-content !important;
|
||||
max-width: fit-content !important;
|
||||
min-width: 0 !important;
|
||||
padding: 0 14px !important;
|
||||
height: 34px !important;
|
||||
padding: 0.3em 1em !important;
|
||||
height: auto !important;
|
||||
transform: none !important;
|
||||
flex: 0 0 auto !important;
|
||||
}
|
||||
|
||||
Reference in new issue
Block a user