@patternfly/patternfly 6.0.0-alpha.99 → 6.0.0-prerelease.2

package/patternfly-theme-dark-unversioned.scss

@@ -1,6 +0,0 @@
-// stylelint-disable scss/dollar-variable-pattern
-$pf-global--theme--version: '';
-// stylelint-enable
-
-// Version
-@import "patternfly";

package/patternfly-theme-dark.scss

@@ -1 +0,0 @@
-// intentionally left empty

package/sass-utilities/_all.scss

@@ -1,9 +0,0 @@
-// These imports must not contain any rendered output
-@import "./div";
-@import "./functions";
-@import "./colors";
-@import "./scss-variables";
-@import "./mixins";
-@import "./component-namespaces";
-@import "./layout-namespaces";
-@import "./placeholders";

package/sass-utilities/colors.scss

@@ -1,82 +0,0 @@
-// Colors
-$pf-v5-color-black-100:             #fafafa !default;
-$pf-v5-color-black-150:             #f5f5f5 !default;
-$pf-v5-color-black-200:             #f0f0f0 !default;
-$pf-v5-color-black-300:             #d2d2d2 !default;
-$pf-v5-color-black-400:             #b8bbbe !default;
-$pf-v5-color-black-500:             #8a8d90 !default;
-$pf-v5-color-black-600:             #6a6e73 !default;
-$pf-v5-color-black-700:             #4f5255 !default;
-$pf-v5-color-black-800:             #3c3f42 !default;
-$pf-v5-color-black-850:             #212427 !default;
-$pf-v5-color-black-900:             #151515 !default;
-$pf-v5-color-black-1000:            #030303 !default;
-$pf-v5-color-blue-50:               #e7f1fa !default;
-$pf-v5-color-blue-100:              #bee1f4 !default;
-$pf-v5-color-blue-200:              #73bcf7 !default;
-$pf-v5-color-blue-300:              #2b9af3 !default;
-$pf-v5-color-blue-400:              #06c !default;
-$pf-v5-color-blue-500:              #004080 !default;
-$pf-v5-color-blue-600:              #002952 !default;
-$pf-v5-color-blue-700:              #001223 !default;
-$pf-v5-color-cyan-50:               #f2f9f9 !default;
-$pf-v5-color-cyan-100:              #a2d9d9 !default;
-$pf-v5-color-cyan-200:              #73c5c5 !default;
-$pf-v5-color-cyan-300:              #009596 !default;
-$pf-v5-color-cyan-400:              #005f60 !default;
-$pf-v5-color-cyan-500:              #003737 !default;
-$pf-v5-color-cyan-600:              #002323 !default;
-$pf-v5-color-cyan-700:              #000f0f !default;
-$pf-v5-color-gold-50:               #fdf7e7 !default;
-$pf-v5-color-gold-100:              #f9e0a2 !default;
-$pf-v5-color-gold-200:              #f6d173 !default;
-$pf-v5-color-gold-300:              #f4c145 !default;
-$pf-v5-color-gold-400:              #f0ab00 !default;
-$pf-v5-color-gold-500:              #c58c00 !default;
-$pf-v5-color-gold-600:              #795600 !default;
-$pf-v5-color-gold-700:              #3d2c00 !default;
-$pf-v5-color-green-50:              #f3faf2 !default;
-$pf-v5-color-green-100:             #bde5b8 !default;
-$pf-v5-color-green-200:             #95d58e !default;
-$pf-v5-color-green-300:             #6ec664 !default;
-$pf-v5-color-green-400:             #5ba352 !default;
-$pf-v5-color-green-500:             #3e8635 !default;
-$pf-v5-color-green-600:             #1e4f18 !default;
-$pf-v5-color-green-700:             #0f280d !default;
-$pf-v5-color-light-blue-100:        #beedf9 !default;
-$pf-v5-color-light-blue-200:        #7cdbf3 !default;
-$pf-v5-color-light-blue-300:        #35caed !default;
-$pf-v5-color-light-blue-400:        #00b9e4 !default;
-$pf-v5-color-light-blue-500:        #008bad !default;
-$pf-v5-color-light-blue-600:        #005c73 !default;
-$pf-v5-color-light-blue-700:        #002d39 !default;
-$pf-v5-color-light-green-100:       #e4f5bc !default;
-$pf-v5-color-light-green-200:       #c8eb79 !default;
-$pf-v5-color-light-green-300:       #ace12e !default;
-$pf-v5-color-light-green-400:       #92d400 !default;
-$pf-v5-color-light-green-500:       #6ca100 !default;
-$pf-v5-color-light-green-600:       #486b00 !default;
-$pf-v5-color-light-green-700:       #253600 !default;
-$pf-v5-color-orange-50:             #fff6ec !default;
-$pf-v5-color-orange-100:            #f4b678 !default;
-$pf-v5-color-orange-200:            #ef9234 !default;
-$pf-v5-color-orange-300:            #ec7a08 !default;
-$pf-v5-color-orange-400:            #c46100 !default;
-$pf-v5-color-orange-500:            #8f4700 !default;
-$pf-v5-color-orange-600:            #773d00 !default;
-$pf-v5-color-orange-700:            #3b1f00 !default;
-$pf-v5-color-purple-50:             #f2f0fc !default;
-$pf-v5-color-purple-100:            #cbc1ff !default;
-$pf-v5-color-purple-200:            #b2a3ff !default;
-$pf-v5-color-purple-300:            #a18fff !default;
-$pf-v5-color-purple-400:            #8476d1 !default;
-$pf-v5-color-purple-500:            #6753ac !default;
-$pf-v5-color-purple-600:            #40199a !default;
-$pf-v5-color-purple-700:            #1f0066 !default;
-$pf-v5-color-red-50:                #faeae8 !default;
-$pf-v5-color-red-100:               #c9190b !default;
-$pf-v5-color-red-200:               #a30000 !default;
-$pf-v5-color-red-300:               #7d1007 !default;
-$pf-v5-color-red-400:               #470000 !default;
-$pf-v5-color-red-500:               #2c0000 !default;
-$pf-v5-color-white:                 #fff !default;

