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 |
|---|
|
...
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
|
...
CSS Custom Prop | Default |
|---|
--adx-elevation-navigation
| 1000
|
...
C. Font Sizes
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
|
...
D. Line Heights
Controls the vertical space between the lines of text. It is the vertical distance between two lines of type, measured from the baseline of one line of type to the baseline of the next.
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
|