(tokens) generate css utility classes

These were the missing parts in order to use every design tokens
of Cunningham. Including: spacing, font weight, size, family, and
colors. In order to be really versatile and to allow users to
define new design tokens I had to re-organize the way those tokens
are sub divided in sub objects in cunningham.ts file. That's why
sub division are created for theme.typ.sizes for instance.
This commit is contained in:
Nathan Vasse
2023-01-19 15:30:23 +01:00
committed by NathanVss
parent 3bb74d8594
commit b908136224
20 changed files with 769 additions and 98 deletions

View File

@@ -55,10 +55,17 @@ describe("Cunningham Bin", () => {
expect(fs.existsSync(cssTokensFile)).toEqual(false);
await run(["", "", "-g", "css"]);
expect(fs.existsSync(cssTokensFile)).toEqual(true);
expect(fs.readFileSync(cssTokensFile).toString()).toEqual(`:root {
\t--c--theme--colors--primary: #055FD2;
\t--c--theme--colors--secondary: #DA0000;
}`);
expect(fs.readFileSync(cssTokensFile).toString()).toEqual(
fs
.readFileSync(
path.join(
__dirname,
"assets",
"expected-default-" + Config.tokenFilename + ".css"
)
)
.toString()
);
});
it("Runs with existing JS config file using local values.", async () => {
@@ -76,10 +83,17 @@ describe("Cunningham Bin", () => {
await run(["", "", "-g", "css"]);
expect(fs.existsSync(cssTokensFile)).toEqual(true);
expect(fs.readFileSync(cssTokensFile).toString()).toEqual(`:root {
\t--c--theme--colors--primary: AntiqueWhite;
\t--c--theme--colors--secondary: #DA0000;
}`);
expect(fs.readFileSync(cssTokensFile).toString()).toEqual(
fs
.readFileSync(
path.join(
__dirname,
"assets",
"expected-js-" + Config.tokenFilename + ".css"
)
)
.toString()
);
});
it("Runs with existing TS config file using local values.", async () => {
@@ -111,10 +125,17 @@ describe("Cunningham Bin", () => {
expect(fs.existsSync(cssTokensFile)).toEqual(false);
await run(["", "", "-g", "css", opt, outputDir]);
expect(fs.existsSync(cssTokensFile)).toEqual(true);
expect(fs.readFileSync(cssTokensFile).toString()).toEqual(`:root {
\t--c--theme--colors--primary: #055FD2;
\t--c--theme--colors--secondary: #DA0000;
}`);
expect(fs.readFileSync(cssTokensFile).toString()).toEqual(
fs
.readFileSync(
path.join(
__dirname,
"assets",
"expected-default-" + Config.tokenFilename + ".css"
)
)
.toString()
);
};
it("Runs with -o options.", async () => {