Merge mai/cronus/participant-chat-cap: cap chat column to viewport on long forms

This commit is contained in:
mAi
2026-05-06 15:46:08 +02:00

View File

@@ -1666,6 +1666,10 @@ body { min-height: 100vh; }
@media (min-width: 900px) {
.fb-participant {
grid-template-columns: 1fr 1fr;
/* Don't stretch the chat column to match a long form. Each column
takes its own natural height; the chat column then caps itself
to the viewport via .fb-participant__col--chat below. */
align-items: start;
}
}
@@ -1700,12 +1704,24 @@ body { min-height: 100vh; }
}
}
/* Chat column — bubbles fill the column height, compose pinned at bottom. */
/* Chat column — bubbles fill the column height, compose pinned at bottom.
The column always caps to the viewport so a long form on the left can't
stretch the chat into a 3000px tall scroll-soup. On desktop it sticks to
the top so it stays visible while the user scrolls down through the
form. On mobile it just caps below the form. */
.fb-participant__col--chat {
background: var(--color-bg-primary);
border-radius: var(--radius-lg);
padding: var(--space-3);
min-height: 320px;
max-height: calc(100vh - 2rem);
}
@media (min-width: 900px) {
.fb-participant__col--chat {
position: sticky;
top: 1rem;
}
}
@media (max-width: 899px) {