bug: Chat bubbles in Safari (macOS/iOS)

[dmythro]

What version of daisyUI are you using?

latest (website)

Describe your issue

Chat bubbles have this vertical divider between the tail and main bubble body:

On iOS it's more subtle, but still there. Especially with zoom.

In Chrome it looks good.

Also, is there an option to have this tail off?
Like in iMessage, the chat bubble tail is only shown on the last message.

What browsers are you seeing the problem on?

Safari, Safari iOS

Reproduction URL

https://daisyui.com/components/chat/

[NikarashiHatsu]

Didn't occur on my device, but there's definitely a slight divider while resizing.

2023-08-02.16-44-59.mp4

Edit, I guess this is a pixel-perfect issue, it may behaves differently on different devices. It actually hard to make sure it didn't have that vertical divider on each device. I tried to reproduce this issue by editing the ::before pseudo, yet, I'm still having this issue on different component position at the same page.

[dmythro]

Re-checked, looks like I have a clarification: it is an issue on external display in Safari only, and when zooming in. So, priority I guess is probably minor. A lot of devs use external displays with Macs though. Hope it helps!

EDIT: Also, visible (but not as much) on iOS 16.6:

[NikarashiHatsu]

There should be a better alternative such as using clip properties which I'm pretty sure would fix the issue. I'll try to reproduce this on my local machine, and if that works' I'll do a PR to fix this issue.