magicuidesign / magicui

UI Library for Design Engineers. Animated components and effects you can copy and paste into your apps. Free. Open Source.
https://magicui.design
MIT License
9.79k stars 384 forks source link

[button] - New Pulsating Button #48

Open dillionverma opened 4 months ago

dillionverma commented 4 months ago

beautiful button here 😍

https://github.com/magicuidesign/magicui/assets/16860528/17508677-6119-42ed-bd37-fb8ea361e30f

we should re-create this in react + typescript + tailwindcss :)

NoubissiViany commented 4 months ago

@dillionverma Please assign this task to me

dillionverma commented 4 months ago

how's progress on this @NoubissiViany ?

NoubissiViany commented 4 months ago

Having difficulty in installing pnpm in my machine

On Fri, May 31, 2024, 19:00 Dillion Verma @.***> wrote:

how's progress on this @NoubissiViany https://github.com/NoubissiViany ?

— Reply to this email directly, view it on GitHub https://github.com/magicuidesign/magicui/issues/48#issuecomment-2142737197, or unsubscribe https://github.com/notifications/unsubscribe-auth/AW3W7QGGQT77XJTUUFPPEEDZFC3FRAVCNFSM6AAAAABIG4SZBCVHI2DSMVQWIX3LMV43OSLTON2WKQ3PNVWWK3TUHMZDCNBSG4ZTOMJZG4 . You are receiving this because you were mentioned.Message ID: @.***>

shikhap04 commented 4 months ago

@dillionverma I would love to help if possible!

dillionverma commented 4 months ago

go for it @shikhap04 ill assign to you for now

dillionverma commented 4 months ago

let me know if you need help @NoubissiViany

shikhap04 commented 3 months ago

Hey @dillionverma, let me know if there needs to be any changes, otherwise I can make a PR.

https://github.com/magicuidesign/magicui/assets/116731555/ed1675e1-5557-44e4-b7f3-0e92d3046e73

dillionverma commented 3 months ago

Looking good!

Small thing I noticed is to make sure border radius is somehow same for the pulse and the button itself

This image should help but I'm not sure what the implmentation would look like without looking at code

image

Also the easing function looks a little bit off? Might need to play around with either linear or ease-out function to get that nice aesthetic ✨