apps/BareRTC
1
0
Fork 0
Code Issues 14 Pull Requests Packages Projects Releases Wiki Activity

Theme fix for emoji picker popup

Browse Source
This commit is contained in:
Noah 2024-04-06 16:59:23 -07:00
parent a0786b2fa9
commit 93c4e12680
2 changed files with 12 additions and 3 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
src/App.vue
View File

@ -4371,7 +4371,7 @@ export default {
label on the chat history panel --> label on the chat history panel -->
<div class="dropdown-content p-0"> <div class="dropdown-content p-0">
<EmojiPicker :native="true" :display-recent="true" :disable-skin-tones="true" <EmojiPicker :native="true" :display-recent="true" :disable-skin-tones="true"
theme="auto" @select="onSelectEmoji"> :theme="prefs.theme !== 'auto' ? prefs.theme : 'auto'" @select="onSelectEmoji">
</EmojiPicker> </EmojiPicker>
</div> </div>
</div> </div>

11
src/components/MessageBox.vue
View File

@ -1,5 +1,6 @@
<script> <script>
import EmojiPicker from 'vue3-emoji-picker'; import EmojiPicker from 'vue3-emoji-picker';
import LocalStorage from '../lib/LocalStorage';
import 'vue3-emoji-picker/css'; import 'vue3-emoji-picker/css';
export default { export default {
@ -81,7 +82,15 @@ export default {
// Compactify a message (remove paragraph breaks added by Markdown renderer) // Compactify a message (remove paragraph breaks added by Markdown renderer)
compactMessage() { compactMessage() {
return this.message.message.replace(/<\/p>\s*<p>/g, "<br><br>").replace(/<\/?p>/g, ""); return this.message.message.replace(/<\/p>\s*<p>/g, "<br><br>").replace(/<\/?p>/g, "");
},
emojiPickerTheme() {
let theme = LocalStorage.get('theme');
if (theme === 'light' || theme === 'dark') {
return theme;
} }
return 'auto';
},
}, },
methods: { methods: {
openProfile() { openProfile() {
@ -332,7 +341,7 @@ export default {
<!-- Emoji reactions menu --> <!-- Emoji reactions menu -->
<EmojiPicker v-if="showEmojiPicker" :native="true" :display-recent="true" :disable-skin-tones="true" <EmojiPicker v-if="showEmojiPicker" :native="true" :display-recent="true" :disable-skin-tones="true"
:additional-groups="customEmojiGroups" :group-names="{ frequently_used: 'Frequently Used' }" :additional-groups="customEmojiGroups" :group-names="{ frequently_used: 'Frequently Used' }"
theme="auto" @select="onSelectEmoji"></EmojiPicker> :theme="emojiPickerTheme" @select="onSelectEmoji"></EmojiPicker>
</div> </div>
</div> </div>
</div> </div>