Add tailwind to mainLayOut and NavBar

kavinda-100 commented 9 months ago

Purpose

The Navbar is not responsive when resizing the browser window. (https://github.com/sef-global/scholarx-frontend/issues/73)

Goals

add tailwindcss utility classes to MainLayOut and NavBar to fix the issue.

Approach

I had set the max width to the nav bar and added proper Tailwind classes according to the device breakpoints to achieve responsiveness for the NavBar.

Screenshots

https://github.com/sef-global/scholarx-frontend/issues/73#issuecomment-1904086007

Checklist

[x] This PR doesn't commit any keys, passwords, tokens, usernames, or other secrets.
[x] I have read and understood the development best practices guidelines ( http://bit.ly/sef-best-practices )
[x] My code follows the style guidelines of this project
[x] I have performed a self-review of my own code
[x] I have commented my code, particularly in hard-to-understand areas
[x] I have made corresponding changes to the documentation

Related PRs

## Test environment ## Learning

kavinda-100 commented 9 months ago

add tailwind branch

anjula-sack commented 9 months ago

@kavinda-100 There are some conflicts can you fix them?

anjula-sack commented 9 months ago

@kavinda-100 There are some conflicts can you fix them as well?

kavinda-100 commented 9 months ago

done the required changes

anjula-sack commented 9 months ago

@kavinda-100 The conflicts are still there

anjula-sack commented 6 months ago

Closing due to inactivity

sef-global / scholarx-frontend