Adds fixed-width grid

src/definitions/collections/grid.less

@@ -163,14 +163,16 @@
 @media only screen and (max-width: (@largestMobileScreen)) {
   .ui.page.grid {
     width: @mobileWidth;
-    padding-left: 0em;
-    padding-right: 0em;
+    padding-left: @mobileGutter;
+    padding-right: @mobileGutter;
     margin: 0em;
   }
 }
 @media only screen and (min-width: @tabletBreakpoint) {
   .ui.page.grid {
     width: @tabletWidth;
+    margin-left: @tabletMargin;
+    margin-right: @tabletMargin;
     padding-left: @tabletGutter;
     padding-right: @tabletGutter;
   }
@@ -178,6 +180,8 @@
 @media only screen and (min-width: @computerBreakpoint) {
   .ui.page.grid {
     width: @computerWidth;
+    margin-left: @computerMargin;
+    margin-right: @computerMargin;
     padding-left: @computerGutter;
     padding-right: @computerGutter;
   }
@@ -185,6 +189,8 @@
 @media only screen and (min-width: @largeMonitorBreakpoint) {
   .ui.page.grid {
     width: @largeMonitorWidth;
+    margin-left: @largeMonitorMargin;
+    margin-right: @largeMonitorMargin;
     padding-left: @largeMonitorGutter;
     padding-right: @largeMonitorGutter;
   }
@@ -192,6 +198,8 @@
 @media only screen and (min-width: @widescreenMonitorBreakpoint) {
   .ui.page.grid {
     width: @widescreenMonitorWidth;
+    margin-left: @widescreenMargin;
+    margin-right: @widescreenMargin;
     padding-left: @widescreenMonitorGutter;
     padding-right: @widescreenMonitorGutter;
   }

src/definitions/modules/dropdown.js

@@ -1324,7 +1324,10 @@ $.fn.dropdown = function(parameters) {
 
 $.fn.dropdown.settings = {
 
-  /* Behavior */
+  debug          : false,
+  verbose        : true,
+  performance    : true,
+
   on             : 'click',
   action         : 'activate',
 
@@ -1342,18 +1345,16 @@ $.fn.dropdown.settings = {
   duration   : 250,
 
   /* Callbacks */
+
   onChange   : function(value, text){},
   onShow     : function(){},
   onHide     : function(){},
 
   /* Component */
+
   name           : 'Dropdown',
   namespace      : 'dropdown',
 
-  debug          : true,
-  verbose        : true,
-  performance    : true,
-
   error   : {
     action     : 'You called a dropdown action that was not defined',
     method     : 'The method you called is not defined.',

src/themes/default/collections/grid.variables

@@ -18,7 +18,10 @@
 
 @gutterWidth: 2rem;
 @rowSpacing: 2rem;
+
 @tableWidth: ~"calc(100% + "@gutterWidth~")";
+@relaxedTableWidth: ~"calc(100% + "@relaxedGutterWidth~")";
+@veryRelaxedTableWidth: ~"calc(100% + "@veryRelaxedGutterWidth~")";
 
 @columnMaxImageWidth: 100%;
 
@@ -32,17 +35,23 @@
 
 /* Column Gutters */
 @mobileWidth: auto;
+@mobileMargin: 0em;
+@mobileGutter: 0em;
 
 @tabletWidth: auto;
+@tabletMargin: 0em;
 @tabletGutter: 8%;
 
 @computerWidth: auto;
+@computerMargin: 0em;
 @computerGutter: 13%;
 
 @largeMonitorWidth: auto;
+@largeMonitorMargin: 0em;
 @largeMonitorGutter: 18%;
 
 @widescreenMonitorWidth: auto;
+@widescreenMargin: 0em;
 @widescreenMonitorGutter: 23%;
 
 
@@ -53,27 +62,15 @@
 @relaxedGutterWidth: 3rem;
 @veryRelaxedGutterWidth: 5rem;
 
-@relaxedTableWidth: ~"calc(100% + "@relaxedGutterWidth~")";
-@veryRelaxedTableWidth: ~"calc(100% + "@veryRelaxedGutterWidth~")";
-
-
 /*--------------
      Divided
 ---------------*/
 
-@dividedBorder:
-  -1px 0px 0px 0px rgba(0, 0, 0, 0.1)
-;
-@verticallyDividedBorder:
-  0px -1px 0px 0px rgba(0, 0, 0, 0.1)
-;
-
-@dividedInvertedBorder:
-  -1px 0px 0px 0px rgba(255, 255, 255, 0.15)
-;
-@verticallyDividedInvertedBorder:
-  0px -1px 0px 0px rgba(255, 255, 255, 0.15)
-;
+@dividedBorder: -1px 0px 0px 0px rgba(0, 0, 0, 0.1);
+@verticallyDividedBorder: 0px -1px 0px 0px rgba(0, 0, 0, 0.1);
+
+@dividedInvertedBorder: -1px 0px 0px 0px rgba(255, 255, 255, 0.15);
+@verticallyDividedInvertedBorder: 0px -1px 0px 0px rgba(255, 255, 255, 0.15);
 
 /*--------------
     Celled

src/themes/fixed-width/collections/grid.overrides

@@ -0,0 +1,3 @@
+/*******************************
+           Overrides
+*******************************/

src/themes/fixed-width/collections/grid.variables

@@ -0,0 +1,25 @@
+/* Fixed Page Grid */
+
+@mobileWidth: auto;
+@mobileMargin: 0em;
+@mobileGutter: 0em;
+
+@tabletWidth: auto;
+@tabletMargin: 0em;
+@tabletGutter: 8%;
+
+@computerWidth: 960px;
+@computerMargin: auto;
+@computerGutter: 0;
+
+@largeMonitorWidth: 1180px;
+@largeMonitorMargin: auto;
+@largeMonitorGutter: 0;
+
+@widescreenMonitorWidth: 1300px;
+@widescreenMargin: auto;
+@widescreenMonitorGutter: 0;
+
+@tableWidth: '';
+@relaxedTableWidth: '';
+@veryRelaxedTableWidth: '';