diff --git a/style.css b/style.css index 526b4fc..ed71db0 100644 --- a/style.css +++ b/style.css @@ -108,13 +108,15 @@ code, kbd, .mono { .topbar { position: sticky; top: 0; + inset-block-start: 0; z-index: 100; display: flex; align-items: center; justify-content: space-between; - padding: 18px var(--gutter); + min-height: 60px; + padding: 0 var(--gutter); border-bottom: 1px solid var(--line); - background: color-mix(in oklab, var(--bg) 88%, transparent); + background: color-mix(in oklab, var(--bg) 92%, transparent); backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px); } @@ -126,6 +128,13 @@ code, kbd, .mono { text-decoration: none; color: var(--fg); } +.brand-icon { + width: 24px; + height: 24px; + display: block; + object-fit: contain; + image-rendering: auto; +} .brand .mark { font-size: 18px; line-height: 1; @@ -138,16 +147,6 @@ code, kbd, .mono { font-size: 15px; letter-spacing: -0.01em; } -.brand .role-tag { - font-family: 'JetBrains Mono', monospace; - font-size: 10px; - text-transform: uppercase; - letter-spacing: 0.1em; - padding: 2px 6px; - border: 1px solid var(--green-soft); - color: var(--green); - margin-left: 4px; -} .nav { display: flex; align-items: center; gap: 28px; } .nav-mobile { display: none; } @@ -876,7 +875,8 @@ a:focus-visible, position: sticky; align-items: center; gap: 12px; - padding: 10px var(--gutter); + min-height: 52px; + padding: 0 var(--gutter); } .brand { @@ -885,7 +885,7 @@ a:focus-visible, } .brand .wordmark { font-size: 14px; } - .brand .role-tag { font-size: 9px; padding: 2px 5px; } + .brand-icon { width: 22px; height: 22px; } .nav-desktop { display: none; } .nav-mobile { @@ -1056,7 +1056,6 @@ a:focus-visible, } @media (max-width: 380px) { - .role-tag { display: none; } .brand { gap: 7px; } .brand .wordmark { font-size: 13px; } .nav-mobile { gap: 8px; } diff --git a/views/partials/header.ejs b/views/partials/header.ejs index 7fa8d05..5bb0597 100644 --- a/views/partials/header.ejs +++ b/views/partials/header.ejs @@ -1,8 +1,7 @@
- + bonzi - agent