Fix navbar overflow and tame light-mode card hover#669
Conversation
* Logo: 41x297 / 46x334 was overflowing the 37px navbar height, pushing the page heading into the secondary nav row. Reduced to 32x232 so the wordmark fits comfortably with breathing room. Native 7.25:1 ratio preserved for crisp rendering. * DocCard hover (light mode only): drop the border so only the white fill + shadow remain. Dark mode keeps the brand blue outline since the dark background needs more contrast to read the affordance. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
mike-solomon
left a comment
mike-solomon
left a comment
There was a problem hiding this comment.
UI changes look good to me - but I think an AI file accidentally snuck in to this PR.
| @@ -0,0 +1,176 @@ | |||
| # Moderne Documentation Project Instructions | |||
There was a problem hiding this comment.
Why was this file added? This looks like a duplicate of the claude.md file. If we want to add a file like this, I believe we should do it in a separate PR.
* Removed the desktop --ifm-navbar-height redefinition that was double-counting the secondary nav (=85px) and then formulas added another 48px on top, pushing content too far down on category pages and creating sidebar/header overlap. * At <=996px: zero out --ifm-secondary-nav-height (no secondary nav rendered on narrow), and pin --ifm-navbar-padding-horizontal and --ifm-spacing-horizontal both to 20px so the hamburger menu, breadcrumbs, and article column share a single 20px left edge. * Footer no longer sticky to viewport bottom on top-level category pages — flows as the last block element so it never sits on top of article content. * Footer at <=1060px: stacks left-aligned in this order — links (copyright + Terms/Privacy/Contact us/Licensing) → Give feedback button → social icons. Container is full width with a 20px left padding to match the article column above. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
LindsayAuch
force-pushed
the
LindsayAuch/post-merge-followups
branch
from
e5b519d to
ec3d243
Compare
* Footer: removed docs-page-only scoping (margin-left: 307px under html.docs-wrapper) so the home and docs footer share one ruleset. Container is full-width, stacks vertically below 1060px (links → Give feedback → social icons, left-aligned with 20px viewport padding). * Navbar: search and color-mode toggle were touching at narrow widths because NavbarSearch renders a div with the CSS-module class .navbarSearchContainer (not .navbar__search). Added .navbarCenter gap: 20px and an explicit margin-right: 24px on [class*='navbarSearchContainer'] inside .mobileControls so spacing applies in both layouts. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
|
@mike-solomon ready for another look — two follow-up commits since your review:
The AGENTS.md / page-header-bg.png additions are split into #671 (now out of draft) per your request. |
AGENTS.md mirrors CLAUDE.md's project instructions for the OpenAI Codex agent so both agent harnesses can find their guidance. Split out from #669 per @mike-solomon's review feedback. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
AGENTS.md mirrors CLAUDE.md's project instructions for the OpenAI Codex agent so both agent harnesses can find their guidance. Split out from #669 per @mike-solomon's review feedback. Co-authored-by: Claude Opus 4.7 <noreply@anthropic.com>
There was a problem hiding this comment.
I think something has gotten messed up with the spacing of the header. Here is what it looks like for me locally. Padding / margins are missing for the banner and header. Also note that the dark/light mode is overlapping with the text.
Current site for comparison:
… room @mike-solomon flagged that the announcement banner and primary navbar looked smashed together on this branch vs production. I had removed the desktop @media rule that redefined --ifm-navbar-height as calc(37px + secondary-nav-height), thinking the +secondary-nav in the explicit formulas was a double-count bug. Turns out the extra ~48px is intentional breathing room between the navbar stack and the article column. Restored the redefinition with a comment explaining why the duplication is on purpose. Mobile (<997px) still gets --ifm-secondary-nav-height: 0px so the hamburger / breadcrumbs sit close together. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
…reathing room" This reverts commit dc6f961.
|
Things still look weird to me as an fyi: |
|
made some changes EOD Friday and Sat. Can you see them? @mike-solomon |
I pulled the latest changes and rebuilt the site and saw no changes compared to last week. It looks like you maybe made some changes and then reverted them. @LindsayAuch |
|
@mike-solomon you're right — the branch was stale. PR #669 hadn't been brought forward through several main merges (PR #671 / #678 / #679 / cli releases / docs auto-updates), so even though there were design-polish commits on this branch, the net diff vs main effectively reverted recent work, which made the local build look unchanged when you rebuilt against latest main. Just pushed a merge of latest main into this branch ( Heads-up: the footer + navbar-spacing portions of this PR overlap with #681 (more thorough tiered responsive logic). #681 supersedes those parts. Once #681 merges, I can rebase this down to just the logo size + DocCard hover changes to keep the diff focused — say the word and I'll do that. |
|
Hey there - there are still no changes to the banner spacing and dark/light mode button even with the latest stuff merged in: I would encourage you to reach out for help if you don't understand what's going on. Copying/pasting Claude can only get so far. |
2 participants
Summary
Test plan
🤖 Generated with Claude Code