Skip to content

Commit 7e40235

Browse files
itayinbarrclaude
andcommitted
site: fix mobile nav overflow + center navbar logo cursor
- nav-cta: shrink + wrap the github url under 800px so the long URL no longer forces the viewport wider than the screen (the full links + url stopped fitting around ~795px, e.g. iPad portrait) - brand mark: sit the block cursor on the baseline instead of the line-box center so it lines up with the "lc" glyphs (scoped to the nav so hero/footer cursors are unchanged) Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
1 parent e55e52e commit 7e40235

1 file changed

Lines changed: 23 additions & 1 deletion

File tree

site/site.css

Lines changed: 23 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -174,6 +174,13 @@ a { color: inherit; text-decoration: none; }
174174
display: inline-flex;
175175
align-items: center;
176176
}
177+
/* optically center the block cursor against the "lc" glyphs:
178+
sit it on the baseline rather than the line-box center, which
179+
has empty descender space that drags the default centering low */
180+
.nav .brand .mark .cursor {
181+
height: 0.74em;
182+
transform: translateY(-0.07em);
183+
}
177184
.nav .brand-name {
178185
font-size: 14px;
179186
color: var(--ink-60);
@@ -1083,8 +1090,23 @@ body.show-grid::after {
10831090
.install-grid { grid-template-columns: 1fr; }
10841091
.comm-grid { grid-template-columns: 1fr; }
10851092
}
1086-
@media (max-width: 760px) {
1093+
/* nav collapses a touch earlier than the content grids: the full
1094+
links + full github url stop fitting on one row just under ~800px */
1095+
@media (max-width: 800px) {
10871096
.nav-links { display: none; }
1097+
/* let the github cta shrink + wrap inside the remaining width
1098+
instead of forcing the page wider than the viewport */
1099+
.nav { gap: 16px; }
1100+
.nav-cta {
1101+
min-width: 0;
1102+
font-size: 12px;
1103+
padding: 7px 11px;
1104+
line-height: 1.4;
1105+
text-align: right;
1106+
}
1107+
.nav-cta > span:first-child { overflow-wrap: anywhere; }
1108+
}
1109+
@media (max-width: 760px) {
10881110
.bench-row { grid-template-columns: 1fr; }
10891111
.bench-num { text-align: left; min-width: 0; }
10901112
.feat-grid, .prin-grid { grid-template-columns: 1fr; }

0 commit comments

Comments
 (0)