Make the "Become a Mentor" button responsive. #72
Conversation
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
anjula-sack
requested changes
Jan 13, 2024
| }; | ||
|
|
||
| const handleMentorRegistration = (): void => { | ||
| console.log('Clicked'); |
There was a problem hiding this comment.
Suggested change
| console.log('Clicked'); |
| @@ -18,6 +24,11 @@ interface MenuDrawerProps { | |||
| } | |||
|
|
|||
| const MenuDrawer: React.FC<MenuDrawerProps> = ({ openMenu, setOpenMenu }) => { | |||
| const [isLoginModalVisible, setIsLoginModalVisible] = useState(false); | |||
There was a problem hiding this comment.
We don't need it use openMenu, setOpenMenu
There was a problem hiding this comment.
Screencast_20240114_003851.webm
Fixed that issue :)
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
Purpose
The purpose of this PR is to fix #71
Purpose
The purpose of this PR is to make the "Become a Mentor" button responsive.
Goals
This PR makes the "Become a Mentor" button responsive using Tailwind CSS. It also attempts to fix an issue where the application does not navigate to the
/mentor-registrationroute when the button is clicked in mobile view.Approach
I updated the
handleMentorRegistrationfunction in theMenuDrawer.tsxfile to navigate to the/mentor-registrationroute when the "Become a Mentor" button is clicked. However, this does not seem to be working as expected on mobile devices. I would appreciate if someone could look into this.Screenshots
Screencast_20240113_161026.webm
Checklist
Related PRs
N/A
Test environment
OS - Fedora Linux 39 (KDE Plasma) x86_64
NodeJS - 20.10.0
Learning
I learned about the importance of making UI elements responsive to ensure a good user experience on all devices. I also learned about the
navigatefunction and how it can be used to programmatically navigate to different routes in a React application.