feat(nadia): Implement iOS app badges in footer, topnav, and mobile menu

Outcome: done
Changed: devplacepy/templates/base.html:126-132,189-195; devplacepy/templates/_footer_links.html:12-19; devplacepy/templates/admin_settings.html:33-38; devplacepy/routers/admin/settings.py:19; devplacepy/templating.py:197-199,218; devplacepy/static/css/base.css:720-731,785-793,1151-1161,1210-1212; devplacepy/database/CLAUDE.md:224,228
Verified by: import gate clean; py_compile clean; ruff/pyflakes no new findings; TestClient smoke (badges present with href=ios_app_url, target=_blank rel=noopener noreferrer, static_url-versioned src on /, /feed, /leaderboard; absent when setting empty; admin clear via /admin/settings POST verified); make test-fast: 2659 passed, 1 skipped, 10 failed - all environmental (9 missing docker binary, 1 missing libcairo.so.2), none caused by this change; Playwright e2e inapplicable (chromium cannot launch: libglib-2.0.so.0 missing)
Findings: Badges render only when ios_app_url site setting is non-empty and are editable/clearable via AdminSettingsForm (CLEARABLE_SETTINGS). Researched URL https://apps.apple.com/app/devplace/id6797215143 (trackId 6797215143, bundleId wok.DevPlaceIOS) confirmed via iTunes Lookup API and seeded in schema.py operational_defaults by sibling commit. Topnav badge hides at <=1024px where the mobile panel badge takes over, keeping the 360px layout overflow-free. Badge SVG is Apple's official white variant vendored at devplacepy/static/app-store-badge.svg with retoor header. Apple badge marketing guidance (40px min

Typosaurus-Run: 2910ed1ba2604be09c649141af1baf44
Typosaurus-Node: 2817fd803023406699936e88b76ee632
Typosaurus-Agent: @nadia
Refs: #169
This commit is contained in:
typosaurus
2026-08-16 03:59:11 +00:00
parent 551d540bc7
commit 15f04e0d13
7 changed files with 64 additions and 5 deletions
+33 -2
View File
@@ -717,6 +717,17 @@ img {
line-height: 1;
}
.app-store-nav-link {
display: inline-flex;
align-items: center;
line-height: 0;
}
.app-store-nav-badge {
width: 90px;
height: auto;
}
.topnav-mobile-overlay {
display: none;
position: fixed;
@@ -771,6 +782,15 @@ img {
background: var(--accent-light);
}
.app-store-mobile-link {
justify-content: flex-start;
}
.app-store-mobile-badge {
width: 120px;
height: auto;
}
.topnav-mobile-divider {
height: 1px;
background: var(--border);
@@ -1128,6 +1148,17 @@ body:has(.page-messages) {
color: var(--text-primary);
}
.app-store-link {
display: inline-flex;
align-items: center;
line-height: 0;
}
.app-store-badge {
width: 120px;
height: auto;
}
.sr-only {
position: absolute;
width: 1px;
@@ -1176,7 +1207,8 @@ body:has(.page-messages) {
}
.topnav-tools-dropdown,
.topnav-icon[href="/leaderboard"] {
.topnav-icon[href="/leaderboard"],
.app-store-nav-link {
display: none;
}
@@ -1392,4 +1424,3 @@ body:has(.page-messages) {
color: var(--text-secondary);
margin: 0 0 var(--space-lg);
}