new notification fixes

view/js/main.js

@@ -365,11 +365,6 @@ $(function() {
 		return;
 	});
 
-	$('span[rel^="#"]').click(function(e){
-		manage_popup_menu(this, e);
-		return;
-	});
-
 	function manage_popup_menu(w,e) {
 		menu = $( $(w).attr('rel') );
 

view/theme/redbasic/js/redbasic.js

@@ -16,19 +16,27 @@ $(document).ready(function() {
 	}
 	$('#css3-calc').remove(); // Remove the test element
 
-	if($(window).width() > 767) {
+	if($(window).width() >= 767) {
 		$('#left_aside_wrapper').stick_in_parent({
-			offset_top: parseInt($('#region_1').css('padding-top')),
+			offset_top: parseInt($('aside').css('padding-top')),
 			parent: 'main',
 			spacer: '#left_aside_spacer'
 		});
+	}
+
+	if($(window).width() >= 1200) {
 		$('#right_aside_wrapper').stick_in_parent({
-			offset_top: parseInt($('#region_3').css('padding-top')),
+			offset_top: parseInt($('aside').css('padding-top')),
 			parent: 'main',
 			spacer: '#right_aside_spacer'
 		});
 	}
 
+
+	$('#notifications_wrapper.fs #notifications').stick_in_parent({
+		parent: '#notifications_wrapper'
+	});
+
 	$('#expand-aside').on('click', toggleAside);
 
 	$('section').on('click', function() {
@@ -46,6 +54,16 @@ $(document).ready(function() {
 		}
 	});
 
+
+	var right_aside_height = $('#rightt_aside_wrapper').height();
+
+	$('#right_aside_wrapper').on('click', function() {
+		if(right_aside_height != $('#right_aside_wrapper').height()) {
+			$(document.body).trigger("sticky_kit:recalc");
+			right_aside_height = $('#right_aside_wrapper').height();
+		}
+	});
+
 	$('.usermenu').click(function() {
 		if($('#navbar-collapse-1, #navbar-collapse-2').hasClass('show')){
 			$('#navbar-collapse-1, #navbar-collapse-2').removeClass('show');
@@ -64,14 +82,14 @@ $(document).ready(function() {
 		}
 	});
 
-	var notifications_parent = $('#notifications')[0].parentElement.id;
+	var notifications_parent = $('#notifications_wrapper')[0].parentElement.id;
 	$('#notifications-btn-1').click(function() {
-		if($('#notifications').hasClass('fs'))
+		if($('#notifications_wrapper').hasClass('fs'))
-			$('#notifications').prependTo('#' + notifications_parent);
+			$('#notifications_wrapper').prependTo('#' + notifications_parent);
 		else
-			$('#notifications').prependTo('body');
+			$('#notifications_wrapper').prependTo('section');
 
-		$('#notifications').toggleClass('fs');
+		$('#notifications_wrapper').toggleClass('fs');
 		if($('#navbar-collapse-2').hasClass('show')){
 			$('#navbar-collapse-2').removeClass('show');
 		}

view/tpl/notifications_widget.tpl

@@ -1,6 +1,6 @@
 <style>
 	.notification-content {
-		max-height: 70vh;
+		max-height: 60vh;
 		overflow: auto;
 	}
 
@@ -12,40 +12,45 @@
 		position: fixed;
 		top: 0px;
 		left: 0px;
-		padding: 4.5rem .5rem 0 .5rem;
+		padding: 4.5rem .5rem 1rem .5rem;
 		background-color: white;
 		width: 100%;
 		max-width: 100%;
-		height: 100vh;
+		height: 100%;
-		z-index: 1030;
+		z-index: 1020;
+		overflow: auto;
+	}
+
+	#notifications {
+		margin-bottom: 1rem;
 	}
 </style>
 
-
+<div id="notifications_wrapper">
-
+	<div id="notifications" class="navbar-nav" data-children=".nav-item">
-<div id="notifications" class="navbar-nav" data-children=".nav-item">
+		<div id="nav-notifications-template" rel="template">
-	<div id="nav-notifications-template" rel="template">
+			<a class="dropdown-item clearfix dropdown-notification {5}" href="{0}" title="{2} {3}">
-		<a class="dropdown-item clearfix dropdown-notification {5}" href="{0}" title="{2} {3}">
+				<img class="menu-img-3" data-src="{1}">
-			<img class="menu-img-3" data-src="{1}">
+				<span class="contactname">{2}</span>
-			<span class="contactname">{2}</span>
+				<span class="dropdown-sub-text">{3}<br>{4}</span>
-			<span class="dropdown-sub-text">{3}<br>{4}</span>
+			</a>
-		</a>
-	</div>
-	{{foreach $notifications as $notification}}
-	<div class="collapse {{$notification.type}}-button">
-		<a class="list-group-item" href="#nav-{{$notification.type}}-menu" title="{{$notification.title}}" data-toggle="collapse" data-parent="#notifications" rel="#nav-{{$notification.type}}-menu">
-			<i class="fa fa-fw fa-{{$notification.icon}}"></i> {{$notification.label}}
-			<span class="float-right badge badge-{{$notification.severity}} {{$notification.type}}-update"></span>
-		</a>
-		<div id="nav-{{$notification.type}}-menu" class="collapse notification-content" rel="{{$notification.type}}">
-			{{if $notification.viewall}}
-			<a class="dropdown-item" id="nav-{{$notification.type}}-see-all" href="{{$notification.viewall.url}}">{{$notification.viewall.label}}</a>
-			{{/if}}
-			{{if $notification.markall}}
-			<a class="dropdown-item" id="nav-{{$notification.type}}-mark-all" href="{{$notification.markall.url}}" onclick="markRead('{{$notification.type}}'); return false;">{{$notification.markall.label}}</a>
-			{{/if}}
-			{{$loading}}
 		</div>
+		{{foreach $notifications as $notification}}
+		<div class="collapse {{$notification.type}}-button">
+			<a class="list-group-item" href="#nav-{{$notification.type}}-menu" title="{{$notification.title}}" data-toggle="collapse" data-parent="#notifications" rel="#nav-{{$notification.type}}-menu">
+				<i class="fa fa-fw fa-{{$notification.icon}}"></i> {{$notification.label}}
+				<span class="float-right badge badge-{{$notification.severity}} {{$notification.type}}-update"></span>
+			</a>
+			<div id="nav-{{$notification.type}}-menu" class="collapse notification-content" rel="{{$notification.type}}">
+				{{if $notification.viewall}}
+				<a class="dropdown-item" id="nav-{{$notification.type}}-see-all" href="{{$notification.viewall.url}}">{{$notification.viewall.label}}</a>
+				{{/if}}
+				{{if $notification.markall}}
+				<a class="dropdown-item" id="nav-{{$notification.type}}-mark-all" href="{{$notification.markall.url}}" onclick="markRead('{{$notification.type}}'); return false;">{{$notification.markall.label}}</a>
+				{{/if}}
+				{{$loading}}
+			</div>
+		</div>
+		{{/foreach}}
 	</div>
-	{{/foreach}}
 </div>