package/sass-utilities/div.import.scss

@@ -1,3 +0,0 @@
-// This will only be imported by dart-sass thanks to the `.import` extension.
-// See https://github.com/patternfly/patternfly/issues/4096#issuecomment-859055362
-@forward "sass:math" show div;

package/sass-utilities/div.scss

@@ -1,4 +0,0 @@
-// Fallback for node-sass
-@function div($number1, $number2) {
-  @return $number1 / $number2;
-}

package/sass-utilities/placeholders.scss

@@ -1,72 +0,0 @@
-%pf-v5-t-light {
-  --#{$pf-global}--Color--100: var(--#{$pf-global}--Color--dark-100);
-  --#{$pf-global}--Color--200: var(--#{$pf-global}--Color--dark-200);
-  --#{$pf-global}--BorderColor--100: var(--#{$pf-global}--BorderColor--dark-100);
-  --#{$pf-global}--primary-color--100: var(--#{$pf-global}--primary-color--dark-100);
-  --#{$pf-global}--link--Color: var(--#{$pf-global}--link--Color--dark);
-  --#{$pf-global}--link--Color--hover: var(--#{$pf-global}--link--Color--dark--hover);
-  --#{$pf-global}--BackgroundColor--100: var(--#{$pf-global}--BackgroundColor--light-100);
-  --#{$pf-global}--icon--Color--light: var(--#{$pf-global}--icon--Color--light--dark);
-  --#{$pf-global}--icon--Color--dark: var(--#{$pf-global}--icon--Color--dark--dark);
-}
-
-%pf-v5-t-dark {
-  --#{$pf-global}--Color--100: var(--#{$pf-global}--Color--light-100);
-  --#{$pf-global}--Color--200: var(--#{$pf-global}--Color--light-200);
-  --#{$pf-global}--BorderColor--100: var(--#{$pf-global}--BorderColor--light-100);
-  --#{$pf-global}--primary-color--100: var(--#{$pf-global}--primary-color--light-100);
-  --#{$pf-global}--link--Color: var(--#{$pf-global}--link--Color--light);
-  --#{$pf-global}--link--Color--hover: var(--#{$pf-global}--link--Color--light);
-  --#{$pf-global}--BackgroundColor--100: var(--#{$pf-global}--BackgroundColor--dark-100);
-  --#{$pf-global}--icon--Color--light: var(--#{$pf-global}--icon--Color--light--light);
-  --#{$pf-global}--icon--Color--dark: var(--#{$pf-global}--icon--Color--dark--light);
-
-  .#{$button} {
-    --#{$button}--m-primary--BackgroundColor: var(--#{$pf-global}--primary-color--dark-100);
-  }
-}
-
-// stylelint-disable
-%pf-v5-hidden-visible {
-  // base value for visible display property is set to 'block' by default and passed in to
-  // placeholder via `pf-v5-hidden-visible` mixin
-
-  // set hidden var values
-  --pf-v5-hidden-visible--hidden--Display: none;
-
-  // set visibile var values
-  --pf-v5-hidden-visible--Display: var(--pf-v5-hidden-visible--visible--Display);
-
-  // set default state to visible
-  display: var(--pf-v5-hidden-visible--Display);
-
-  // toggle values based on state
-  &.pf-m-hidden {
-    --pf-v5-hidden-visible--Display: var(--pf-v5-hidden-visible--hidden--Display);
-  }
-
-  @each $size, $bp in $pf-v5-global--breakpoint-name-map {
-    @media screen and (min-width: $bp) {
-      &.pf-m-hidden-on-#{$size} {
-        --pf-v5-hidden-visible--Display: var(--pf-v5-hidden-visible--hidden--Display);
-      }
-
-      &.pf-m-visible-on-#{$size} {
-        --pf-v5-hidden-visible--Display: var(--pf-v5-hidden-visible--visible--Display);
-      }
-    }
-  }
-}
-// stylelint-enable
-
-%pf-v5-remove-num-arrows {
-  appearance: textfield;
-
-  // stylelint-disable
-  &::-webkit-inner-spin-button,
-  &::-webkit-outer-spin-button {
-  // stylelint-enable
-    margin: 0;
-    appearance: none;
-  }
-}

