@wesgro/postcss-migrate-colors-to-vars
TypeScript icon, indicating that this package has built-in type declarations

0.2.3 • Public • Published

postcss-migrate-colors-to-vars

Will:

  • find all colors inside of a css file
  • compare them to a Object of css vars, and their values
  • replace the color with the css-var of your choosing based on the nearest delta

Usage

import postcss from "postcss";
import migrateColorsPlugin from "@wesgro/postcss-migrate-colors-to-vars";
import fs from "node:fs";

const COLORS = {
    "--color__selection__base": "#1a1918",
    "--color__selection__base--state-1": "#393633",
    "--color__selection__base--state-2": "#44403d",
}
const input = `
h1{
    color:#1a1914; 
    background-color:#393633; 
    outline: var(--not-me-bro__other__color, #44403d);
}`;

const output = postcss(
  migrateColorsPlugin({
    ignoreRule: (node) => {
      return (
        node.type === "function" &&
        node.nodes.some((node) => node.value.startsWith("--not-me-bro"))
      );
    },

    replacementColors: COLORS,
  })
).process(input).css;
console.log(output)
// 

Readme

Keywords

none

Package Sidebar

Install

npm i @wesgro/postcss-migrate-colors-to-vars

Weekly Downloads

0

Version

0.2.3

License

MIT

Unpacked Size

37.3 kB

Total Files

5

Last publish

Collaborators

  • wesgro