Moving Notifications to Nav Bar

[Kereudio]

Hi there! Hopefully this is the right place since it's a code request~

I currently have a floating nav bar, original code here, however because it stays at the top, the notification bubble gets cut off like so:


I was wondering if I could get a code that gets rid of that bubble entirely and instead adds text next to "Profile" that says something like "(1 new notification)" when there are new notifs. Maybe have it say 0 when there are none if that'd be easier?

Anyway, any help is appreciated! Thank you in advance!!

[Pearson]

Hi Kereudio,
This thread describes disabling the bubble and changing the background: support.proboards.com/thread/502112/notification-bubble-customisation

[Lynx]

You can also make the notification bubble point down. We have our navbar fixed at the top and this makes the notification bubbles point down so you can still see them:


/* Nav Bar Notification Bubbles Down, from Tumbleweed on PBS */

#navigation-menu div.tip-holder {
position: absolute;
top: 30px;
right:1px;
display: inline-block;
}
#navigation-menu div.tip-holder div.tip-number {
padding: 3px 7px 2px 7px;
background-color: #ffffff;
border-radius: 5px;
-moz-border-radius: 5px;
-webkit-border-radius: 5px;
font: 0.8em "Trebuchet MS",Verdana,Arial;
line-height: .8em;
text-shadow: none;
box-shadow: 2px 2px 2px #333333;
-moz-box-shadow: 2px 2px 2px #333333;
-webkit-box-shadow: 2px 2px 2px #333333;
height: .8em;
color: #000000;
}
#navigation-menu div.tip-holder span.tip {
border-top: 4px solid transparent;
border-left: 4px solid #ffffff;
border-right: 4px solid transparent;
position: absolute; top:-4px;
left:4px;
}