Merge pull request #504 from tailwindcss/table-layout

Add table layout module

__tests__/fixtures/tailwind-output.css

@@ -4916,6 +4916,14 @@ table {
   stroke: currentColor;
 }
 
+.table-auto {
+  table-layout: auto;
+}
+
+.table-fixed {
+  table-layout: fixed;
+}
+
 .text-left {
   text-align: left;
 }
@@ -10477,6 +10485,14 @@ table {
     box-shadow: none;
   }
 
+  .sm\:table-auto {
+    table-layout: auto;
+  }
+
+  .sm\:table-fixed {
+    table-layout: fixed;
+  }
+
   .sm\:text-left {
     text-align: left;
   }
@@ -16039,6 +16055,14 @@ table {
     box-shadow: none;
   }
 
+  .md\:table-auto {
+    table-layout: auto;
+  }
+
+  .md\:table-fixed {
+    table-layout: fixed;
+  }
+
   .md\:text-left {
     text-align: left;
   }
@@ -21601,6 +21625,14 @@ table {
     box-shadow: none;
   }
 
+  .lg\:table-auto {
+    table-layout: auto;
+  }
+
+  .lg\:table-fixed {
+    table-layout: fixed;
+  }
+
   .lg\:text-left {
     text-align: left;
   }
@@ -27163,6 +27195,14 @@ table {
     box-shadow: none;
   }
 
+  .xl\:table-auto {
+    table-layout: auto;
+  }
+
+  .xl\:table-fixed {
+    table-layout: fixed;
+  }
+
   .xl\:text-left {
     text-align: left;
   }

defaultConfig.stub.js

@@ -896,6 +896,7 @@ module.exports = {
     shadows: ['responsive', 'hover', 'focus'],
     svgFill: [],
     svgStroke: [],
+    tableLayout: ['responsive'],
     textAlign: ['responsive'],
     textColors: ['responsive', 'hover', 'focus'],
     textSizes: ['responsive'],

src/generators/tableLayout.js

@@ -0,0 +1,8 @@
+import defineClasses from '../util/defineClasses'
+
+export default function() {
+  return defineClasses({
+    'table-auto': { 'table-layout': 'auto' },
+    'table-fixed': { 'table-layout': 'fixed' },
+  })
+}

src/utilityModules.js

@@ -34,6 +34,7 @@ import resize from './generators/resize'
 import shadows from './generators/shadows'
 import svgFill from './generators/svgFill'
 import svgStroke from './generators/svgStroke'
+import tableLayout from './generators/tableLayout'
 import textAlign from './generators/textAlign'
 import textColors from './generators/textColors'
 import textSizes from './generators/textSizes'
@@ -83,6 +84,7 @@ export default [
   { name: 'shadows', generator: shadows },
   { name: 'svgFill', generator: svgFill },
   { name: 'svgStroke', generator: svgStroke },
+  { name: 'tableLayout', generator: tableLayout },
   { name: 'textAlign', generator: textAlign },
   { name: 'textColors', generator: textColors },
   { name: 'textSizes', generator: textSizes },