UI Enhancements: Add Branding, Fix Email Overflow, Improve Navigation, and Responsiveness

[himeshparashar]

Issue: UI Enhancements for Navigation and User Info Overflow

The dashboard page can be found at the /dashboard route.

---

Problem 1: Add Social Morph Logo and Name

• Description: The navigation bar currently lacks branding. Add the Social Morph logo and name above the navigation elements for better visual identity.

  Reference:
  

---

Problem 2: User Email Overflowing

• Description: The user email is overflowing in the navigation bar, making it look cluttered.

• Possible solutions:

  • Clip the email (e.g., user@g...).
  • Move the user information (with email) to the top-right corner to avoid overflow.

  Reference:
  

---

Problem 3: Active Tab Highlighting

• Description: When a tab is active in the navigation, it should be visually highlighted for better user experience and clarity.

  Reference:
  

---

Problem 4: Dashboard Minimization

• Description: Provide an option to minimize the dashboard for users who want more screen space when working with other components.

  Reference:
  

---

Problem 5: Responsiveness

• Description: The entire UI, especially the navigation bar and dashboard, should be fully responsive across different screen sizes and devices for optimal usability.

---

Acceptance Criteria:

1. Add the Social Morph logo and name above the navigation.
2. Fix the user email overflow by either clipping the email or moving it to the top-right corner.
3. Highlight the active tab in the navigation bar.
4. Add a dashboard minimization option.
5. Ensure the UI is fully responsive across different screen sizes.

[himeshparashar]

@swatified have a look at this if you wish to work on this ?

[career-yashaswee]

Would love to work this, please assign it to me.

[swatified]

@himeshparashar I could get this done. I'll make sure to make the changes without changing the current ui of the dashboard. I think the highlight thing is still working. We might need to create another issues so that links other than dashboard are also routed and can be redirected. Can you assign this to me for now?

[swatified]

@himeshparashar referring to problem 3. But will look into that too surely.

[himeshparashar]

@swatified try to implement this type of UI for problem 3

[himeshparashar]

@himeshparashar I could get this done. I'll make sure to make the changes without changing the current ui of the dashboard. I think the highlight thing is still working. We might need to create another issues so that links other than dashboard are also routed and can be redirected. Can you assign this to me for now?

for now you may create an empty page for other router

[himeshparashar]

@career-yashaswee, if you want, you can work on creating the projects page. I can create a new issue for that.

[swatified]

@himeshparashar sorry been super busy. Will get this done tomorrow cz it's last exam. Gemini work on Sunday and afterwards. I hope you understand.