saadeghi / daisyui

๐ŸŒผ ๐ŸŒผ ๐ŸŒผ ๐ŸŒผ ๐ŸŒผ โ€ƒThe most popular, free and open-source Tailwind CSS component library
https://daisyui.com
MIT License
34.25k stars 1.31k forks source link

bug: btn-square and btn-circle rendered identical? #2771

Closed ChenaLee closed 10 months ago

ChenaLee commented 10 months ago

What version of daisyUI are you using?

v4.6.0

Which browsers are you seeing the problem on?

Chrome Version 120.0.6099.129

Reproduction URL

https://daisyui.com/components/button/

Describe your issue

On your website: https://daisyui.com/components/button/

Screen Shot 2024-01-17 at 10 27 53 PM

Are those two (btn-square, btn-circle) both supposed to look like that? Looks identical. Same happened when I tried to use btn-square.

github-actions[bot] commented 10 months ago

Thank you @ChenaLee 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 commented 10 months ago

This only happens for themes that have big border-radius (cupcake, valentine, forest and pastel)

btn-square is not about the square shape necessarily because button border radius changes based on themes. The button is a square but since the theme has a big border radius, it becomes a circle. It's an expected behavior.

When the border radius of button is big, all buttons gain round shape, including the square button. It would look weird if all buttons are rounded and then there's one of them with sharper edges.

Let me know if you have a question.