This pages documents a subset of the CSS variables that exist in the Aspenware systems that are not going to be user-configurable.
CSS variables that are not user-configurable are currently prefixed with --adx while those that are configurable are prefixed with --ads.
| Table of Contents |
|---|
| minLevel | 1 |
|---|
| maxLevel | 6 |
|---|
| outline | false |
|---|
| type | list |
|---|
| printable | false |
|---|
|
...
...
Theme Designer does NOT have access to --adx prefixed properties are for alignment with the Aspenware Design System and are only configurable by the engineering team.
A. Global Colors
CSS Custom Prop | Default |
|---|
--adx-color-white
| hsl(0deg 0% 100%);
|
--adx-color-black
| hsl(0deg 0% 0%);
|
--adx-color-grey10
| hsl(0deg 0% 13% / 4%)
|
--adx-color-grey15
| hsl(0deg 0% 0% / 4%)
|
--adx-color-grey20
| hsl(218deg 7% 24%)
|
--adx-color-grey25
| hsl(0deg 0% 27%)
|
--adx-color-grey30
| hsl(228deg 3% 37%)
|
--adx-color-grey35
| hsl(0deg 0% 64%)
|
--adx-color-grey40
| hsl(210deg 2% 64%)
|
--adx-color-grey45
| hsl(0deg 0% 73%)
|
--adx-color-grey50
| hsl(0deg 0% 40%)
|
--adx-color-grey60
| hsl(180deg 4% 89%)
|
--adx-color-grey65
| hsl(0deg 0% 93%)
|
--adx-color-grey70
| hsl(0deg 0% 96%)
|
--adx-color-grey-900
| #222
|
--adx-color-neutral-black-400
| #717171
|
--adx-color-error
| #e30000
|
--adx-color-error-backgroundcolor
| #FFF2F4
|
--adx-color-input-border
| #94A3B8
|
--adx-input-backgroundcolor
| 1000
|
--adx-input-bordercolor
| #DDD
|
--adx-input-focus-bordercolor
| #0072C4
|
--adx-input-defaultcolor
| #BDC6D5
|
--adx-input-hovercolor
| --adx-color-grey-900
|
--adx-input-labelcolor
| --adx-color-grey-900
|
...
Determines how big or small the letters are. It defines the height of the text box so that all letters, including ascenders and descenders, can fit.
CSS Custom Prop | Default |
|---|
--adx-font-size-12
| 0.75rem
|
--adx-font-size-14
| 0.875rem
|
--adx-font-size-16
| 1rem
|
--adx-font-size-19
| 1.2rem
|
...
CSS Custom Prop | Default |
|---|
--adx-line-height-12
| 0.75rem
|
--adx-line-height-19
| 1.1875rem
|
--adx-line-height-22
| 1.375rem
|
--adx-line-height-24
| 1.5rem
|
E. Border Radius
Controls the border radius various components
CSS Custom Prop | Default |
|---|
--adx-input-border-radius
| 12px
|