.user-box(v-if="me")
.user-info.right(@click="toggleUserMenu()")
img.avatar(:src='me.avatar')
.username {{ me.fullName }}
i.fa.fa-chevron-down
user-dropdown(:visible="expandedUserMenu")
.notification-box.right
ul.icons
li(@click="toggleNotifications()", :class=" { active: notifications.length > 0 }")
i.fa.fa-bell-o
span {{ notifications.length }}
.ring
li(@click="toggleMessages()", :class=" { active: messages.length > 0 }")
i.fa.fa-envelope-o
span {{ messages.length }}
.ring
notifications-dropdown(:visible="expandedNotifications")
messages-dropdown(:visible="expandedMessages")