Oversized emojis

[Bullseye!]

Ok I updated from 3.1.10 to 3.2, I had several issues in doing it, firstly the update link in the ACP didn't work, so I had to direct it to the update page manually, then it said it was updated, but I looked it was still on 3.1.10, I updated my php version the update then worked, but my style was wrecked, luckily I had made a backup of it, so I restored it, the style was working once again, all seemed ok until I went to try the emojis out, they appear normal size in the text box but as soon as it's previewed or submitted, the emoji takes up the whole area..

Here's a link to the thread where the emoji is posted:

http://www.bullbreedforum.net/viewtopic ... 295#p15002

& if you want to login I have created a test account:

Username: Test

Password: password

Thanks in advance.


~John~

[JoshyPHP]

You need a CSS rule for it. This is from prosilver:

Code: Select all

.emoji {
	min-height: 18px;
	min-width: 18px;
	height: 1em;
	width: 1em;
}

[Mick]

If you look at the image information as it's displayed you'll see it says:

Dimensions: 0px × 0px (scaled to 631px × 631px)

Whereas others I've checked are:

Dimension: 0px × 0px (scaled to 18px × 18px)

I'd be interested myself to know what's going on there.

[Bullseye!]

You need a CSS rule for it. This is from prosilver:

Code: Select all

.emoji {
	min-height: 18px;
	min-width: 18px;
	height: 1em;
	width: 1em;
}

Which file do I need to add it to?

[JoshyPHP]

It's in prosilver's common.css, which you have apparently overwritten on your board? I guess you can put it there.

[Bullseye!]

Ok thankyou, I'll give it a shot & let you know how I get on..

[Bullseye!]

It's in prosilver's common.css, which you have apparently overwritten on your board? I guess you can put it there.

It worked! You're a hero!

[P_I]

They are definitely oversized in print view, as shown in the print view of this topic - viewtopic.php?f=556&t=2400851&view=print.

Filed as [PHPBB3-15083] emoji's in print view are not size constrained.

Workaround, copy from styles/prosilver/theme/common.css the following:

Code: Select all

.emoji {
    min-height: 18px;
    min-width: 18px;
    height: 1em;
    width: 1em;
}

and paste into styles/prosilver/theme/print.css.

[Lady_G]

I confirm the problem, but I needed to modify your work-around. Inspection of my localhost test web page suggested to include smilies. This works for me:

Code: Select all

.emoji, .smilies {
	min-height: 18px;
	min-width: 18px;
	height: 1em;
	width: 1em;
}

Update: Adding debug info-

My test posts used a combination of smilies and emojis. Maybe there's some interaction as the test page shows both classes:

Code: Select all

<img alt="👹" class="emoji smilies" draggable="false" src="//cdn.jsdelivr.net/emojione/assets/svg/1f479.svg">

[Raul [ThE KuKa]]

They are definitely oversized in print view, as shown in the print view of this topic - viewtopic.php?f=556&t=2400851&view=print.

Filed as [PHPBB3-15083] emoji's in print view are not size constrained.

Workaround, copy from styles/prosilver/theme/common.css the following:

Code: Select all

.emoji {
    min-height: 18px;
    min-width: 18px;
    height: 1em;
    width: 1em;
}

and paste into styles/prosilver/theme/print.css.

Yes...

Other example, you can use emoji for forum description, and display "giant" Emoji on Forum edit...
Add this code to admin.css file, and solved.

P_I it is possible to add this info, to this report on tracker please?

[Raul [ThE KuKa]]

P_I it is possible to add this info, to this report on tracker please?

I already mentioned it in the tracker.

[P_I]

Thanks. I've update the report subject now [PHPBB3-15083] emoji's not always size constrained

[Raul [ThE KuKa]]

Thanks, now is perfect "subject".