Buttons and text overlapping. about teacherfund_next HOT 8 CLOSED

Definitely! This might be tough as it only can be reproduced on Tablet Width so definitely reach out with any questions.

Familiarizing yourself with Tachyons.io (our current styling method) and chakra-ui (our newly desired styling method) will be helpful as well!

from teacherfund_next.

Hi @rmit-s3722599-Minh-Le sorry for the late response!

We're trying to move to Chakra UI styling, so if it's a div you're trying to replace, you'd use the "Box" component from chakra, and then you can set minWidth as a prop on the Box component.

https://chakra-ui.com/box

if you let me know what pieces of code you're trying to edit i can advise further! thanks for contributing :)

from teacherfund_next.

Hi! I'm new to contributing, kind of my first time too and I want to take on this task if that's ok? ^^

from teacherfund_next.

Hi there!
If I want to add something like min-width: fit-content, but it doesn't have it in the Tachyons.io styling method, how can I add the style to the button?

from teacherfund_next.

Noo it's fine!!
Thanks for the response, and I'll look into that!! :)

from teacherfund_next.

Hi @joelwass

I'm nearly done, fixed the overlappings. Just having trouble trying to make the buttons the same height after some of the fixes and edits.

The buttons heights are relative the same in a normal width size browsing in like the computer:

But when you begin to shrink it, at a certain point, it'll look like this:

Thanks for helping me! :)

from teacherfund_next.

I think that's fine, for odd dimensions like that, before it hits the breakpoint of "small" screensize that's probably fine.

Send up a PR, thanks so much for working on this :)

from teacherfund_next.

Thank you for giving me the opportunity to help!! :)
There happens to be a merge conflict (edit: I fixed it I think!) though, i'll send the pull request!

from teacherfund_next.