input[type="number"] wasn't in the global input selector, so the price
field rendered with browser defaults: tiny font, no padding, and a
spinner that squeezed the hit area. On iOS this also caused a focus-
zoom because the rendered font size was below the 16px threshold
Safari uses to decide whether to zoom in.
Adds number/search/tel/url types to the styled input selector, bumps
the global font-size to a hard 16px (still 1rem in practice but
explicit prevents subsequent overrides), and hides the spinner via
webkit/moz appearance reset. Same treatment in the mobile @media
block. Result: price field looks identical to the nickname field and
the page no longer zooms when focusing it.
Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
The real reason the mobile nav still wrapped into a tall stack: deeper
in style.css (lines ~3260, ~3876, ~3950, ~3978) the original mobile
design used `display: grid` with explicit grid-column overrides for the
4th/5th nav buttons. Those rules sit AFTER the @media block I added at
line 244, so same-specificity source-order made them win — flipping
the nav back from flex to a 3-column grid that no longer fits 6 items.
Removed/neutered those legacy grid rules (designed for the old 5-tab
nav) and added `display: flex !important` plus `grid-template-columns:
none !important` to the new @media block so any future grid rule can't
sneak back in. Result: on screens ≤720px the nav is a single flex row
with horizontal scroll, no matter the source order.
Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
After multiple deploys the mobile nav still wraps into a tall stack on
some user devices. The CSS source is correct, so the most likely cause
is Safari aggressively caching the previous stylesheet. Adding
!important to the @media block guarantees that once the new CSS
actually parses, no leftover specificity quirk or cached partial
keeps the wrapped layout alive.
Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
Two regressions from the previous fix:
1. Mobile nav still wrapped into a tall stack. The @media block was
placed BEFORE the base `.nav-btn { flex: 1; min-width: 120px }`
rule, so source-order specificity made the base rule override the
mobile one. Moved the @media block to AFTER all base nav-btn rules
so it wins on screens ≤720px.
2. Albums infinite scroll never engaged when the gallery was loaded
from cache (the common case). `getAlbumCache` returned only the
array, `setAlbumCache` discarded pagination, and the DOMContentLoad
auto-load + `refreshAlbumsSilently` both bypassed
`setupAlbumsInfiniteScroll`. Now the cache preserves `{ list, page,
pages, total }`, a new `getAlbumCacheFull` exposes it, and every
cached-render path primes pagination state and arms the observer.
Background refresh also re-arms the observer after pulling fresh
`pages`, fixing the case where the cache had a stale `pages: 1`.
Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
Four user-reported fixes:
1. Albums infinite scroll: after a successful page load the
IntersectionObserver wouldn't refire when the sentinel stayed in
view (small thumbnails or large viewport), so subsequent pages
needed a manual refresh. Re-check sentinel position after each
load and add a scroll-event fallback for older mobile browsers.
2. 9-photo limit: add a "Больше 9 фото" toggle next to the photo
source buttons. When checked, the cap lifts to 99 (covers Telegram
auto-album splitting). VK still has its 9-attachment limit — if
posting to VK with more selected, prompt a confirm and truncate
the VK media payload to the first 9 client-side. Counters and
notifications all read the dynamic max.
3. Badge tab: gallery selections now auto-import into the badge list
on tab activation, so the photos appear right away with the first
one opened in the editor. The "Выбранные в галерее Flickr" button
reuses the same path for clarity.
4. Mobile UX: main navigation now scrolls horizontally on screens
≤720px instead of breaking into a tall stack — tabs stay on one
row, scroll-snap on. In the badge editor the canvas wrapper is
`position: sticky; top: 0` on screens ≤800px so the photo stays
visible while scrolling through the controls below it; canvas
also shrinks to ~62vw on phones.
Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
Adds four new controls to the digital-badge price tag so users can fine
-tune the look: a vertical position slider (raises/lowers the band
within the circle), a size slider (60-160% of the default band scale),
and two color rows for the ribbon and the digits — each with six
preset swatches plus a native color picker for custom colors.
Per-item state (priceY, priceSize, priceBg, priceFg) is preserved
across selections and renders consistently in the 240x240 export.
Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
Adds a new "Цифровой бейдж" tab for preparing 240×240 PNG circles for
round digital displays. Photos come from device upload or the existing
Flickr selection. Each photo can be drag-cropped and zoomed (mouse,
wheel, or pinch on touch), have a yellow price tag (arc band or
rectangular plate, with auto thousands separator and ₽), and a curved
nickname signature — which auto-moves to the top of the circle when a
price tag occupies the bottom. Saves are routed through the Web Share
API on phones so the badge lands in the iOS/Android Photos app
directly; history of saved badges is kept under data/badges/. Default
nickname is stored in Settings.
Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
zuevav