frontend: Revamp UI components

[swaptr]

The following UI components need to be revamped. Note that we are using shadcn/ui and radix for the base components so we can support any first-class dependencies from there.

• [x] Responsive Navigation Bar
• [ ] Dropdown Menu
• [ ] Responsive Modals

[swaptr]

For the Dropdown Menu component, I have a design idea. Personally I like Google Gemini's dropdown menu component. The general design with spacing on top and bottom and the separator are what stand out to me. If someone has other ideas for a better component design please reach out here.

[anshikavashistha]

@swaptr I have opened a draft PR but one thing I want to discuss this drop down menu should be added to the UI or some other design should be preferred. Along with that ,Please share some relevant details regarding UI like some figma design which we are subjecting.

[swaptr]

Hello @anshikavashistha Thanks for your interest in working on this. The default dropdown menu component was borrowed from shadcn/ui and is available here: https://github.com/hyperledger-labs/aifaq/blob/dev/src/frontend/components/ui/dropdown-menu.tsx. I am looking for changes in the design of this component to have a more accessible design similar to the screenshot above. This will allow us to have a consistent design for dropdowns. We do not have a preferred design system here so you are free to experiment here.

[anshikavashistha]

Thank you, @swaptr, for letting me know.Now I am looking forward to this .

[anshikavashistha]

@swaptr PTAL