diff --git a/docs/assets/bootstrap.zip b/docs/assets/bootstrap.zip index 21df15cefa873548d274acc4d2c4abb09818e1af..cb200386a733e39d239b41a1f123396fb41b9616 100644 Binary files a/docs/assets/bootstrap.zip and b/docs/assets/bootstrap.zip differ diff --git a/less/grid.less b/less/grid.less index 4493d0b9525d904630ab7748bd8af3cd63c3df87..2ef767a4a7374c4fdc9f1afc8fafe0d8e561080d 100644 --- a/less/grid.less +++ b/less/grid.less @@ -2,31 +2,6 @@ // ----------- -// Default grid sizing -// ------------------- -@gridColumns: 12; -@gridColumnWidth: 60px; -@gridGutterWidth: 20px; - -@gridRowWidth: (@gridColumns * @gridColumnWidth) + (@gridGutterWidth * (@gridColumns - 1)); -@gridTotalWidth: @gridRowWidth; - - -// Columns and offseting mixins -// ---------------------------- -.columns(@columns: 1) { - //width: (@gridColumnWidth * @columns) + (@gridGutterWidth * (@columns - 1)); - width: @gridTotalWidth * ((((@gridGutterWidth+@gridColumnWidth)*@columns)-@gridGutterWidth)/@gridRowWidth); -} -.offset(@columns: 1) { - margin-left: (@gridColumnWidth * @columns) + (@gridGutterWidth * (@columns - 1)) + (@gridGutterWidth * 2); -} -// Necessary grid styles for every column to make them appear next to each other horizontally -.gridColumn() { - float: left; - margin-left: @gridGutterWidth; -} - // Grid rows and columns // --------------------- .row { diff --git a/less/mixins.less b/less/mixins.less index 2d0e2d4c088bc12201c259d6a85dd9da71b2c7cb..cba2670db1db6fd80f75a824ae71a49fc1eae821 100644 --- a/less/mixins.less +++ b/less/mixins.less @@ -139,6 +139,21 @@ .clearfix(); } +// Columns and offseting mixins +// ---------------------------- +.columns(@columns: 1) { + //width: (@gridColumnWidth * @columns) + (@gridGutterWidth * (@columns - 1)); + width: @gridTotalWidth * ((((@gridGutterWidth+@gridColumnWidth)*@columns)-@gridGutterWidth)/@gridRowWidth); +} +.offset(@columns: 1) { + margin-left: (@gridColumnWidth * @columns) + (@gridGutterWidth * (@columns - 1)) + (@gridGutterWidth * 2); +} +// Necessary grid styles for every column to make them appear next to each other horizontally +.gridColumn() { + float: left; + margin-left: @gridGutterWidth; +} + // CSS3 PROPERTIES diff --git a/less/variables.less b/less/variables.less index c1e21978c35b54ccebaafb4ad55532ac3aff2f65..f09a88cdb3d9bd40b8de5b8286ff40b56b3b5b57 100644 --- a/less/variables.less +++ b/less/variables.less @@ -40,6 +40,17 @@ +// GRID SYSTEM VARIABLES +// -------------------------------------------------- + +@gridColumns: 12; +@gridColumnWidth: 60px; +@gridGutterWidth: 20px; +@gridRowWidth: (@gridColumns * @gridColumnWidth) + (@gridGutterWidth * (@gridColumns - 1)); +@gridTotalWidth: @gridRowWidth; + + + // COMPONENT VARIABLES // --------------------------------------------------