Skip to content

feat: add browser-local ReefTone 0.6 web alpha - #2

Draft
TomerSY wants to merge 15 commits into
mainfrom
agent/web-local-alpha
Draft

TomerSY wants to merge 15 commits into
mainfrom
agent/web-local-alpha

Conversation

@TomerSY

@TomerSY TomerSY commented Jul 27, 2026 •

Copy link
Copy Markdown
Owner

Summary

  • Add a separate browser-local ReefTone PWA while leaving the Python desktop editor unchanged.
  • Import the canonical desktop stylesheet directly so the web editor uses the exact 1.5× typography, icon, control-geometry, panel, and responsive tokens without a parallel scale layer.
  • Use the exact visible and accessible labels Red balance, Green balance, and Blue balance while preserving the stable serialized keys and processing behavior.
  • Make whole-image Before/After the default whenever a photo opens or resets; Swipe remains an explicit, mutually exclusive opt-in.
  • Add five-point Levels and Green balance parity from ReefTone 0.5, plus ReefTone 0.6 thresholded unsharp-mask Sharpening.
  • Keep the loaded-photo preview sticky beneath the app header at mobile widths so adjustments can scroll while the result stays visible.
  • Prioritize the photo on mobile by removing the floating Color information card and preview metadata, reducing the header, enlarging the sticky preview, and placing a working Before/After control directly beside the looks.
  • Compact mobile adjustments with labels left, values centered above their sliders, and reset/bypass actions right; use moderately tighter vertical rhythm and slimmer look controls.
  • Present Sharpening as a standard unboxed Presence subsection with the same heading hierarchy as other adjustment groups.
  • Give desktop web browsers a dedicated split editor: sticky image workspace on the left and the complete scrolling settings panel on the right.

Web 0.6.0-alpha.9

Desktop widths now override the inherited intermediate stacked breakpoint with an explicit two-column editor. The settings column uses the canonical panel width where space permits and smoothly contracts to 420px on narrower desktop browsers. The image workspace occupies the remaining left side, remains sticky exactly beneath the 96px header, and stays viewport-height while the right inspector supplies the page scroll. The inspector grid is constrained to its column, preventing horizontal overflow.

At 1036–1350px, the desktop canvas toolbar reflows into two clean rows so presets and comparison/zoom controls do not collide. The floating Color information card is hidden only in this constrained desktop range; it remains present on wider desktops. Mobile continues to use its established single-column layout and separate sticky-photo behavior without inheriting any of the desktop split rules.

Sharpening provides Amount, Radius, and Threshold with the desktop keys, ranges, defaults, reset/bypass behavior, undo/redo, copied settings, preview processing, and full-resolution worker export. It remains an unboxed Presence subsection. Mobile values remain geometrically centered over their sliders with labels left and reset/bypass actions right.

Deliberate web boundaries

The desktop locations for browser-unavailable features remain present but visibly disabled with capability text: verified HEIC/HEIF decode/export, TIFF and 10-bit export, ICC/P3-preserving output, HDR/gain maps, video, and local-library/service-dependent actions. JPEG/PNG processing and export remain entirely local.

Validation

  • 25/25 web tests pass, including the desktop split/sticky contract, mobile breakpoint isolation, centered mobile values, unboxed Sharpening hierarchy, comparison defaults, and processing contracts.
  • Production Vite build passes.
  • Real-image desktop QA passes at 1200×800, 1440×900, and 1920×1080; mobile regression QA passes at 440×800.
  • At 1440px the workspace resolves to a 979px left canvas and 461px right inspector. After scrolling the settings by 1420px, the canvas remains fixed at y=96 while the inspector moves.
  • At 1200px the layout resolves to 780px / 420px, the toolbar becomes two non-overlapping rows, and body scroll width equals client width exactly.
  • At 1920px the layout resolves to 1404px / 516px with the full desktop toolbar and Color information card visible.
  • At 440px the desktop media query is inactive; the mobile workspace remains a full-width column with its canvas sticky at y=72 and no horizontal overflow.
  • Browser console is clean and corrected output remains non-black.
  • Desktop/Python implementation files are unchanged.

The PR remains a draft while the browser edition continues to mature.

@TomerSY TomerSY changed the title feat: add browser-local web alpha feat: add web alpha and ReefTone 0.5 desktop controls Jul 28, 2026
@TomerSY TomerSY changed the title feat: add web alpha and ReefTone 0.5 desktop controls feat: add web alpha and ReefTone 0.6 desktop reference Jul 28, 2026
@TomerSY TomerSY changed the title feat: add web alpha and ReefTone 0.6 desktop reference feat: add browser-local ReefTone 0.6 web alpha Jul 28, 2026
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant