diff --git a/scripts/config-dark.json b/scripts/config-darkmode.json similarity index 81% rename from scripts/config-dark.json rename to scripts/config-darkmode.json index 1372760..29ebd26 100644 --- a/scripts/config-dark.json +++ b/scripts/config-darkmode.json @@ -1,22 +1,22 @@ { "include": ["./src/asset/*.json", "./src/size/*.json", "./src/*.json"], - "source": ["./src/color-dark/*.json"], + "source": ["./src/color-darkmode/*.json"], "platforms": { - "SCSSVariables--dark": { + "SCSSVariables--darkmode": { "transformGroup": "scss", "prefix": "ds", "comment": "File type: SCSS; variable type: Sass; filter: public, theme: dark mode", "buildPath": "./dist/tokens/", "files": [ { - "destination": "SCSSVariables--dark.scss", + "destination": "SCSSVariables--darkmode.scss", "format": "scss/variables", "filter": { "public": true } }, { - "destination": "SCSSVariablesMapFlat--dark.scss", + "destination": "SCSSVariablesMapFlat--darkmode.scss", "format": "custom/scss/map-flat", "mapName": "auroTokens", "filter": { @@ -25,21 +25,21 @@ } ] }, - "CSSVariables--dark": { + "CSSVariables--darkmode": { "transformGroup": "css", "prefix": "ds", "comment": "File type: CSS; variable type: css; filter: public", "buildPath": "./dist/tokens/", "files": [ { - "destination": "CSSVariables--dark.css", + "destination": "CSSVariables--darkmode.css", "format": "css/variables", "filter": { "public": true } }, { - "destination": "CSSVariablesMapFlat--dark.css", + "destination": "CSSVariablesMapFlat--darkmode.css", "format": "custom/scss/map-flat", "mapName": "auroTokens", "filter": { @@ -48,14 +48,14 @@ } ] }, - "SCSSOpacityVariables--dark": { + "SCSSOpacityVariables--darkmode": { "transformGroup": "scss", "prefix": "ds", "comment": "File type: SCSS; variable type: Sass; filter: opacity, theme: dark mode", "buildPath": "./dist/tokens/", "files": [ { - "destination": "SCSSOpacityVariables--dark.scss", + "destination": "SCSSOpacityVariables--darkmode.scss", "format": "scss/variables", "filter": { "opacity": true @@ -63,7 +63,7 @@ } ] }, - "SCSSVariableMap--dark": { + "SCSSVariableMap--darkmode": { "transformGroup": "scss", "prefix": "ds", "comment": "File type: SCSS; variable type: Sassmap; filter: size, public, theme: dark mode", @@ -71,7 +71,7 @@ "buildPath": "./dist/tokens/", "files": [ { - "destination": "SCSSVariableMap--dark.scss", + "destination": "SCSSVariableMap--darkmode.scss", "format": "scss/map-deep", "filter": { "attributes": { @@ -83,14 +83,14 @@ ] }, - "CSSCustomProperties--dark": { + "CSSCustomProperties--darkmode": { "transformGroup": "css", "prefix": "ds", "comment": "File type: CSS; variable type: CSS; filter: public, theme: dark mode", "buildPath": "./dist/tokens/", "files": [ { - "destination": "CSSCustomProperties--dark.css", + "destination": "CSSCustomProperties--darkmode.css", "format": "css/variables", "filter": { "public": true @@ -98,7 +98,7 @@ } ] }, - "CSSCustomPropertiesColorRGB--dark": { + "CSSCustomPropertiesColorRGB--darkmode": { "transformGroup": "css", "transforms": ["attribute/cti", "name/cti/kebab", "custom/color/rgb"], "prefix": "ds-rgb", @@ -106,7 +106,7 @@ "buildPath": "./dist/tokens/", "files": [ { - "destination": "CSSCustomPropertiesColorRGB--dark.css", + "destination": "CSSCustomPropertiesColorRGB--darkmode.css", "format": "css/variables", "filter": { "attributes": { @@ -117,7 +117,7 @@ } ] }, - "SassCustomPropertiesColorRGB--dark": { + "SassCustomPropertiesColorRGB--darkmode": { "transformGroup": "css", "transforms": ["attribute/cti", "name/cti/kebab", "custom/color/rgb"], "prefix": "ds-rgb", @@ -125,7 +125,7 @@ "buildPath": "./dist/tokens/", "files": [ { - "destination": "SassCustomPropertiesColorRGB--dark.scss", + "destination": "SassCustomPropertiesColorRGB--darkmode.scss", "format": "css/variables", "filter": { "attributes": { @@ -136,14 +136,14 @@ } ] }, - "CSSOpacityCustomProperties--dark": { + "CSSOpacityCustomProperties--darkmode": { "transformGroup": "css", "prefix": "ds", "comment": "File type: SCSS; variable type: Sass; filter: opacity, theme: dark mode", "buildPath": "./dist/tokens/", "files": [ { - "destination": "CSSOpacityProperties--dark.scss", + "destination": "CSSOpacityProperties--darkmode.scss", "format": "css/variables", "filter": { "opacity": true @@ -151,14 +151,14 @@ } ] }, - "CSSSizeCustomProperties--dark": { + "CSSSizeCustomProperties--darkmode": { "transformGroup": "css", "prefix": "ds", "comment": "File type: CSS; variable type: CSS; filter: size, public, theme: dark mode", "buildPath": "./dist/tokens/", "files": [ { - "destination": "CSSSizeCustomProperties--dark.css", + "destination": "CSSSizeCustomProperties--darkmode.css", "format": "css/variables", "filter": { "attributes": { @@ -169,14 +169,14 @@ } ] }, - "SassSizeCustomProperties--dark": { + "SassSizeCustomProperties--darkmode": { "transformGroup": "scss", "prefix": "ds", "comment": "File type: Sass; variable type: Sass; filter: size, public, theme: dark mode", "buildPath": "./dist/tokens/", "files": [ { - "destination": "SassSizeCustomProperties--dark.scss", + "destination": "SassSizeCustomProperties--darkmode.scss", "format": "css/variables", "filter": { "attributes": { @@ -187,14 +187,14 @@ } ] }, - "SassCustomProperties--dark": { + "SassCustomProperties--darkmode": { "transformGroup": "css", "prefix": "ds", "comment": "File type: SCSS; variable type: CSS; filter: public, theme: dark mode", "buildPath": "./dist/tokens/", "files": [ { - "destination": "SassCustomProperties--dark.scss", + "destination": "SassCustomProperties--darkmode.scss", "format": "css/variables", "filter": { "public": true @@ -210,7 +210,7 @@ "transforms": ["attribute/cti", "name/cti/kebab", "color/css"], "files": [ { - "destination": "JSData--darkColor.js", + "destination": "JSData--darkmodeColor.js", "format": "javascript/module", "filter": { "attributes": { @@ -221,14 +221,14 @@ } ] }, - "JSes6--darkColor": { + "JSes6--darkmodeColor": { "prefix": "ds", "transformGroup": "js", "comment": "File type: JS; data type: JS; filter: colors || public, theme: dark mode", "buildPath": "./dist/tokens/", "files": [ { - "destination": "JSVariables--darkColor.js", + "destination": "JSVariables--darkmodeColor.js", "format": "javascript/es6", "filter": { "attributes": { @@ -256,12 +256,12 @@ } ] }, - "JSONtest--dark": { + "JSONtest--darkmode": { "transformGroup": "css", "buildPath": "./test/", "files": [ { - "destination": "validJSON--dark", + "destination": "validJSON--darkmode", "format": "css/variables" } ] diff --git a/scripts/styleDictionary.js b/scripts/styleDictionary.js index dc55cdb..bc10729 100644 --- a/scripts/styleDictionary.js +++ b/scripts/styleDictionary.js @@ -30,6 +30,6 @@ const tokensConfig = StyleDictionary.extend('./scripts/config.json'); // Style Dictionary build function tokensConfig.buildAllPlatforms(); -const darkTokensConfig = StyleDictionary.extend('./scripts/config-dark.json'); +const darkTokensConfig = StyleDictionary.extend('./scripts/config-darkmode.json'); darkTokensConfig.buildAllPlatforms(); diff --git a/src/color-dark/alert.json b/src/color-darkmode/alert.json similarity index 83% rename from src/color-dark/alert.json rename to src/color-darkmode/alert.json index 2bf112a..e79e5ad 100644 --- a/src/color-dark/alert.json +++ b/src/color-darkmode/alert.json @@ -2,50 +2,50 @@ "color": { "alert": { "notification": { - "onDark": { + "default": { "value": "{color.brand.breeze.300.value}", "public": true, - "onDark": true, + "default": true, "usage": "Notification color on dark backgrounds", "wcag": "AAA", "deprecated": false } }, "warning": { - "onDark": { + "default": { "value": "{color.state.warning.500.value}", "public": true, - "onDark": true, + "default": true, "usage": "Warning color on light backgrounds", "wcag": "AAA", "deprecated": false } }, "error": { - "onDark": { + "default": { "value": "{color.state.error.100.value}", "public": true, - "onDark": true, + "default": true, "usage": "Error color on dark backgrounds", "wcag": "AAA", "deprecated": false } }, "success": { - "onDark": { + "default": { "value": "{color.state.success.100.value}", "public": true, - "onDark": true, + "default": true, "usage": "Success color on dark backgrounds", "wcag": "AAA", "deprecated": false } }, "advisory": { - "onDark": { + "default": { "value": "{color.brand.goldcoast.100.value}", "public": true, - "onDark": true, + "default": true, "usage": "Travel advisory or system maintenance color on dark backgrounds", "wcag": "AAA", "deprecated": false diff --git a/src/color-dark/background.json b/src/color-darkmode/background.json similarity index 100% rename from src/color-dark/background.json rename to src/color-darkmode/background.json diff --git a/src/color-dark/base.json b/src/color-darkmode/base.json similarity index 100% rename from src/color-dark/base.json rename to src/color-darkmode/base.json diff --git a/src/color-dark/border.json b/src/color-darkmode/border.json similarity index 83% rename from src/color-dark/border.json rename to src/color-darkmode/border.json index f9d6581..7ce8aed 100644 --- a/src/color-dark/border.json +++ b/src/color-darkmode/border.json @@ -2,60 +2,60 @@ "color": { "border": { "primary": { - "onDark": { + "default": { "value": "{color.brand.neutral.400.value}", "public": true, - "onDark": true, + "default": true, "usage": "Primary border color on dark background", "wcag": "n/a", "deprecated": false } }, "active": { - "onDark": { + "default": { "value": "{color.brand.breeze.300.value}", "public": true, - "onDark": true, + "default": true, "usage": "Active border color on dark backgrounds", "wcag": "n/a", "deprecated": false } }, "error": { - "onDark": { + "default": { "value": "{color.state.error.100.value}", "public": true, - "onDark": true, + "default": true, "usage": "Error states border color on dark background", "wcag": "n/a", "deprecated": false } }, "disabled": { - "onDark": { + "default": { "value": "{color.base.gray.200.value}", "public": true, - "onDark": true, + "default": true, "usage": "Disabled border color on dark background", "wcag": "n/a", "deprecated": false } }, "Focus": { - "onDark": { + "default": { "value": "{color.base.white.value}", "public": true, - "onDark": true, + "default": true, "usage": "Focus border color for dark backgrounds", "wcag": "n/a", "deprecated": false } }, "divider": { - "onDark": { + "default": { "value": "{color.base.white.value}", "public": true, - "onDark": true, + "default": true, "usage": "Strict use as divider between elements on dark backgrounds", "wcag": "n/a", "deprecated": false diff --git a/src/color-dark/brand.json b/src/color-darkmode/brand.json similarity index 100% rename from src/color-dark/brand.json rename to src/color-darkmode/brand.json diff --git a/src/color-dark/icon.json b/src/color-darkmode/icon.json similarity index 83% rename from src/color-dark/icon.json rename to src/color-darkmode/icon.json index 9aae76e..2a75f7a 100644 --- a/src/color-dark/icon.json +++ b/src/color-darkmode/icon.json @@ -2,40 +2,40 @@ "color": { "icon": { "primary": { - "onDark": { + "default": { "value": "{color.base.neutral.400.value}", "public": true, - "onDark": true, + "default": true, "usage": "Primary color for icons on dark backgrounds", "wcag": "AAA", "deprecated": false } }, "emphasis": { - "onDark": { + "default": { "value": "{color.base.white.value}", "public": true, - "onDark": true, + "default": true, "usage": "Emphasis or lightest icon color on dark backgrounds", "wcag": "AAA", "deprecated": false } }, "accent": { - "onDark": { + "default": { "value": "{color.brand.breeze.300.value}", "public": true, - "onDark": true, + "default": true, "usage": "Accent color for icon color on dark backgrounds", "wcag": "AA", "deprecated": false } }, "disabled": { - "onDark": { + "default": { "value": "{color.base.white-opacity-40.value}", "public": true, - "onDark": true, + "default": true, "usage": "Disabled icon color on dark backgrounds", "wcag": "n/a", "deprecated": false diff --git a/src/color-dark/text.json b/src/color-darkmode/text.json similarity index 83% rename from src/color-dark/text.json rename to src/color-darkmode/text.json index f56d9d6..89116c0 100644 --- a/src/color-dark/text.json +++ b/src/color-darkmode/text.json @@ -2,60 +2,60 @@ "color": { "text": { "primary": { - "onDark": { + "default": { "value": "{color.base.white.value}", "public": true, - "onDark": true, + "default": true, "usage": "Primary color for body and header text on dark backgrounds", "wcag": "AAA", "deprecated": false } }, "secondary": { - "onDark": { + "default": { "value": "{color.base.neutral.400.value}", "public": true, - "onDark": true, + "default": true, "usage": "Secondary color for body text on dark backgrounds", "wcag": "AAA", "deprecated": false } }, "link": { - "onDark": { + "default": { "value": "{color.brand.breeze.300.value}", "public": true, - "onDark": true, + "default": true, "usage": "Link text color on light backgrounds", "wcag": "AA", "deprecated": false } }, "error": { - "onDark": { + "default": { "value": "{color.state.error.100.value}", "public": true, - "onDark": true, + "default": true, "usage": "Error text color on dark backgrounds", "wcag": "AA", "deprecated": false } }, "disabled": { - "onDark": { + "default": { "value": "{color.base.gray.200.value}", "public": true, - "onDark": true, + "default": true, "usage": "Disabled text color on dark backgrounds", "wcag": "n/a", "deprecated": false } }, "emphasis": { - "onDark": { + "default": { "value": "{color.brand.midnight.100.value}", "public": true, - "onDark": true, + "default": true, "usage": "Emphasized text color on dark backgrounds", "wcag": "n/a", "deprecated": false diff --git a/src/color-dark/tier.json b/src/color-darkmode/tier.json similarity index 88% rename from src/color-dark/tier.json rename to src/color-darkmode/tier.json index ea4fd45..a66d921 100644 --- a/src/color-dark/tier.json +++ b/src/color-darkmode/tier.json @@ -3,20 +3,20 @@ "tier": { "alaska": { "mvp": { - "onDark": { + "default": { "value": "{color.brand.goldgray.100.value}", "public": true, - "onDark": true, + "default": true, "usage": "MVP tier color for Alaska Airlines", "wcag": "n/a", "deprecated": false } }, "mvpgold": { - "onDark": { + "default": { "value": "{color.brand.gold.100.value}", "public": true, - "onDark": true, + "default": true, "usage": "MVP Gold tier color for Alaska Airlines", "wcag": "n/a", "deprecated": false @@ -35,7 +35,7 @@ "sapphire": { "value": "{color.brand.sapphire.value}", "public": true, - "onDark": true, + "default": true, "usage": "Sapphire tier color for Oneworld", "wcag": "n/a", "deprecated": false @@ -43,7 +43,7 @@ "ruby": { "value": "{color.brand.ruby.value}", "public": true, - "onDark": true, + "default": true, "usage": "Ruby tier color for Oneworld", "wcag": "n/a", "deprecated": false diff --git a/src/color-dark/ui.json b/src/color-darkmode/ui.json similarity index 69% rename from src/color-dark/ui.json rename to src/color-darkmode/ui.json index a39429a..7317e8b 100644 --- a/src/color-dark/ui.json +++ b/src/color-darkmode/ui.json @@ -2,52 +2,52 @@ "color": { "ui": { "default": { - "onDark": { + "default": { "value": "{color.brand.breeze.300.value}", "public": true, - "onDark": true, - "usage": "OnDark interaction color affordance", + "default": true, + "usage": "default interaction color affordance", "wcag": "AAA", "deprecated": false } }, "hover": { - "onDark": { + "default": { "value": "{color.brand.breeze.200.value}", "public": true, - "onDark": true, + "default": true, "usage": "Hover interaction color on dark backgrounds", "wcag": "AAA", "deprecated": false } }, "active": { - "onDark": { + "default": { "value": "{color.brand.breeze.200.value}", "public": true, - "onDark": true, - "usage": "OnDark active state color affordance", + "default": true, + "usage": "default active state color affordance", "wcag": "AAA", "deprecated": false } }, "disabled": { - "onDark": { + "default": { "value": "{color.brand.breeze.300-opacity-30.value}", "public": true, - "onDark": true, - "usage": "OnDark disabled state color affordance", + "default": true, + "usage": "default disabled state color affordance", "wcag": "n/a", "deprecated": false } }, "bkg": { "hover": { - "onDark": { + "default": { "value": "5de3f71a", "public": true, - "onDark": true, - "usage": "Default hover affordance for background colors onDark", + "default": true, + "usage": "Default hover affordance for background colors default", "deprecated": false } }