refactor(groups.tsx): make groups responsive for small and medium screen

[yagopajarino]

re #557

Description

Refactor the UX code to make the groups stack (My groups and All Credential Groups) responsive for small and medium screens.

Also refactors the search bar and add group button to fit them in small/medium screens

Does this introduce a breaking change?

• Yes
• No

[vercel]

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

Name	Status	Preview	Comments	Updated (UTC)
bandada-docs	✅ Ready (Inspect)	Visit Preview	💬 Add feedback	Dec 20, 2024 9:54pm
bandada-website	✅ Ready (Inspect)	Visit Preview	💬 Add feedback	Dec 20, 2024 9:54pm

[yagopajarino]

Hi @vplasencia PR for issue #557. Let me know what you think :)

Should look like this

[vplasencia]

Hey @yagopajarino! Thank you very much for this PR. I added some suggestions.

After the suggestions, it should look like:

Screen.Recording.2024-12-20.at.9.46.43.PM.mov

It's good to always test how the width changes on smaller screens (to try all possible smaller screens) by using the responsive option in Google Chrome, for example and also try how it would look on different devices with different dimensions.

[yagopajarino]

Hi @vplasencia ! Thanks for the feedback. Just made the changes following the suggestions

[vplasencia]

It looks great! Thank you very much! 💯

[gitpoap-bot]

Congrats, your important contribution to this open-source project has earned you a GitPOAP!

GitPOAP: 2024 Bandada Contributor:

Head to gitpoap.io & connect your GitHub account to mint!

Learn more about GitPOAPs here.