Skip to content

Commit

Permalink
feat: add transparent theme for testing #191
Browse files Browse the repository at this point in the history
  • Loading branch information
jason-capsule42 committed Nov 20, 2024
1 parent 2a828c3 commit 9eed86e
Show file tree
Hide file tree
Showing 15 changed files with 5,548 additions and 1 deletion.
21 changes: 21 additions & 0 deletions scripts/config-transparent.json
Original file line number Diff line number Diff line change
@@ -0,0 +1,21 @@
{
"source": ["./src/themes/transparent/color/*.json"],
"include": ["./src/themes/transparent/*.json"],
"platforms": {
"CSSCustomProperties": {
"transformGroup": "css",
"prefix": "ds",
"comment": "File type: CSS; variable type: CSS; filter: public",
"buildPath": "./dist/tokens/transparent/",
"files": [
{
"destination": "CSSCustomProperties.css",
"format": "css/variables",
"filter": {
"public": true
}
}
]
}
}
}
1 change: 0 additions & 1 deletion scripts/config.json
Original file line number Diff line number Diff line change
Expand Up @@ -66,7 +66,6 @@
}
]
},

"CSSCustomProperties": {
"transformGroup": "css",
"prefix": "ds",
Expand Down
4 changes: 4 additions & 0 deletions scripts/styleDictionary.js
Original file line number Diff line number Diff line change
Expand Up @@ -39,3 +39,7 @@ darkTokensConfig.buildAllPlatforms();
const excursionConfig = StyleDictionary.extend('./scripts/config-excursion.json');

excursionConfig.buildAllPlatforms();

const transparentConfig = StyleDictionary.extend('./scripts/config-transparent.json');

transparentConfig.buildAllPlatforms();
90 changes: 90 additions & 0 deletions src/themes/transparent/color/alert.json
Original file line number Diff line number Diff line change
@@ -0,0 +1,90 @@
{
"color": {
"alert": {
"notification": {
"default": {
"value": "{color.brand.atlas.400.value}",
"public": true,
"default": true,
"usage": "Notification color on light backgrounds",
"wcag": "AAA",
"deprecated": true,
"version": "4.5.0",
"reference": "n/a"
}
},
"warning": {
"default": {
"value": "{color.state.warning.500.value}",
"public": true,
"default": true,
"usage": "Warning color on light backgrounds",
"wcag": "AAA",
"deprecated": true,
"version": "4.5.0",
"reference": "n/a"
}
},
"error": {
"default": {
"value": "{color.state.error.500.value}",
"public": true,
"default": true,
"usage": "Error color on light backgrounds",
"wcag": "AAA",
"deprecated": true,
"version": "4.5.0",
"reference": "n/a"
}
},
"success": {
"default": {
"value": "{color.state.success.500.value}",
"public": true,
"default": true,
"usage": "Success color on light backgrounds",
"wcag": "AAA",
"deprecated": true,
"version": "4.5.0",
"reference": "n/a"
}
},
"advisory": {
"default": {
"value": "{color.brand.goldcoast.100.value}",
"public": true,
"default": true,
"usage": "Travel advisory or system maintenance color on light backgrounds",
"wcag": "AAA",
"deprecated": true,
"version": "4.5.0",
"reference": "n/a"
}
},
"bkgSuccess": {
"default": {
"value": "DDF6E8",
"public": true,
"default": true,
"usage": "Background success color on light backgrounds",
"wcag": "AAA",
"deprecated": true,
"version": "4.5.0",
"reference": "n/a"
}
},
"bkgError": {
"default": {
"value": "FFEDF1",
"public": true,
"default": true,
"usage": "Background error color on light backgrounds",
"wcag": "AAA",
"deprecated": true,
"version": "4.5.0",
"reference": "n/a"
}
}
}
}
}
263 changes: 263 additions & 0 deletions src/themes/transparent/color/background.json
Original file line number Diff line number Diff line change
@@ -0,0 +1,263 @@
{
"color": {
"background": {
"primary": {
"100": {
"default": {
"value": "{color.base.white.value}",
"public": true,
"default": true,
"usage": "Used for creating light backgrounds",
"wcag": "n/a",
"deprecated": false
},
"inverse": {
"value": "{color.brand.navy.1000.value}",
"public": true,
"inverse": true,
"usage": "Used for creating dark backgrounds",
"wcag": "n/a",
"deprecated": false
}
},
"200": {
"default": {
"value": "{color.brand.gray.100.value}",
"public": true,
"default": true,
"usage": "Used for creating light backgrounds",
"wcag": "n/a",
"deprecated": false
},
"inverse": {
"value": "{color.brand.navy.900.value}",
"public": true,
"inverse": true,
"usage": "Used for creating dark backgrounds",
"wcag": "n/a",
"deprecated": false
}
},
"300": {
"default": {
"value": "{color.brand.neutral.200.value}",
"public": true,
"default": true,
"usage": "Used for creating light backgrounds",
"wcag": "n/a",
"deprecated": false
},
"inverse": {
"value": "{color.brand.navy.800.value}",
"public": true,
"inverse": true,
"usage": "Used for creating dark backgrounds",
"wcag": "n/a",
"deprecated": false
}
},
"400": {
"default": {
"value": "{color.brand.gray.200.value}",
"public": true,
"default": true,
"usage": "Used for creating light backgrounds",
"wcag": "n/a",
"deprecated": false
},
"inverse": {
"value": "{color.brand.navy.700.value}",
"public": true,
"inverse": true,
"usage": "Used for creating dark backgrounds",
"wcag": "n/a",
"deprecated": false
}
}
},
"success": {
"default": {
"value": "{color.base.success.100.value}",
"public": true,
"default": true,
"usage": "Used for creating light backgrounds",
"wcag": "n/a",
"deprecated": false
},
"inverse": {
"value": "{color.base.success.500.value}",
"public": true,
"inverse": true,
"usage": "Used for creating dark backgrounds",
"wcag": "n/a",
"deprecated": false
}
},
"error": {
"default": {
"value": "{color.base.error.100.value}",
"public": true,
"default": true,
"usage": "Used for creating light backgrounds",
"wcag": "n/a",
"deprecated": false
},
"inverse": {
"value": "{color.base.error.500.value}",
"public": true,
"inverse": true,
"usage": "Used for creating dark backgrounds",
"wcag": "n/a",
"deprecated": false
}
},
"warning": {
"default": {
"value": "{color.base.warning.100.value}",
"public": true,
"default": true,
"usage": "Used for creating light backgrounds",
"wcag": "n/a",
"deprecated": false
},
"inverse": {
"value": "{color.base.warning.500.value}",
"public": true,
"inverse": true,
"usage": "Used for creating dark backgrounds",
"wcag": "n/a",
"deprecated": false
}
},
"info": {
"default": {
"value": "{color.brand.blue.100.value}",
"public": true,
"default": true,
"usage": "Used for creating light backgrounds",
"wcag": "n/a",
"deprecated": false
},
"inverse": {
"value": "{color.brand.blue.900.value}",
"public": true,
"inverse": true,
"usage": "Used for creating dark backgrounds",
"wcag": "n/a",
"deprecated": false
}
},
"subtle": {
"default": {
"value": "{color.brand.neutral.100.value}",
"public": true,
"default": true,
"usage": "Used for creating light backgrounds",
"wcag": "n/a",
"deprecated": false
},
"inverse": {
"value": "{color.brand.gray.1000.value}",
"public": true,
"inverse": true,
"usage": "Used for creating dark backgrounds",
"wcag": "n/a",
"deprecated": false
}
},
"accent": {
"default": {
"value": "{color.brand.cyan.100.value}",
"public": true,
"default": true,
"usage": "Used for creating light backgrounds",
"wcag": "n/a",
"deprecated": false
},
"inverse": {
"value": "{color.base.cyan.800.value}",
"public": true,
"inverse": true,
"usage": "Used for creating dark backgrounds",
"wcag": "n/a",
"deprecated": false
}
},
"emphasis": {
"default": {
"value": "{color.brand.blue.200.value}",
"public": true,
"default": true,
"usage": "Used for creating light backgrounds",
"wcag": "n/a",
"deprecated": false
},
"inverse": {
"value": "{color.brand.blue.800.value}",
"public": true,
"inverse": true,
"usage": "Used for creating dark backgrounds",
"wcag": "n/a",
"deprecated": false
}
},
"scrimmed": {
"default": {
"value": "{color.base.black-500.value}",
"public": true,
"default": true,
"usage": "Used for creating light backgrounds",
"wcag": "n/a",
"deprecated": false
}
},
"lightest": {
"value": "{color.base.white.value}",
"public": true,
"usage": "Used for creating light backgrounds",
"wcag": "n/a",
"deprecated": true,
"version": "4.5.0",
"reference": "n/a"
},
"lighter": {
"value": "{color.base.gray.100.value}",
"public": true,
"usage": "Used for creating light backgrounds @ 90% white",
"wcag": "n/a",
"deprecated": true,
"version": "4.5.0",
"reference": "n/a"
},
"darker": {
"value": "{color.brand.midnight.400.value}",
"public": true,
"usage": "Used for creating dark backgrounds",
"wcag": "n/a",
"deprecated": true,
"version": "4.5.0",
"reference": "n/a"
},
"darkest": {
"value": "{color.brand.midnight.500.value}",
"public": true,
"usage": "Used for creating dark backgrounds @ 20% darker",
"wcag": "n/a",
"deprecated": true,
"version": "4.5.0",
"reference": "n/a"
},
"gradient": {
"default": {
"value": "linear-gradient(180deg, {color.base.white-opacity-0}, {color.base.white-opacity-50})",
"public": true,
"usage": "Used for creating a gradient against all backgrounds",
"wcag": "n/a",
"deprecated": true,
"version": "4.5.0",
"reference": "n/a"
}
}
}
}
}
Loading

0 comments on commit 9eed86e

Please sign in to comment.