← TimeSpanCalc

Changelog

V2 March 2026

Replace-mode editing

Tap any filled slot to select it. The first key you press replaces the value — no need to backspace first. Works naturally, like editing a cell in a spreadsheet. Auto-advance carries replace mode forward when the next slot also has content.

Smart digit validation

Invalid digits are rejected with a shake animation before they can enter a slot. Single-digit months (2–9) and days (4–9) auto-advance to the next slot instantly, reducing the number of keystrokes needed.

Inline unit selector

Tap the unit button on any duration row to open a compact strip showing all six units: minutes / hours / days / weeks / months / years. Tap to select, tap outside to close. Replaces the previous tap-to-cycle approach.

Time-of-day input

Tap + HH:MM on any date field to add hours and minutes. Enables calculating exact durations across specific times of day — shifts, flights, appointments. Toggle back with − HH:MM to return to date-only input.

Two-level result typography

Result numbers are now large and serif (36px). Unit labels are smaller and muted. The number dominates; the unit recedes. Multiple parts (years, months, days) wrap naturally and remain easy to read at a glance.

Business days toggle

In SPAN mode, tap work days below the result to switch to a Monday–Friday count, skipping weekends. Useful for project deadlines, notice periods, and invoice terms.

UX clarity

Mode descriptions updated to plain language: date − date = duration, date ± duration = date, duration + duration = total. Today button restyled as a pill chip matching the format button. Minor dead code removed.

V1 March 2026

Initial release

Three modes — SPAN, LAND, TOTAL — covering the most common date and duration calculation needs. Slot-based date entry with keypad: no typing, no calendar picker. Live result that updates as you type, with tap-to-cycle unit representation and one-tap copy to clipboard.

Design

Bauhaus minimalist aesthetic with a warm off-white palette. Serif typeface for result numbers. CSS variables throughout — no hardcoded colours. Full dark mode support following system preference.

Format preference

Date format (MM/DD/YYYY, DD/MM/YYYY, YYYY/MM/DD) auto-detected from browser locale on first visit and saved to localStorage. Persists across sessions.

PWA support

Add to home screen on any mobile device. Opens full-screen like a native app. Responsive across mobile, tablet, and desktop.

Rotating use-case hints

A rotating strip of real-life example questions below the calculator — age, visa deadlines, anniversaries, study hours — to help first-time visitors understand what the tool can do.