- Maximum of 3 columns in "web" layout, with 360px fixed width columns, 40px gutters and excess padding left and right. - 2 columns in "tablet" layout, with variable size columns and 24px gutters. - 1 columns in "phone" layout, with 16px gutters.
21 lines
727 B
JavaScript
21 lines
727 B
JavaScript
'use strict';
|
|
|
|
(function() {
|
|
window.addEventListener('load', function() {
|
|
var INVISIBLE_WRAPPING_ELEMENT_CLASS = 'wrap-hack';
|
|
var INVISIBLE_WRAPPING_ELEMENT_COUNT = 3;
|
|
var columnLayouts = document.querySelectorAll('.column-layout');
|
|
|
|
for (var i = 0; i < columnLayouts.length; i++) {
|
|
var columnLayout = columnLayouts[i];
|
|
// Add some hidden elements to make sure everything aligns correctly. See
|
|
// CSS file for details.
|
|
for (var j = 0; j < INVISIBLE_WRAPPING_ELEMENT_COUNT; j++) {
|
|
var hiddenHackDiv = document.createElement('div');
|
|
hiddenHackDiv.classList.add(INVISIBLE_WRAPPING_ELEMENT_CLASS);
|
|
columnLayout.appendChild(hiddenHackDiv);
|
|
}
|
|
}
|
|
});
|
|
})();
|