1 files changed, 44 insertions, 5 deletions

diff --git a/view/theme/redbasic/js/redbasic.js b/view/theme/redbasic/js/redbasic.js
index c5f74db3f..3ff0c43ae 100644
--- a/view/theme/redbasic/js/redbasic.js
+++ b/view/theme/redbasic/js/redbasic.js
@@ -8,7 +8,7 @@ $(document).ready(function() {
 	if( $('#css3-calc').width() == 10) {
 		$(window).resize(function() {
 			if($(window).width() < 767) {
-				$('main').css('width', $(window).width() + 287 );
+				$('main').css('width', $(window).width() + $('aside').outerWidth() );
 			} else {
 				$('main').css('width', '100%' );
 			}
@@ -16,12 +16,32 @@ $(document).ready(function() {
 	}
 	$('#css3-calc').remove(); // Remove the test element
 
-	$('#expand-aside').click(function() {
-		$('#expand-aside-icon').toggleClass('fa-arrow-circle-right').toggleClass('fa-arrow-circle-left');
-		$('main').toggleClass('region_1-on');
+	if($(window).width() > 767) {
+		$('#left_aside_wrapper').stick_in_parent({
+			offset_top: $('nav').outerHeight(true),
+			parent: '#region_1',
+			spacer: '#left_aside_spacer'
+		});
+	}
+
+	$('#expand-aside').on('click', toggleAside);
+
+	$('section').on('click', function() {
+		if($('main').hasClass('region_1-on')){
+			toggleAside();
+		}
 	});
 
-	if($('aside').length && $('aside').html().length === 0) {
+	var left_aside_height = $('#left_aside_wrapper').height();
+
+	$('#left_aside_wrapper').on('click', function() {
+		if(left_aside_height != $('#left_aside_wrapper').height()) {
+			$(document.body).trigger("sticky_kit:recalc");
+			left_aside_height = $('#left_aside_wrapper').height();
+		}
+	});
+
+	if($('#left_aside_wrapper').length && $('#left_aside_wrapper').html().length === 0) {
 		$('#expand-aside').hide();
 	}
 
@@ -72,5 +92,24 @@ function makeFullScreen(full) {
 		$('#tabs-collapse-1').css({'visibility': ''});
 		$('#inline-btn').hide();
 		$('main').css({'transition': ''});
+		$(document.body).trigger("sticky_kit:recalc");
+	}
+}
+
+function toggleAside() {
+	$('#expand-aside-icon').toggleClass('fa-arrow-circle-right').toggleClass('fa-arrow-circle-left');
+	if($('main').hasClass('region_1-on')){
+		$('main').removeClass('region_1-on')
+		$('#overlay').remove();
+		$('#left_aside_wrapper').trigger("sticky_kit:detach");
+	}
+	else {
+		$('main').addClass('region_1-on')
+		$('<div id="overlay"></div>').appendTo('section');
+		$('#left_aside_wrapper').stick_in_parent({
+			offset_top: $('nav').outerHeight(true) - 10,
+			parent: '#region_1',
+			spacer: '#left_aside_spacer'
+		});
 	}
 }