package/sass-utilities/themes/dark/_all.scss

@@ -1,4 +0,0 @@
-@import "colors";
-@import "scss-variables";
-@import "placeholders";
-@import "mixins";

package/sass-utilities/themes/dark/colors.scss

@@ -1,16 +0,0 @@
-// color palette changes
-$pf-v5-color-black-50: #e0e0e0;
-$pf-v5-color-black-100: #c6c7c8;
-$pf-v5-color-black-200: #aaabac;
-$pf-v5-color-black-300: #868789;
-$pf-v5-color-black-400: #57585a;
-$pf-v5-color-black-500: #444548;
-$pf-v5-color-black-600: #36373a;
-$pf-v5-color-black-700: #26292d;
-$pf-v5-color-black-800: #1b1d21;
-$pf-v5-color-black-850: #212427;
-$pf-v5-color-black-900: #0f1214;
-$pf-v5-color-black-1000: #030303;
-$pf-v5-color-red-9999: #fe5142;
-$pf-v5-color-red-8888: #ff7468;
-$pf-v5-color-blue-300: #1fa7f8;

package/sass-utilities/themes/dark/mixins.scss

@@ -1,7 +0,0 @@
-@mixin pf-v5-theme-dark--t-dark($color: "--#{$pf-global}--Color--100") {
-  @if $color {
-    color: var(#{$color});
-  }
-
-  @extend %pf-v5-theme-dark--t-dark;
-}

package/sass-utilities/themes/dark/placeholders.scss

@@ -1,5 +0,0 @@
-%pf-v5-theme-dark--t-dark {
-  .#{$button} {
-    --#{$button}--m-primary--BackgroundColor: var(--#{$pf-global}--primary-color--300);
-  }
-}

package/sass-utilities/themes/dark/scss-variables.scss

