-
Notifications
You must be signed in to change notification settings - Fork 5
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
Hackinrish/button #20
Conversation
hackinrish
commented
Oct 22, 2024
•
edited
Loading
edited
- Button that takes in a text prop and an onclick functon, function can be modified later for according use
- Closes Issue Create Button #8
src/app/page.tsx
Outdated
@@ -1,8 +1,6 @@ | |||
const Home = () => { | |||
return ( | |||
<div className="flex h-screen w-screen items-center justify-center"> |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Can you revert this change so it still says hello world
src/components/Button.tsx
Outdated
|
||
interface ButtonProps { | ||
text: string; | ||
link: string; |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
instead of passing in a link can you pass in an arrow function here. For example it can be handleSubmit: () => void
. Then this function should be called when the button component is clicked.
src/components/Button.tsx
Outdated
|
||
const Button = ({ text, link }: ButtonProps) => { | ||
return ( | ||
<div className="rounded-md bg-blue-900 px-8 py-2 font-serif text-[vw] text-white"> |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Instead of a div can we use the button component here. It's better for accessibility and makes more sense in this case.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Overall looks good just some small edits
src/components/Button.tsx
Outdated
return ( | ||
<button | ||
className="rounded-md bg-blue-900 px-8 py-2 font-serif text-[vw] text-white" | ||
onClick={() => onClick(text)} |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
onClick={() => onClick(text)} | |
onClick={onClick} |
src/components/Button.tsx
Outdated
|
||
interface ButtonProps { | ||
text: string; | ||
onClick: (params: string) => void; |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
remove the params from this function