bug: Icon Mask

[zhuozhiyongde]

What version of daisyUI are you using?

No response

Which browsers are you seeing the problem on?

Chrome, Safari

Reproduction URL

https://arthals.ink/

Describe your issue

The Icon on the front page now has a Bezier Curve SVG Mask, but there seems to be a problem with this Mask:

data:image/svg+xml,%3csvg%20width='200'%20height='200'%20xmlns='http://www.w3.org/2000/svg'%3e%3cpath%20d='M100%200C20%200%200%2020%200%20100s20%20100%20100%20100%20100-20%20100-100S180%200%20100%200Z'/%3e%3c/svg%3e

You can see that there is a gap here, which is reflected in the actual graphics and forms jagged edges:

Normal size:

After zooming in:

[github-actions]

Thank you @zhuozhiyongde for reporting issues. It helps daisyUI a lot 💚
I'll be working on issues one by one. I will help with this one as soon as a I find a solution.
In the meantime providing more details and reproduction links would be helpful.

[saadeghi]

You can see that there is a gap here, which is reflected in the actual graphics and forms jagged edges:

Normal size:

After zooming in:

I think there's a problem with these images. I can't see them. Can you upload the images again?

https://arthals.ink/

Also, I don't see the issue in this page. Where is the issue?

[zhuozhiyongde]

You can see that there are jagged edges here.

@saadeghi

[zhuozhiyongde]

The bug is more obvious on the big screen.

[zhuozhiyongde]

You may think that this gap will not appear on small screens, but in fact it does, and it will make the edges look rough.

[saadeghi]

I don't see the issue…

This is Chrome on MacOS

This is Safari on MacOS

There's no issue on the SVG shape. It's a perfect squircle I carefully made myself. Has no edges or anything.

I also made a Tailwind Play page for reproduction but there's no issue there as well:
https://play.tailwindcss.com/H8VSyRK4js

I assume this must be an issue of rendering, coming from either the browser or the OS graphic settings.
Make sure the browsers are updated.
Also, are you using a non standard setup, like a secondary monitor with a weird resolution or a non-standard HDMI cable or a custom graphic driver or something like that? because they can affect the graphic rendering performance.

I can assure you this is not a bug from daisyUI but I'm not sure if I can help with your case.

Let me know if you have a question.

[zhuozhiyongde]

I use macOS Ventura and have tested on the latest versions of Arc (based on Chromium 123.0.6312.123). However, it does work well on Safari and Chrome's latest version (123.0.6312.124 arm64).

I think it may be resolved after Arc updates its core. Thx!

@saadeghi