@madebyseed/seed-cli-tools 1.2.3 → 1.2.5

package/lib/tasks/build-css.js

@@ -23,7 +23,7 @@ var messages = require('./includes/messages.js');
 
 
 function processCss() {
-  return gulp.src(config.roots.css).pipe(plumber()).pipe(sass().on('error', sass.logError)).pipe(postcss(config.plugins.postcss)).pipe(gulp.dest(config.dist.assets));
+  return gulp.src(config.roots.css).pipe(plumber()).pipe(postcss(config.plugins.postcss)).pipe(sass().on('error', sass.logError)).pipe(gulp.dest(config.dist.assets));
 }
 /**
  * Concatenate css via gulp-cssimport

package/lib/tasks/build-svg.js

@@ -10,10 +10,6 @@ var size = require('gulp-size');
 
 var chokidar = require('chokidar');
 
-var svgmin = require('gulp-svgmin');
-
-var cheerio = require('gulp-cheerio');
-
 var extReplace = require('gulp-ext-replace');
 
 var plumber = require('gulp-plumber');
@@ -35,7 +31,7 @@ var messages = require('./includes/messages.js');
 
 function processIcons(files) {
   messages.logProcessFiles('build:svg');
-  return gulp.src(files).pipe(plumber(utils.errorHandler)).pipe(svgmin()).pipe(cheerio(config.plugins.cheerio)).pipe(extReplace('.liquid')).pipe(size({
+  return gulp.src(files).pipe(plumber(utils.errorHandler)).pipe(extReplace('.liquid')).pipe(size({
     showFiles: true,
     pretty: true
   })).pipe(gulp.dest(config.dist.snippets));

package/lib/tasks/includes/config.js

@@ -10,6 +10,8 @@ var tailwindcss = require("tailwindcss");
 
 var cssnano = require("cssnano");
 
+var pxtorem = require('postcss-pxtorem');
+
 var argv = require("minimist")(process.argv.slice(2));
 
 var themeRoot = findRoot(process.cwd());
@@ -103,12 +105,17 @@ var config = {
     css: "src/styles/*.{css,scss}"
   },
   plugins: {
-    cheerio: {
-      run: require("./utilities.js").processSvg
-    },
     postcss: [require('postcss-import'), tailwindcss({
       config: join(themeRoot, tailwindConfig)
-    }), require('autoprefixer')]
+    }), require('autoprefixer'), pxtorem({
+      rootValue: 16,
+      unitPrecision: 5,
+      propList: ['*'],
+      selectorBlackList: [],
+      replace: true,
+      mediaQuery: true,
+      exclude: /node_modules/i
+    })]
   }
 };
 

package/lib/tasks/includes/utilities.js

@@ -67,49 +67,6 @@ var utilities = {
     }).thenReturn(results).all();
   },
 
-  /**
-   * Function passed to cheerio.run - adds aria tags & other accessibility
-   * based information to each svg element's markup...
-   *
-   * @memberof seed-cli.utilities
-   * @param {Function} $ - jQuery reference
-   * @param {fs} file - reference to current icon file?
-   */
-  processSvg: function processSvg($, file) {
-    var $svg = $("svg"); // eslint-disable-line no-var
-
-    var $newSvg = $('<svg aria-hidden="true" focusable="false" role="presentation" class="icon" />'); // eslint-disable-line no-var
-
-    var fileName = file.relative.replace(".svg", ""); // eslint-disable-line no-var
-
-    var viewBoxAttr = $svg.attr("viewbox"); // eslint-disable-line no-var
-    // Add necessary attributes
-
-    if (viewBoxAttr) {
-      var width = parseInt(viewBoxAttr.split(" ")[2], 10); // eslint-disable-line no-var
-
-      var height = parseInt(viewBoxAttr.split(" ")[3], 10); // eslint-disable-line no-var
-
-      var widthToHeightRatio = width / height; // eslint-disable-line no-var
-
-      if (widthToHeightRatio >= 1.5) {
-        $newSvg.addClass("icon--wide");
-      }
-
-      $newSvg.attr("viewBox", viewBoxAttr);
-    } // Add required classes to full color icons
-
-
-    if (file.relative.indexOf("-full-color") >= 0) {
-      $newSvg.addClass("icon--full-color");
-    }
-
-    $newSvg.addClass(fileName).append($svg.contents());
-    $newSvg.append($svg.contents());
-    $svg.after($newSvg);
-    $svg.remove();
-  },
-
   /**
    * Factory for creating an event cache - used with a short debounce to batch any
    * file changes that occur in rapid succession during Watch tasks.

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@madebyseed/seed-cli-tools",
-  "version": "1.2.3",
+  "version": "1.2.5",
   "description": "Seed CLI Tools",
   "main": "index.js",
   "scripts": {
@@ -34,7 +34,6 @@
     "figures": "^3.2.0",
     "find-root": "^1.1.0",
     "gulp": "^4.0.2",
-    "gulp-cheerio": "^1.0.0",
     "gulp-ext-replace": "^0.3.0",
     "gulp-if": "^3.0.0",
     "gulp-include": "^2.4.1",
@@ -42,16 +41,16 @@
     "gulp-postcss": "^9.0.0",
     "gulp-sass": "^5.0.0",
     "gulp-size": "^4.0.1",
-    "gulp-svgmin": "^4.0.1",
     "gulp-uglify": "^3.0.2",
     "gulp-zip": "^5.1.0",
     "postcss": "^8.3.6",
     "postcss-import": "^14.0.2",
+    "postcss-pxtorem": "^6.0.0",
     "require-directory": "^2.1.1",
     "sass": "^1.36.0",
     "tailwindcss": "^2.2.7",
     "vinyl-paths": "^3.0.1",
     "yargs": "^17.0.1"
   },
-  "gitHead": "c8014098190f878e6bd6623c69c9164a1d94001c"
+  "gitHead": "8c7eb999d4fdd1fa2ab54e591c56a82f64ccf07d"
 }

package/src/tasks/build-css.js

@@ -18,8 +18,8 @@ const messages = require('./includes/messages.js');
 function processCss() {
   return gulp.src(config.roots.css)
     .pipe(plumber())
-    .pipe(sass().on('error', sass.logError))
     .pipe(postcss(config.plugins.postcss))
+    .pipe(sass().on('error', sass.logError))
     .pipe(gulp.dest(config.dist.assets));
 }
 

package/src/tasks/build-svg.js

@@ -3,8 +3,6 @@ const vinylPaths = require('vinyl-paths');
 const del = require('del');
 const size = require('gulp-size');
 const chokidar = require('chokidar');
-const svgmin = require('gulp-svgmin');
-const cheerio = require('gulp-cheerio');
 const extReplace = require('gulp-ext-replace');
 const plumber = require('gulp-plumber');
 
@@ -24,8 +22,6 @@ function processIcons(files) {
   messages.logProcessFiles('build:svg');
   return gulp.src(files)
     .pipe(plumber(utils.errorHandler))
-    .pipe(svgmin())
-    .pipe(cheerio(config.plugins.cheerio))
     .pipe(extReplace('.liquid'))
     .pipe(size({
       showFiles: true,

package/src/tasks/includes/config.js

@@ -3,6 +3,7 @@ const logger = require("debug")("seed-tools");
 const findRoot = require("find-root");
 const tailwindcss = require("tailwindcss");
 const cssnano = require("cssnano");
+const pxtorem = require('postcss-pxtorem');
 const argv = require("minimist")(process.argv.slice(2));
 const themeRoot = findRoot(process.cwd());
 const tailwindConfig = 'tailwind.config.js'
@@ -103,13 +104,19 @@ const config = {
   },
 
   plugins: {
-    cheerio: {
-      run: require("./utilities.js").processSvg,
-    },
     postcss: [
       require('postcss-import'),
       tailwindcss({ config: join(themeRoot, tailwindConfig) }),
       require('autoprefixer'),
+      pxtorem({
+        rootValue: 16,
+        unitPrecision: 5,
+        propList: ['*'],
+        selectorBlackList: [],
+        replace: true,
+        mediaQuery: true,
+        exclude: /node_modules/i
+      })
     ],
   },
 };

package/src/tasks/includes/utilities.js

@@ -65,44 +65,6 @@ const utilities = {
       .all();
   },
 
-  /**
-   * Function passed to cheerio.run - adds aria tags & other accessibility
-   * based information to each svg element's markup...
-   *
-   * @memberof seed-cli.utilities
-   * @param {Function} $ - jQuery reference
-   * @param {fs} file - reference to current icon file?
-   */
-  processSvg: ($, file) => {
-    var $svg = $("svg"); // eslint-disable-line no-var
-    var $newSvg = $(
-      '<svg aria-hidden="true" focusable="false" role="presentation" class="icon" />'
-    ); // eslint-disable-line no-var
-    var fileName = file.relative.replace(".svg", ""); // eslint-disable-line no-var
-    var viewBoxAttr = $svg.attr("viewbox"); // eslint-disable-line no-var
-
-    // Add necessary attributes
-    if (viewBoxAttr) {
-      var width = parseInt(viewBoxAttr.split(" ")[2], 10); // eslint-disable-line no-var
-      var height = parseInt(viewBoxAttr.split(" ")[3], 10); // eslint-disable-line no-var
-      var widthToHeightRatio = width / height; // eslint-disable-line no-var
-      if (widthToHeightRatio >= 1.5) {
-        $newSvg.addClass("icon--wide");
-      }
-      $newSvg.attr("viewBox", viewBoxAttr);
-    }
-
-    // Add required classes to full color icons
-    if (file.relative.indexOf("-full-color") >= 0) {
-      $newSvg.addClass("icon--full-color");
-    }
-
-    $newSvg.addClass(fileName).append($svg.contents());
-
-    $newSvg.append($svg.contents());
-    $svg.after($newSvg);
-    $svg.remove();
-  },
 
   /**
    * Factory for creating an event cache - used with a short debounce to batch any