Fixed reputation wrap issue and added hover color to left menu

In this 4th development contribution report I want to show two issues that I fixed for Busy.org website.

Reputation wrap issue:

Pull request: https://github.com/busyorg/busy/pull/1016
Fixes Issue: https://github.com/busyorg/busy/issues/842

Changes I made:

• made .UserHeader__user to have margin: 0 !important; on small screens. This margin has no relevance on small screens, since the text is center aligned and has no elements on the sides.
  decreased font size for .UserHeader__user__username to 28px on small screens

Observations:

The !important was necessary because some media queries were defined before normal style in UserHeader.less. Normally media queries are defined after the normal style(non-media). In the present case the normal style would override the media queries, therefore !important was needed.

Added hover color for left nav

Pull request:https://github.com/busyorg/busy/pull/1019
Issue: https://github.com/busyorg/busy/issues/950

Changes I made:

• the left menu (.Sidenav) link color changes on hover. @purple is set as color for .Sidenav>li>a:hover