tree e57fb0d4f57ed29e3defc33e00350a941017ce33
parent 2cc7563b105e381982b0732279609fde49c0ce2d
author banksean <banksean@gmail.com> 1752772210 +0000
committer Autoformatter <bot@sketch.dev> 1752775713 +0000

sketch: fix Timeline messages width overflow issue

Fix issue where Timeline messages don't fit within their designated width,
causing text to overflow beyond message bubble boundaries and overlap with
other UI elements.

Root cause was that max-width constraints were not being applied properly:
- max-w-[calc(100%-160px)] Tailwind class wasn't being computed correctly
- markdown-content div was missing proper overflow-wrap and word-break CSS
- message content div was missing max-width constraints

Changes:
- Add explicit style attributes for max-width constraints on bubble containers
- Add proper word-break and overflow-wrap CSS properties to markdown content
- Update global CSS to ensure consistent word breaking behavior
- Add overflow: hidden to prevent content from overflowing containers
- Create test page to verify fix works in normal and compact padding modes

The fix ensures messages wrap properly within their containers in both normal
mode (with 160px margin) and compact padding mode (full width) while
breaking long URLs and unbreakable strings appropriately.

Fixes https://github.com/boldsoftware/sketch/issues/201

Co-Authored-By: sketch <hello@sketch.dev>
Change-ID: s7eaa3905ab8c4595k