Installation
Quick Take
Examples
Purpose
It’s a best practice to avoid shorthand color codes in email, for example, <td bgcolor='#ccc'>. This program converts three-digit hex color codes inside any data structures (strings, objects or arrays), for example <td bgcolor='#cccccc'>.
API — conv()
The main function conv() is imported like this:
It’s a function which takes one input argument:
- If the input is string, a converted string will be returned.
- If input is array or a plain object, it will be traversed and any hex codes within strings inside will be converted.
- If input is unsuitable: falsy things, functions etc. — input will be returned as is.
This program never throws an error, it’s meant to be used as a by-pass function.
Usage in Gulp environment
You don’t need a Gulp plugin; you can simply use this library whenever you get in control of the final stream, or especially, SCSS variables.
For example, tap the color-shorthand-hex-to-six-digit right after importing the SCSS variables. We hope you are not misbehaving and all your colour variables are in one place only, as variables.
// import SCSS variables from file (modules/src/scss/_variables.scss)
// native Node function to help with paths:
import path from "path";
// convert variables SCSS file to .JSON:
import scssToJson from "scss-to-json";
// lodash:
import mapKeys from "lodash.mapKeys";
// ...
function getScssVars() {
const sassFilePath = path.resolve(__dirname, "modules/src/scss/_variables.scss");
const tempSassVars = scssToJson(sassFilePath);
sassVars = mapKeys(tempSassVars, function (value, key) {
return key.slice(1);
});
// convert all bad hex codes:
sassVars = convShorthand(sassVars);
// console.log('sassVars = ' + JSON.stringify(sassVars, null, 4))
}