DEV Community

Pooja DebRoy
Pooja DebRoy

Posted on

Project 1 Button Uptdate

For our Penguin button, we were able to implement the hover/focus and active states of the button, as well as the link tag. The buttons are also navigable via keyboard. We implemented the dark variation of the button.

Roadblocks we ran into:

We had an issue where the size of the area to activate the hover/focus state of the button was far larger than the penguin image we were using. We were able to fix this issue by changing the size pixel value under our host section of our get styles().

What we have learned:

How to implement dark variation of the button
Making the size of the hover/focus area the same as the size of the button
Implementing a hover/focus state

Next steps:

We working on creating the disabled state of the button as well as the support for an icon.

Link to my fork in the repo

Discussion (0)