Julian/phpbb_board3-portal_tlw
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

[ticket/232] Correctly align right column under left column in mobile view

Browse Source 
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
This commit is contained in:
Marc Alexander
2014-04-06 21:48:15 +02:00
parent 42a34c2ea6
commit 2390fd8432
2 changed files with 41 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

39
styles/prosilver/template/portal/portal.js Normal file
View File

@@ -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

2
styles/prosilver/template/portal/portal_body.html
View File

@@ -112,4 +112,6 @@
<!--// board3 Portal by www.board3.de //--> <!--// 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> <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 --> <!-- INCLUDE overall_footer.html -->