fix: small adjustments on the new header icons (#5043)

Some small UI adjustments to the new header icons.


![image](https://github.com/Unleash/unleash/assets/14320932/39f711dd-520b-4eb1-ac79-fefc6a79aaf7)

Co-authored-by: Nicolae <nicolae@getunleash.ai>

frontend/src/component/common/Notifications/Notifications.tsx

@@ -59,8 +59,8 @@ const StyledDotBox = styled(Box)(({ theme }) => ({
     width: '7px',
     height: '7px',
     position: 'absolute',
-    top: 7,
-    right: 4,
+    top: 11,
+    right: 11,
 }));
 
 const StyledHeaderBox = styled(Box)(() => ({

frontend/src/component/user/UserProfile/UserProfile.tsx

@@ -17,14 +17,10 @@ const StyledProfileContainer = styled('div')(({ theme }) => ({
 }));
 
 const StyledIconButton = styled(IconButton)(({ theme }) => ({
-    ...focusable(theme),
     ...flexRow,
     ...itemsCenter,
     color: 'inherit',
     padding: theme.spacing(1),
-    '&:hover': {
-        backgroundColor: 'transparent',
-    },
     '&:focus-visible': {
         outlineStyle: 'solid',
         outlineWidth: 2,