Fix ws underlying in sidebar and footer.

[tobie]

Small fix to avoid underlying the whitespace between icons and related text when hovering.

[mmistakes]

Only drawback here is the icon is no longer linked... which I preferred. I think a better fix is adjusting the styling on the .fa class. What's going on is Font Awesome has some default styles to display icons as inline-block which removes the underline on hover. Simply doing:

.social-icons {
  .fa {
    display: initial;
  }
}

Underlines the entire link properly.

[tobie]

That's… frustratingly simpler. :D

[tobie]

Fixed it. LMK if that's what you had in mind.

[mmistakes]

Thanks for the PR @tobie!

[tobie]

This resurfaced as an issue. Not sure what happened.

[mmistakes]

If I remember correctly display: initial that originally fixed the underline issue was causing problems with the icon alignment... they weren't exactly centered.

As part of #341 I reverted it back. Not sure if there's another way to do it so the underline is correct and the alignment as well. Personally I'd prefer the alignment since you only see the small missing bit of underline on hover (something you'll never notice on a lot of devices eg: touch enabled ones).

Happy to accept another PR if there's a way to solve it for both.

[tobie]

I unfortunately don't have the CSS chops to fix this, so I guess I'll have to live with it. :)