Supportcontainer padding as string; support for Tailwind 1 default container padding syntax

Author: egrossnickle

CHANGELOG.md

@@ -1,8 +1,12 @@
 # Changelog
 All notable changes to this project will be documented in this file.
 
-The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.0.0/),
-and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0.html).
+The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.0.0/), and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0.html).
+
+## [0.1.2] - 2021-03-02
+
+* Support container padding as string
+* Support Tailwind 1 default container padding syntax where "default" key is lowercase
 
 ## [0.1.1] - 2021-03-01
 

package.json

@@ -1,6 +1,6 @@
 {
   "name": "tailwindcss-container-bleed",
-  "version": "0.1.1",
+  "version": "0.1.2",
   "main": "src/index.js",
   "description": "Tailwind CSS plugin to generate container bleed utilities",
   "author": "Bust Out",
@@ -19,7 +19,7 @@
     "tailwindcss-plugin"
   ],
   "scripts": {
-    "build:demo": "node scripts/build-demo.js"
+    "build:docs": "node scripts/build-docs.js"
   },
   "peerDependencies": {
     "tailwindcss": ">=1.3.0"

scripts/build-demo.js renamed to scripts/build-docs.js

@@ -3,7 +3,7 @@ const postcss = require('postcss')
 const tailwind = require('tailwindcss')
 const CleanCSS = require('clean-css')
 
-function buildDemoFile(filename) {
+function buildDocsFile(filename) {
   return postcss([
     tailwind({
       theme: {
@@ -52,16 +52,16 @@ function buildDemoFile(filename) {
   ])
     .process('@tailwind base; @tailwind components; @tailwind utilities;', {
       from: null,
-      to: `./demo/${filename}.css`,
+      to: `./docs/${filename}.css`,
       map: false,
     })
     .then((result) => {
-      fs.writeFileSync(`./demo/${filename}.css`, result.css)
+      fs.writeFileSync(`./docs/${filename}.css`, result.css)
       return result
     })
     .then((result) => {
       const minified = new CleanCSS().minify(result.css)
-      fs.writeFileSync(`./demo/${filename}.min.css`, minified.styles)
+      fs.writeFileSync(`./docs/${filename}.min.css`, minified.styles)
     })
     .catch((error) => {
       console.log(error)
@@ -70,6 +70,6 @@ function buildDemoFile(filename) {
 
 console.info('Building CSS...')
 
-Promise.all([buildDemoFile('tailwind')]).then(() => {
-  console.log('Finished building demo CSS.')
+Promise.all([buildDocsFile('tailwind')]).then(() => {
+  console.log('Finished building docs CSS.')
 })

src/index.js

@@ -11,7 +11,9 @@ module.exports = plugin.withOptions(function(options = {}) {
       currentScreenVar = options.currentScreenVar ?? '--current-screen',
       currentScreenDefault = options.currentScreenDefault ?? screenWidthDefault,
       paddingVar = options.paddingVar ?? '--container-padding',
-      paddingDefault = theme('container.padding.DEFAULT', undefined)
+      paddingDefault = typeof theme('container.padding') === 'string'
+        ? theme('container.padding')
+        : theme('container.padding.DEFAULT', theme('container.padding.default'))
 
 
     /* Base */