search

t3dotgg / quickpic

Turn SVGs into high resolution PNGs in 2 clicks. Built because Theo was mad.
https://quickpic.t3.gg
MIT License
892 stars 177 forks source link

Added 'Make image a circle' toggle to RoundedTool & updated the border-radius-selector component. #68

Open JPerez00 opened 1 week ago

JPerez00 commented 1 week ago

A new feature to the RoundedTool that allows users to make images perfectly circular, regardless of their original aspect ratio. This is implemented via a new "Make image a circle" checkbox toggle.

wide-img-circle-disabled wide-img-circle-enabled

It’d be awesome to add X/Y controls to choose the crop spot, but that’s a bit out of my league. Also had to also update the border-radius-selector.tsx component to make it work.

pnpm run check

vercel[bot] commented 1 week ago

The latest updates on your projects. Learn more about Vercel for Git ↗︎

Name Status Preview Comments Updated (UTC)
quickpic ✅ Ready (Inspect) Visit Preview 💬 Add feedback Nov 13, 2024 2:51am
t3dotgg commented 1 week ago

A bit confusing ux-wise with the "circle" option being a checkbox (while also leaving the border-radius selected). I don't have an obvious answer but this isn't it. Might even be better to have it as a separate tool 🤔

JPerez00 commented 1 week ago

Thanks for the feedback, and sorry for the time wasted. Ok, so I replaced the circle checkbox with a "Shape" selector titled "Pick Your Shape" for dumb people like me lol.

https://github.com/user-attachments/assets/0671ce5d-e23f-4fb2-a4b6-3c2f2073c5a2

Ran the checks, no issues.

pnpm run check - updates

I thought about making it a separate tool, but it felt like extra bulk (files and folders, etc). Let me know if this works for you.