notifications/list and notifications components

less/header.less

@@ -1,5 +1,5 @@
 #menu, .header {
-	#notif-list {
+	.notification-list {
 		overflow-x: hidden;
 		overflow-y: auto;
 		max-height: 250px;
@@ -74,7 +74,7 @@
 	}
 	
 	.chat-list {
-		#notif-list;
+		.notification-list;
 
 		li {
 			.pointer;

templates/header.tpl

@@ -60,7 +60,7 @@
 				[[global:header.notifications]]
 				<span class="counter" component="notifications/icon" data-content="0"></span>
 			</h3>
-			<ul class="menu-section-list"></ul>
+			<ul class="menu-section-list" component="notifications/list"></ul>
 		</section>
 
 		<section class="menu-section" data-section="chats">

templates/partials/menu.tpl

@@ -70,7 +70,7 @@
 						</a>
 						<ul class="dropdown-menu" aria-labelledby="notif_dropdown">
 							<li>
-								<ul id="notif-list">
+								<ul component="notifications/list" class="notification-list">
 									<li>
 										<a href="#"><i class="fa fa-refresh fa-spin"></i> [[global:notifications.loading]]</a>
 									</li>