fix code block width - use 72vw for desktop, 85vw for mobile

This commit is contained in:
Russell Ballestrini 2025-10-11 09:11:43 -04:00
parent 86ef139a1d
commit 0ede23a4db
2 changed files with 26 additions and 4 deletions

View file

@ -1122,11 +1122,22 @@ dialog#uncloseai-embedded-modal[data-theme="dark"] .uncloseai-chat-box {
/* Code blocks within AI messages - allow horizontal scroll, preserve all whitespace */
.ai-message pre {
overflow-x: auto;
max-width: 80vw;
max-width: 72vw;
}
.ai-message code {
max-width: 80vw;
max-width: 72vw;
}
/* Mobile: use viewport units since modal is fullscreen */
@media (max-width: 768px) {
.ai-message pre {
max-width: 85vw;
}
.ai-message code {
max-width: 85vw;
}
}
.message-text {

View file

@ -1195,11 +1195,22 @@ dialog#uncloseai-embedded-modal[data-theme="dark"] .uncloseai-chat-box {
/* Code blocks within AI messages - allow horizontal scroll, preserve all whitespace */
.ai-message pre {
overflow-x: auto;
max-width: 80vw;
max-width: 72vw;
}
.ai-message code {
max-width: 80vw;
max-width: 72vw;
}
/* Mobile: use viewport units since modal is fullscreen */
@media (max-width: 768px) {
.ai-message pre {
max-width: 85vw;
}
.ai-message code {
max-width: 85vw;
}
}
.message-text {