The initialBlur field is defined in DemoMeta, documented in README,
present in schema.json, and consumed by the generator — but validateDemoMeta
in parser.ts never read or forwarded it. Any YAML using `initialBlur`
had the value silently dropped, so the generator always fell back to
the default blur of 1px regardless of what was configured.
Co-authored-by: HarshSheth1128 <harshsheth1128@users.noreply.github.com>
Co-authored-by: Claude Sonnet 4.6 <noreply@anthropic.com>
Add overflow: hidden and text-overflow: ellipsis to .tab CSS rule so
long tab titles truncate with "..." when constrained by max-width at
the 600px mobile breakpoint.
scrollIntoView() scrolls all ancestor containers including the parent
page when embedded in an iframe. Replaced with manual scrollTo() on
the specific container to isolate scroll behavior.
- Use container.scrollTo() instead of element.scrollIntoView()
- Add browser fallback for older browsers without scrollTo support
- Add Math.max(0, ...) guard for edge cases
- Remove redundant scroll-margin-top CSS (only affects scrollIntoView)
Previously, long messages scrolled to show the bottom of the bubble,
requiring users to scroll up to start reading. Now scrolls to the top
of each new element with an 8px buffer to prevent text clipping.
- Replace smoothScrollToBottom() with scrollToNewElement(element)
- Use scrollIntoView({ block: 'start' }) for element-centric scrolling
- Add scroll-margin-top: 8px to message, annotation, transition elements
- Same-origin iframes now detect parent's data-theme attribute directly
- Uses MutationObserver to watch for theme changes
- Fixed play overlay color in dark mode to match chat background
Add prefers-color-scheme media query override for tab scroll button
shadows, so arrow glow switches to dark automatically with system
dark mode (not just when parent sends theme-change message).
- Changed controls from position:fixed to flex flow in iframe mode
- This fixes canvas overlapping controls in short iframes (400-500px)
- Made controls compact on very small screens (<400px) to prevent wrapping
- Removed conflicting mobile max-height override
- Add symmetric padding to chat messages for timer circle clearance
- Make speaker labels more visible (use --text-secondary)
- Fix blank screen during auto-advance tab transitions
- Speed changes now take effect immediately mid-countdown
- Add horizontal scroll with arrow buttons when tabs overflow
- Use CSS mask-image for fade effect (works on any background)
- Auto-scroll active tab into view when selected or auto-advanced
- Add drop-shadow glow on chevron icons for visibility
- Support both standalone and iframe embedding contexts
- Add test-many-tabs.yaml and embed-example.html examples
- Update documentation
- Tabs now shrink equally (flex: 1 1 0) and truncate long labels
- Added padding to align tabs with canvas border-radius
- Removed horizontal scrolling and momentum bounce
- All tabs always visible without overflow
- Fix stretched play button on small phones by using flex: 0 0 auto
instead of flex: 1 1 100% in @media (max-width: 400px)
- Fix tabs overflowing viewport by resetting margin-left: 0 on mobile
- Prevent vertical scroll movement on tabs container
- Ensure tabs don't overflow parent container
- Enforce square aspect ratio on play button icon
- Center play icon in flex container
- Change mobile tabs to horizontal scroll instead of stacking on small screens
- Add backdrop blur and semi-transparent background to inactive tabs in iframes
- Prevent play overlay icon from squishing on small screens with min-width/height
- Hide scrollbars while maintaining scroll functionality on mobile
Clarifies that the tool creates annotated (not animated) replays
of text conversations. Updates description across README, package.json,
and CLI help text. Bumps version to 0.1.10.
- Fix iframe embed background: ensure chat canvas is opaque white
- Fix tab transition fade: only fade content, not container background
- Fix version display: read from package.json instead of hardcoding
- Reduce initial blur (1.5px → 1px default, configurable via initialBlur)
- Enlarge play button triangle (20px → 26px)
- Match annotation text size to message text (15px)
- Improve tab styling for iframe/embedded mode
- Darken annotation text for better readability
- Make iframe controls spacing responsive with clamp()
- Add annotationText and annotationBorder color config options
- Fix invalid CSS selector for dark mode iframe controls
lennyzeltser