emojiPicker.scss

TLDR

This file is a SCSS file that contains the styling for the EmojiPicker widget.

Classes

.EmojiPicker

This class represents the EmojiPicker widget. The styles defined within this class apply to the overall EmojiPicker component.

.emoji-mart

This class represents the EmojiMart component, which is a dependency of the EmojiPicker widget. The styles defined within this class modify the appearance of the EmojiMart component.

.emoji-mart-bar

This class modifies the appearance of the EmojiMart toolbar.

.emoji-mart-search

This class modifies the appearance of the EmojiMart search input field.

.emoji-mart-category-label

This class modifies the appearance of the EmojiMart category labels.

.emoji-mart-search-icon

This class modifies the appearance of the EmojiMart search icon.

.EmojiPicker {
    .emoji-mart {
        color: rgb(var(--center-channel-color-rgb));
        background: rgb(var(--center-channel-bg-rgb));
        border-color: rgba(var(--center-channel-color-rgb), 0.16);

        .emoji-mart-bar {
            border: 0 solid rgba(var(--center-channel-color-rgb), 0.16);
            border-bottom-width: 1px;
        }

        .emoji-mart-search input {
            border: 1px solid rgba(var(--center-channel-color-rgb), 0.16);
        }

        .emoji-mart-category-label span {
            background: rgb(var(--center-channel-bg-rgb));
        }

        .emoji-mart-search-icon svg {
            fill: rgb(var(--center-channel-color-rgb));
        }
    }
}