We Rebuilt the Site for Phones. Notes From Two Weeks of Squinting at an iPhone
Published 2026-07-12 · Tags: product
Floating tab bar, pull-to-refresh everywhere, iOS zoom and viewport fixes, a density pass and a rendering-cost pass. What changed and what's still rough.
About 60% of visits to this site come from a phone, and until two weeks ago the site was a desktop app that happened to fit on a phone screen. That's done now. Here's what changed and what we learned, in the order we learned it.
The tab bar
The old mobile nav was a hamburger menu. You tapped it, a list appeared, you tapped again. Two taps for everything, and nothing visible about where you were.
There's now a floating tab bar at the bottom with the five places people actually go, plus a drawer on the left that mirrors the desktop sidebar for everything else. The bar hides when you scroll down and comes back when you scroll up, so it's out of the way while you read a feed and present the moment you want it.
Pull to refresh
Every tracker page is a live feed and every live feed on a phone wants pull-to-refresh. Browsers do this natively for the whole page, but we hijack scrolling in a few places (the feed, the star map), which broke the native gesture. It now works everywhere, including in the installed PWA where the browser's own refresh isn't available.
iOS, specifically
iOS Safari is its own project. Three things we fought:
Input zoom. Any text field with a font size under 16px makes Safari zoom the whole page when you tap it. Every input on the site is now at least 16px on mobile. Simple fix, embarrassing that it took this long.
The bottom bar. Safari's URL bar collapses and expands as you scroll, and the page's idea of "100% height" changes with it. We moved to dynamic viewport units so the layout tracks the real visible area instead of jumping.
The black flicker. On overscroll at the top of the page, Safari briefly showed black behind our top bar. Turned out to be our background not extending past the document edge. Fixed by painting the canvas color on the html element and letting it bleed.
Density
Phones are small and we were wasting space. The hero sections on landing pages were sized for a 27-inch monitor and took the entire first screen on a phone. They're a third of the height now. Stat tiles went from one per row to two. The compare charts in Slot Cruncher, which were unreadable at 390px wide, got a mobile layout with the legend below the chart instead of beside it.
Rendering cost
The site draws a lot: the ambient backdrop, live feeds, charts. On a mid-range Android that added up to a warm phone and a laggy scroll. Three fixes: canvas animations pause when they're off screen, long catalogs and feeds use content-visibility so the browser skips laying out rows you can't see, and images decode asynchronously so a page of slot thumbnails doesn't block the main thread while it loads.
The scroll is smooth on a three-year-old Pixel now. It wasn't.
What's still not right
The vault page is heavy and we know it. The star map is usable on a phone but it's not a joy. And landscape mode on tablets has a couple of layouts that assume portrait. All on the list.
If something on your phone looks wrong, a screenshot plus the phone model in Telegram is the most useful bug report you can send. We've fixed a dozen things that way this month alone.