@@ -1,92 +0,0 @@
-// background colors
-$pf-v5-global--BackgroundColor--100: $pf-v5-color-black-800; // primary background color
-$pf-v5-global--BackgroundColor--150: $pf-v5-color-black-850; // in-between special use case background color
-$pf-v5-global--BackgroundColor--200: $pf-v5-color-black-900; // secondary background color
-$pf-v5-global--BackgroundColor--300: $pf-v5-color-black-700; // floats on top of other elements
-$pf-v5-global--BackgroundColor--400: $pf-v5-color-black-600; // form control & item hover on --#{$pf-global}--BackgroundColor--300
-$pf-v5-global--BorderColor--100: $pf-v5-color-black-500; // primary border color
-$pf-v5-global--BorderColor--200: $pf-v5-color-black-500; // secondary border color
-$pf-v5-global--BorderColor--300: $pf-v5-color-black-400;
-$pf-v5-global--BorderColor--400: $pf-v5-color-black-200; // form control bottom border
-
-// text colors
-$pf-v5-global--Color--100: $pf-v5-color-black-50; // primary text color
-$pf-v5-global--Color--200: $pf-v5-color-black-200; // secondary text color
-$pf-v5-global--active-color--100: $pf-v5-color-blue-300;
-$pf-v5-global--primary-color--100: $pf-v5-color-blue-300; // primary blue against dark background - background, text, etc
-$pf-v5-global--primary-color--300: $pf-v5-color-blue-400; // primary blue with white text on top for contrast
-$pf-v5-global--primary-color--400: $pf-v5-color-white; // text color on top of primary--300
-$pf-v5-global--custom-color--200: $pf-v5-color-cyan-200;
-$pf-v5-global--success-color--100: $pf-v5-color-green-400;
-$pf-v5-global--warning-color--100: $pf-v5-color-gold-400;
-$pf-v5-global--warning-color--200: $pf-v5-color-gold-300;
-$pf-v5-global--danger-color--100: $pf-v5-color-red-9999;
-$pf-v5-global--danger-color--200: $pf-v5-color-red-8888;
-$pf-v5-global--link--Color: $pf-v5-color-blue-300;
-$pf-v5-global--link--Color--hover: $pf-v5-color-blue-200;
-$pf-v5-global--link--Color--visited: $pf-v5-color-purple-300;
-$pf-v5-global--disabled-color--100: $pf-v5-color-black-300; // disabled text on regular background color
-$pf-v5-global--disabled-color--200: $pf-v5-color-black-500; // disabled background color
-$pf-v5-global--disabled-color--300: $pf-v5-color-black-200; // disabled text on disabled or floating background color - except form elements
-
-// icons
-$pf-v5-global--icon--Color--light: $pf-v5-color-black-200;
-$pf-v5-global--icon--Color--dark: $pf-v5-color-black-50;
-
-// theme color resets
-$pf-v5-global--Color--dark-100: $pf-v5-global--Color--100;
-$pf-v5-global--Color--dark-200: $pf-v5-global--Color--200;
-$pf-v5-global--Color--light-100: $pf-v5-global--Color--100;
-$pf-v5-global--Color--light-200: $pf-v5-global--Color--200;
-$pf-v5-global--Color--light-300: $pf-v5-global--Color--300;
-$pf-v5-global--BorderColor--dark-100: $pf-v5-global--BorderColor--100;
-$pf-v5-global--BorderColor--light-100: $pf-v5-global--BorderColor--100;
-$pf-v5-global--primary-color--light-100: $pf-v5-global--primary-color--100;
-$pf-v5-global--primary-color--dark-100: $pf-v5-global--primary-color--100;
-$pf-v5-global--link--Color--light: $pf-v5-global--link--Color;
-$pf-v5-global--link--Color--light--hover: $pf-v5-global--link--Color--hover;
-$pf-v5-global--link--Color--dark: $pf-v5-global--link--Color;
-$pf-v5-global--link--Color--dark--hover: $pf-v5-global--link--Color--hover;
-$pf-v5-global--BackgroundColor--light-100: $pf-v5-global--BackgroundColor--100;
-$pf-v5-global--BackgroundColor--light-200: $pf-v5-global--BackgroundColor--200;
-$pf-v5-global--BackgroundColor--light-300: $pf-v5-global--BackgroundColor--300;
-$pf-v5-global--BackgroundColor--dark-100: $pf-v5-global--BackgroundColor--100;
-$pf-v5-global--BackgroundColor--dark-200: $pf-v5-global--BackgroundColor--200;
-$pf-v5-global--BackgroundColor--dark-300: $pf-v5-global--BackgroundColor--300;
-$pf-v5-global--BackgroundColor--dark-400: $pf-v5-global--BackgroundColor--400;
-$pf-v5-global--icon--Color--light--dark: $pf-v5-global--icon--Color--light;
-$pf-v5-global--icon--Color--dark--dark: $pf-v5-global--icon--Color--dark;
-$pf-v5-global--icon--Color--light--light: $pf-v5-global--icon--Color--light;
-$pf-v5-global--icon--Color--dark--light: $pf-v5-global--icon--Color--dark;
-
-// Shadows
-// small
-$pf-v5-global--BoxShadow--sm: 0 pf-size-prem(1px) pf-size-prem(2px) 0 rgba($pf-v5-color-black-1000, .48), 0 0 pf-size-prem(2px) 0 rgba($pf-v5-color-black-1000, .24);
-$pf-v5-global--BoxShadow--sm-top: 0 pf-size-prem(-2px) pf-size-prem(4px) pf-size-prem(-1px) rgba($pf-v5-color-black-1000, .64);
-$pf-v5-global--BoxShadow--sm-right: pf-size-prem(2px) 0 pf-size-prem(4px) pf-size-prem(-1px) rgba($pf-v5-color-black-1000, .64);
-$pf-v5-global--BoxShadow--sm-bottom: 0 pf-size-prem(2px) pf-size-prem(4px) pf-size-prem(-1px) rgba($pf-v5-color-black-1000, .64);
-$pf-v5-global--BoxShadow--sm-left: pf-size-prem(-2px) 0 pf-size-prem(4px) pf-size-prem(-1px) rgba($pf-v5-color-black-1000, .64);
-
-// medium
-$pf-v5-global--BoxShadow--md: 0 pf-size-prem(4px) pf-size-prem(8px) pf-size-prem(0) rgba($pf-v5-color-black-1000, .48), 0 0 pf-size-prem(4px) 0 rgba($pf-v5-color-black-1000, .24);
-$pf-v5-global--BoxShadow--md-top: 0 pf-size-prem(-8px) pf-size-prem(8px) pf-size-prem(-6px) rgba($pf-v5-color-black-1000, .72);
-$pf-v5-global--BoxShadow--md-right: pf-size-prem(8px) 0 pf-size-prem(8px) pf-size-prem(-6px) rgba($pf-v5-color-black-1000, .72);
-$pf-v5-global--BoxShadow--md-bottom: 0 pf-size-prem(8px) pf-size-prem(8px) pf-size-prem(-6px) rgba($pf-v5-color-black-1000, .72);
-$pf-v5-global--BoxShadow--md-left: pf-size-prem(-8px) 0 pf-size-prem(8px) pf-size-prem(-6px) rgba($pf-v5-color-black-1000, .72);
-
-// large
-$pf-v5-global--BoxShadow--lg: 0 pf-size-prem(8px) pf-size-prem(16px) 0 rgba($pf-v5-color-black-1000, .64), 0 0 pf-size-prem(6px) 0 rgba($pf-v5-color-black-1000, .32);
-$pf-v5-global--BoxShadow--lg-top: 0 pf-size-prem(-12px) pf-size-prem(12px) pf-size-prem(-8px) rgba($pf-v5-color-black-1000, .72);
-$pf-v5-global--BoxShadow--lg-right: pf-size-prem(12px) 0 pf-size-prem(12px) pf-size-prem(-8px) rgba($pf-v5-color-black-1000, .72);
-$pf-v5-global--BoxShadow--lg-bottom: 0 pf-size-prem(12px) pf-size-prem(12px) pf-size-prem(-8px) rgba($pf-v5-color-black-1000, .72);
-$pf-v5-global--BoxShadow--lg-left: pf-size-prem(-12px) 0 pf-size-prem(12px) pf-size-prem(-8px) rgba($pf-v5-color-black-1000, .72);
-
-// x-large
-$pf-v5-global--BoxShadow--xl: 0 pf-size-prem(16px) pf-size-prem(32px) 0 rgba($pf-v5-color-black-1000, .64), 0 0 pf-size-prem(8px) 0 rgba($pf-v5-color-black-1000, .4);
-$pf-v5-global--BoxShadow--xl-top: 0 pf-size-prem(-16px) pf-size-prem(16px) pf-size-prem(-8px) rgba($pf-v5-color-black-1000, .8);
-$pf-v5-global--BoxShadow--xl-right: pf-size-prem(16px) 0 pf-size-prem(16px) pf-size-prem(-8px) rgba($pf-v5-color-black-1000, .8);
-$pf-v5-global--BoxShadow--xl-bottom: 0 pf-size-prem(16px) pf-size-prem(16px) pf-size-prem(-8px) rgba($pf-v5-color-black-1000, .8);
-$pf-v5-global--BoxShadow--xl-left: pf-size-prem(-16px) 0 pf-size-prem(16px) pf-size-prem(-8px) rgba($pf-v5-color-black-1000, .8);
-
-// inset
-$pf-v5-global--BoxShadow--inset: inset 0 0 pf-size-prem(10) 0 $pf-v5-color-black-1000;

