Hover the button on sidebar

[thomasbnt]

Describe the bug
The hover of the button in the sidebar is a little under pressure .

Link to the post of example

To Reproduce
Hover the button.

Expected behavior
No bug with the focus and hover.

Screenshots

Desktop (please complete the following information):

• OS: Ubuntu 16.04
• Browser : Chrome
• Version : Version 71.0.3578.98 (Official Build) (64 bits)

[rhymes]

info for who might take this one: doesn't happen on Firefox 65 in macOS

[Link2Twenty]

As a general rule animating margin and padding is a bad idea.

@rhymes I think it might actually be the screen resolution that's making the difference.

This code is causing the problem.
https://github.com/thepracticaldev/dev.to/blob/9ea53d5669ce17b105aa5adc39f4a6871bdafd3a/app/assets/stylesheets/sticky-nav.scss#L167-L189

I would propose this change

a.primary-sticky-nav-org-cta-link{
  display: inline-block;
  font-size:1.25em;
  border:0px;
  border-radius:100px;
  padding: 6px 38px;
  margin-top: 20px;
  background: white;
  color: $black;
  font-family: $helvetica-condensed;
  font-weight: bold;
  text-align: center;
  font-stretch: condensed;
  box-shadow: $light-shadow;
  margin-bottom: 5px;
  transform: scale(0.99) translateY(0px);
  transition: transform 150ms cubic-bezier(0.4, 0.0, 0.2, 1);
  &:hover {
    box-shadow: $dark-shadow;
    transform: scale(1) translateY(-1px);
  }
}

[thomasbnt]

Very nice @Link2Twenty 👍

[shraddhaag]

Hi! I would like to take this up :)

[webdevike]

I just checked this bug on chrome and it seems to be working. Has this been resolved?

[maestromac]

Thanks for pointing that out @ikey2244 . I can't reproduce it either on Chrome or on Firefox.

Assume resolved. Please let us know if otherwise!