🐛 FIX: Tailwind CSS purge

CHANGELOG.md

@@ -1,9 +1,12 @@
 
 # Changelog
 
+**v0.2.9-7**
+- 🐛 FIX: Run `stylesDev` when template files are changes. Solves Tailwind CSS purge.
+
 **v0.2.9-6**
 - 📦 NEW: Add support for Tailwind CSS.
-- 👌 IMPROVE: Disable nginx cache for dev server.
+- 👌 IMPROVE: Disable Nginx cache for dev server.
 
 **v0.2.9-4**
 - 🐛 FIX: Missing welcome.html

gulpfile.js

@@ -187,7 +187,7 @@ function devServer(done) {
 	watch('./src/assets/js/**', series(footerScriptsDev, Reload));
 	watch('./src/assets/img/**', series(copyImagesDev, Reload));
 	watch('./src/assets/fonts/**', series(copyFontsDev, Reload));
-	watch('./src/theme/**', series(copyThemeDev, Reload));
+	watch('./src/theme/**', series(copyThemeDev, stylesDev, Reload));
 	watch('./src/plugins/**', series(pluginsDev, Reload));
 }
 

installer/modules/run.js

@@ -13,6 +13,7 @@ const download = require('download');
 const handleError = require('./handleError.js');
 const clearConsole = require('./clearConsole.js');
 const printNextSteps = require('./printNextSteps.js');
+const version = require('../package.json').version;
 
 module.exports = async () => {
 	// Init.
@@ -26,7 +27,7 @@ module.exports = async () => {
 		upstreamUrl = `https://raw.githubusercontent.com/${process.env.WPFY_GH_REPO}/${refname}`;
 	} else {
 		upstreamUrl =
-			'https://raw.githubusercontent.com/luangjokaj/wordpressify/v0.2.9-6';
+			`https://raw.githubusercontent.com/luangjokaj/wordpressify/v${version}`;
 	}
 
 	// Files.

installer/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "wordpressify",
-	"version": "0.2.9-6",
+	"version": "0.2.9-7",
 	"description": "A build system designed to automate your WordPress development workflow.",
 	"keywords": [
 		"babel",

package.json

@@ -1,6 +1,6 @@
 {
 	"name": "wordpressify",
-	"version": "0.2.9-6",
+	"version": "0.2.9-7",
 	"description": "A build system designed to automate your WordPress development workflow.",
 	"keywords": [
 		"babel",

src/assets/css/variables.css

@@ -1,17 +1,15 @@
-@import "./variables";
+@custom-media --screen-xs (min-width: 0);
+@custom-media --screen-sm (min-width: 576px);
+@custom-media --screen-md (min-width: 768px);
+@custom-media --screen-lg (min-width: 992px);
+@custom-media --screen-xl (min-width: 1200px);
+@custom-media --screen-xxl (min-width: 1440px);
+@custom-media --screen-xxxl (min-width: 1920px);
 
-.container {
-	max-width: var(--max-width);
-	margin: auto;
-	padding-right: var(--margin-container-mobile);
-	padding-left: var(--margin-container-mobile);
+:root {
 
-	@media (--screen-lg) {
-		padding-right: var(--margin-container-desktop);
-		padding-left: var(--margin-container-desktop);
-	}
-
-	@media (--screen-xxxl) {
-		max-width: 1704px;
-	}
+	/* Sample variables ------------------------------------------- */
+	--max-width: 1440px;
+	--margin-container-mobile: 20px;
+	--margin-container-desktop: 20px;
 }