package/themes/dark/_patternfly-charts-theme-dark.scss

@@ -1,98 +0,0 @@
-@import "../../base/themes/dark/chart-globals";
-
-@mixin pf-v5-charts-theme-dark($pf-v5-charts-theme-dark-class: "") {
-  // stylelint-disable
-  .#{$chart} {
-    svg g[clip-path] {
-      mix-blend-mode: normal;
-    }
-  }
-
-  & {
-    // colors
-    --#{$chart}-color-blue-100: #{$pf-v5-chart-color-blue-100};
-    --#{$chart}-color-blue-200: #{$pf-v5-chart-color-blue-200};
-    --#{$chart}-color-blue-300: #{$pf-v5-chart-color-blue-300};
-    --#{$chart}-color-blue-400: #{$pf-v5-chart-color-blue-400};
-    --#{$chart}-color-blue-500: #{$pf-v5-chart-color-blue-500};
-    --#{$chart}-color-green-100: #{$pf-v5-chart-color-green-100};
-    --#{$chart}-color-green-200: #{$pf-v5-chart-color-green-200};
-    --#{$chart}-color-green-300: #{$pf-v5-chart-color-green-300};
-    --#{$chart}-color-green-400: #{$pf-v5-chart-color-green-400};
-    --#{$chart}-color-green-500: #{$pf-v5-chart-color-green-500};
-    --#{$chart}-color-cyan-100: #{$pf-v5-chart-color-cyan-100};
-    --#{$chart}-color-cyan-200: #{$pf-v5-chart-color-cyan-200};
-    --#{$chart}-color-cyan-300: #{$pf-v5-chart-color-cyan-300};
-    --#{$chart}-color-cyan-400: #{$pf-v5-chart-color-cyan-400};
-    --#{$chart}-color-cyan-500: #{$pf-v5-chart-color-cyan-500};
-    --#{$chart}-color-purple-100: #{$pf-v5-chart-color-purple-100};
-    --#{$chart}-color-purple-200: #{$pf-v5-chart-color-purple-200};
-    --#{$chart}-color-purple-300: #{$pf-v5-chart-color-purple-300};
-    --#{$chart}-color-purple-400: #{$pf-v5-chart-color-purple-400};
-    --#{$chart}-color-purple-500: #{$pf-v5-chart-color-purple-500};
-    --#{$chart}-color-red-100: #{$pf-v5-chart-color-red-100};
-    --#{$chart}-color-red-200: #{$pf-v5-chart-color-red-200};
-    --#{$chart}-color-red-300: #{$pf-v5-chart-color-red-300};
-    --#{$chart}-color-red-400: #{$pf-v5-chart-color-red-400};
-    --#{$chart}-color-red-500: #{$pf-v5-chart-color-red-500};
-
-    // globals
-    --#{$chart}-global--BorderColor: var(--#{$pf-global}--BorderColor--100);
-    --#{$chart}-global--BorderColor--accent: var(--#{$pf-global}--BorderColor--400);
-    --#{$chart}-global--label--Fill: var(--#{$pf-global}--Color--100);
-    --#{$chart}-global--title--Fill: var(--#{$pf-global}--Color--100);
-    --#{$chart}-global--subtitle--Fill: var(--#{$pf-global}--Color--200);
-    --#{$chart}-global--tooltip--Fill: var(--#{$pf-global}--Color--100);
-    --#{$chart}-global--tooltip--bg--Fill: var(--#{$pf-global}--BackgroundColor--300);
-    --#{$chart}-global--tooltip--BorderWidth: 1;
-    --#{$chart}-global--tooltip--BorderColor: var(--#{$pf-global}--BorderColor--300);
-
-    // axis
-    --#{$chart}-axis--axis--stroke--Color: var(--#{$chart}-global--BorderColor);
-    --#{$chart}-axis--grid--stroke--Color: var(--#{$chart}-global--BorderColor);
-    --#{$chart}-axis--tick--stroke--Color: var(--#{$chart}-global--BorderColor);
-    --#{$chart}-axis--axis--tick--stroke--Color: var(--#{$chart}-global--BorderColor);
-    --#{$chart}-axis--grid--Fill: var(--#{$chart}-global--BorderColor);
-    --#{$chart}-axis--tick-label--Fill: var(--#{$chart}-global--label--Fill);
-
-    // bullet
-    --#{$chart}-bullet--label--title--Fill: var(--#{$chart}-global--title--Fill);
-    --#{$chart}-bullet--label--grouptitle--Fill: var(--#{$chart}-bullet--label--title--Fill); // shares title styles
-    --#{$chart}-bullet--label--subtitle--Fill: var(--#{$chart}-global--subtitle--Fill);
-    --#{$chart}-bullet--negative-measure--ColorScale--100: var(--#{$pf-global}--palette--red-400);
-    --#{$chart}-bullet--negative-measure--ColorScale--200: var(--#{$pf-global}--palette--red-300);
-    --#{$chart}-bullet--negative-measure--ColorScale--300: var(--#{$pf-global}--palette--red-200);
-    --#{$chart}-bullet--negative-measure--ColorScale--400: var(--#{$pf-global}--palette--red-100);
-    --#{$chart}-bullet--negative-measure--ColorScale--500: var(--#{$pf-global}--palette--red-9999);
-    --#{$chart}-bullet--qualitative-range--ColorScale--100: var(--#{$pf-global}--palette--black-600);
-    --#{$chart}-bullet--qualitative-range--ColorScale--200: var(--#{$pf-global}--palette--black-500);
-    --#{$chart}-bullet--qualitative-range--ColorScale--300: var(--#{$pf-global}--palette--black-400);
-    --#{$chart}-bullet--qualitative-range--ColorScale--400: var(--#{$pf-global}--palette--black-300);
-    --#{$chart}-bullet--qualitative-range--ColorScale--500: var(--#{$pf-global}--palette--black-200);
-
-    // container
-    --#{$chart}-container--cursor--line--Fill: var(--#{$chart}-global--BorderColor--accent);
-
-    // donut
-    --#{$chart}-donut--label--title--Fill: var(--#{$chart}-global--title--Fill);
-    --#{$chart}-donut--label--subtitle--Fill: var(--#{$chart}-global--subtitle--Fill);
-
-    // lines
-    --#{$chart}-line--data--stroke--Color: var(--#{$chart}-global--BorderColor);
-
-    // Tooltips
-
-    // text color
-    --#{$chart}-tooltip--Fill: var(--#{$chart}-global--tooltip--Fill);
-    --#{$chart}-voronoi--labels--Fill: var(--#{$chart}-global--tooltip--Fill);
-    // background color
-    --#{$chart}-tooltip--flyoutStyle--Fill: var(--#{$chart}-global--tooltip--bg--Fill);
-    --#{$chart}-voronoi--flyout--stroke--Fill: var(--#{$chart}-global--tooltip--bg--Fill);
-    // border
-    --#{$chart}-tooltip--flyoutStyle--stroke--Width: var(--#{$chart}-global--tooltip--BorderWidth);
-    --#{$chart}-tooltip--flyoutStyle--stroke--Color: var(--#{$chart}-global--tooltip--BorderColor);
-    --#{$chart}-voronoi--flyout--stroke--Width: var(--#{$chart}-global--tooltip--BorderWidth);
-    --#{$chart}-voronoi--flyout--stroke--Color: var(--#{$chart}-global--tooltip--BorderColor);
-  }
-  // stylelint-enable
-}