Fix project card timestamp overflow on iPad portrait#6879
Conversation
Add overflow:hidden to .ui.card.file .meta to prevent the timestamp text from overflowing past the card boundary on narrow screens. Agent-Logs-Url: https://github.com/microsoft/pxt-microbit/sessions/c6b8fd46-2715-4049-b17b-3811c8e29c63 Co-authored-by: srietkerk <49178322+srietkerk@users.noreply.github.com>
|
@copilot This isn't the desired behavior. We do not want any content to be cutoff, which is what adding an |
…flow hidden Replace overflow:hidden with font-size and padding reduction at tablet breakpoint. This matches the approach already used at the mobile breakpoint in pxt-core, ensuring the timestamp text wraps and fits within the card rather than being cut off. Agent-Logs-Url: https://github.com/microsoft/pxt-microbit/sessions/6d947f28-6c28-43f2-ac11-209827e7375d Co-authored-by: srietkerk <49178322+srietkerk@users.noreply.github.com>
Replaced |
On narrow viewports (iPad portrait), the "a few seconds ago" timestamp in My Projects cards overflows the card boundary. The
.ui.card.file .metaelement in pxt-core has a fixedheight: 4rembut at tablet widths (200px cards), the timestamp text wraps to multiple lines and spills out..metafont-size to0.7remand padding to0.5remat the tablet breakpoint (max-width: @largestTabletScreen) in the target theme override (theme/style.less), matching the approach already used at the mobile breakpoint in pxt-core. This ensures the timestamp text wraps properly and fits within the card rather than being cut off.