KumiSystems/Chatwoot
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity

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

Browse source 
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
Download patch file Download diff file Expand all files Collapse all files

17
app/javascript/widget/components/ChatHeaderExpanded.vue
View file

@ -1,5 +1,8 @@
<template>
<header class="header-expanded bg-white py-6 px-5 relative box-border w-full">
<header
class="header-expanded py-6 px-5 relative box-border w-full"
:class="$dm('bg-white', 'dark:bg-slate-900')"
>
<div
class="flex items-start"
:class="[avatarUrl ? 'justify-between' : 'justify-end']"
@ -8,21 +11,29 @@
<header-actions :show-popout-button="showPopoutButton" />
</div>
<h2
class="text-slate-900 mt-5 text-3xl mb-3 font-normal"
class=" mt-5 text-3xl mb-3 font-normal"
:class="$dm('text-slate-900', 'dark:text-slate-50')"
v-html="introHeading"
/>
<p class="text-lg text-black-700 leading-normal" v-html="introBody" />
<p
class="text-lg leading-normal"
:class="$dm('text-slate-700', 'dark:text-slate-200')"
v-html="introBody"
/>
</header>
</template>
<script>
import { mapGetters } from 'vuex';
import HeaderActions from './HeaderActions';
import darkModeMixin from 'widget/mixins/darkModeMixin.js';
export default {
name: 'ChatHeaderExpanded',
components: {
HeaderActions,
},
mixins: [darkModeMixin],
props: {
avatarUrl: {
type: String,