TOPIC: Integration of new svg-smilieset EmojiOne

Hello,

is it an option for you to integrate a new smilie-set?

Since other extensions start to use the EmojiOne more frequently, it would be great to see it also be implemented in CComments.
I think many other users of CComment would appreciate it as well. Thank you!

Regards
Valentin

Hey Valentin,
I'll have to look at emojiOne - hearing it for the first time now. You can always add your own emoji sets by following the steps in the docs.

Regards,
Daniel

Thanks for the reply. Okay I'll try it.

I currently use them with another module (integrated in Shoutbox):
Imo they look great and there is a large variety of icons to choose from.

See here

I followed the instruction on how to insert custom smilies and added to my custom.css
.bbcode_smiley {height: 24px !important; width: 24px !important;}
in order to resize the svg.

I can insert the smilies, but in the comment-section the smilies are not displayed properly when I want to select them.
See here for instance

In addition I have a problem to resize the emoticons in the BE configuration. Tried different CSS rules like:

.bbcode_smiley, div#emoticons-emojione img {
max-height: 32px !important;
max-width: 32px !important;
}

Thank you.

Hey Valentin,

You are very close. I won't tell you the solution though Inspect the page with the inspector tool and create the correct CSS rule for the images. I don't know why you think that the above rule will work, but it doesn't target the ccomment styles at all. The div that holds the images has the class ccomment-emoticons . So target the img inside of div.ccomment-emoticons img ...

Cheers,
Daniel

Not, that difficult indeed.
Next, time have to look closer and try more - the right - rules.

05:02 early reply time.
Hope you had enough sleep to start the new week with freshness.

Cheers

Now the icons in the FE looks fine with:

div.ccomment-emoticons img {
height: 24px !important;
width: 24px !important;
}

But in the BE Configuration -> Layout -> Emoticons, the icons are taking up 100% of the available space.
I use browser inspectation tool and added to my custom.css

div#emoticons-emojione.emoticons img {
height: 24px !important;
width: 24px !important;
}
But the icons still showing up in full size.



Regards