scottk/chatwoot
1
0
Fork 0
mirror of https://github.com/lingble/chatwoot.git synced 2025-11-02 12:08:01 +00:00
Code Issues Packages Projects Releases Wiki Activity

fix: Bubble style when grouping with next (#10677)

Browse Source
This commit is contained in:
Shivam Mishra
2025-01-14 09:05:29 +05:30
committed by GitHub
parent 35ca67c9ba
commit dbcc55665a
2 changed files with 19 additions and 4 deletions
Download Patch File Download Diff File Expand all files Collapse all files

19
app/javascript/dashboard/components-next/message/Message.vue
View File

@@ -395,9 +395,12 @@ provideMessageContext({
<template> <template>
<div <div
:id="`message${props.id}`" :id="`message${props.id}`"
class="flex w-full" class="flex w-full message-bubble-container"
:data-message-id="props.id" :data-message-id="props.id"
:class="[flexOrientationClass, shouldGroupWithNext ? 'mb-2' : 'mb-4']" :class="[
flexOrientationClass,
shouldGroupWithNext ? 'group-with-next mb-2' : 'mb-4',
]"
> >
<div v-if="variant === MESSAGE_VARIANTS.ACTIVITY"> <div v-if="variant === MESSAGE_VARIANTS.ACTIVITY">
<ActivityBubble :content="content" /> <ActivityBubble :content="content" />
@@ -454,3 +457,15 @@ provideMessageContext({
</div> </div>
</div> </div>
</template> </template>
<style lang="scss">
.group-with-next + .message-bubble-container {
.left-bubble {
@apply rounded-tl-sm;
}
.right-bubble {
@apply rounded-tr-sm;
}
}
</style>

4
app/javascript/dashboard/components-next/message/bubbles/Base.vue
View File

@@ -29,8 +29,8 @@ const varaintBaseMap = {
}; };
const orientationMap = { const orientationMap = {
[ORIENTATION.LEFT]: 'rounded-xl rounded-bl-sm', [ORIENTATION.LEFT]: 'left-bubble rounded-xl rounded-bl-sm',
[ORIENTATION.RIGHT]: 'rounded-xl rounded-br-sm', [ORIENTATION.RIGHT]: 'right-bubble rounded-xl rounded-br-sm',
[ORIENTATION.CENTER]: 'rounded-md', [ORIENTATION.CENTER]: 'rounded-md',
}; };