From 2390fd8432b7e727fe0d6e953340ad6f3dc4ab16 Mon Sep 17 00:00:00 2001
From: Marc Alexander <admin@m-a-styles.de>
Date: Sun, 6 Apr 2014 21:48:15 +0200
Subject: [PATCH] [ticket/232] Correctly align right column under left column
 in mobile view

Javascript code will make sure that the right column is nicely aligned right
below the left column if the screen width is not enough for 3 columns.

B3P-232
---
 styles/prosilver/template/portal/portal.js    | 39 +++++++++++++++++++
 .../template/portal/portal_body.html          |  2 +
 2 files changed, 41 insertions(+)
 create mode 100644 styles/prosilver/template/portal/portal.js

diff --git a/styles/prosilver/template/portal/portal.js b/styles/prosilver/template/portal/portal.js
new file mode 100644
index 00000000..1cb65b26
--- /dev/null
+++ b/styles/prosilver/template/portal/portal.js
@@ -0,0 +1,39 @@
+/**
+*
+* @package Board3 Portal v2.1 - javascript code
+* @copyright (c) 2014 Board3 Group ( www.board3.de )
+* @license http://opensource.org/licenses/gpl-2.0.php GNU General Public License v2
+*
+*/
+
+(function($) {  // Avoid conflicts with other libraries
+
+"use strict";
+
+/**
+ * Correctly align the right column underneath the left column.
+ * This will make sure that the right column doesn't start before the end of
+ * the center column but rather right after the last module of the left column.
+ */
+phpbb.b3p_fix_right_column_margin = function() {
+	var width = $(window).width();
+
+	if (width <= 700) {
+		// Get height of left and center column
+		var center_height = $('#portal-center').outerHeight();
+		var left_height = $('#portal-left').outerHeight();
+
+		$('#portal-right').css('margin-top', -(center_height - left_height) + 'px');
+	} else {
+		$('#portal-right').css('margin-top', '0px');
+	}
+};
+
+$(document).ready(function() {
+	phpbb.b3p_fix_right_column_margin();
+	$(window).resize(function() {
+		phpbb.b3p_fix_right_column_margin();
+	});
+});
+
+})(jQuery); // Avoid conflicts with other libraries
diff --git a/styles/prosilver/template/portal/portal_body.html b/styles/prosilver/template/portal/portal_body.html
index 67bfb358..392eddde 100644
--- a/styles/prosilver/template/portal/portal_body.html
+++ b/styles/prosilver/template/portal/portal_body.html
@@ -112,4 +112,6 @@
 <!--// board3 Portal by www.board3.de //-->
 <div class="copyright">Powered by <a href="http://www.board3.de/">Board3 Portal</a> &copy; 2009 - 2013 Board3 Group</div>
 
+<!-- INCLUDEJS portal/portal.js -->
+
 <!-- INCLUDE overall_footer.html -->