feat: Support Dark mode for the widget (#4137)

Co-authored-by: Pranav Raj S <pranav@chatwoot.com>
This commit is contained in:
Sivin Varghese 2022-04-01 20:59:03 +05:30 committed by GitHub
parent 3813b3b372
commit caee9535f1
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
36 changed files with 411 additions and 113 deletions

View file

@ -24,7 +24,7 @@
<div
v-if="hasAttachments"
class="chat-bubble has-attachment agent"
:class="wrapClass"
:class="(wrapClass, $dm('bg-white', 'dark:bg-slate-50'))"
>
<div v-for="attachment in message.attachments" :key="attachment.id">
<image-bubble
@ -40,7 +40,11 @@
<file-bubble v-else :url="attachment.data_url" />
</div>
</div>
<p v-if="message.showAvatar || hasRecordedResponse" class="agent-name">
<p
v-if="message.showAvatar || hasRecordedResponse"
class="agent-name"
:class="$dm('text-slate-700', 'dark:text-slate-200')"
>
{{ agentName }}
</p>
</div>
@ -68,6 +72,8 @@ import { MESSAGE_TYPE } from 'widget/helpers/constants';
import configMixin from '../mixins/configMixin';
import messageMixin from '../mixins/messageMixin';
import { isASubmittedFormMessage } from 'shared/helpers/MessageTypeHelper';
import darkModeMixin from 'widget/mixins/darkModeMixin.js';
export default {
name: 'AgentMessage',
components: {
@ -77,7 +83,7 @@ export default {
UserMessage,
FileBubble,
},
mixins: [timeMixin, configMixin, messageMixin],
mixins: [timeMixin, configMixin, messageMixin, darkModeMixin],
props: {
message: {
type: Object,