css/custom.css
/* General chat log styles */
.chat_log {
width: auto;
}
.chat_log.log2 {
background: transparent;
}
.chat_log > .chat_avatar {
width: 60px;
}
.chat_log > .my_text {
position: relative; /* Added for the ::before positioning */
padding: 6px;
border-radius: 6px;
word-break: break-word; /* Ensure text breaks to the next line */
}
/* Arrow pointing to the chat bubble */
.chat_log > .my_text::before {
content: '';
position: absolute;
top: 14px;
right: 100%;
border-width: 8px;
border-style: solid;
border-color: transparent transparent transparent transparent; /* Default transparent borders */
}
/* Table inside chat log */
.chat_log > .my_text > .btable {
table-layout: auto;
}
inside theme: then u modify the colors to make them fit.
/* custom */
/* Primary log styles */
.chat_log > .my_text {
background: #eaeaea;
}
.chat_log > .my_text::before {
border-top-color: #ddd !important;
border-right-color: #ddd !important;
}
/* Secondary log styles */
.chat_log.log2 > .my_text {
background: #e1e1e1;
}
.chat_log.log2 > .my_text::before {
border-top-color: #ccc !important;
border-right-color: #ccc !important;
}
we give big thanks to chatGPT for helping 😂
