| action-bar-border-color |
color-set |
- |
light: rgba(255, 255, 255, 0) %22%3E%3Crect%20width%3D%2216%22%20height%3D%2216%22%20fill%3D%22%23fff%22%2F%3E%3Crect%20x%3D%220%22%20y%3D%220%22%20width%3D%228%22%20height%3D%228%22%20fill%3D%22%23e1e1e1%22%2F%3E%3Crect%20x%3D%228%22%20y%3D%228%22%20width%3D%228%22%20height%3D%228%22%20fill%3D%22%23e1e1e1%22%2F%3E%3Crect%20width%3D%2216%22%20height%3D%2216%22%20fill%3D%22rgba(255%2C%20255%2C%20255%2C%200)%22%2F%3E%3Crect%20width%3D%2215%22%20height%3D%2215%22%20x%3D%220.5%22%20y%3D%220.5%22%20rx%3D%222.5%22%20fill%3D%22none%22%20stroke%3D%22rgba(0%2C0%2C0%2C0.42)%22%20stroke-width%3D%221%22%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E)
dark: rgb(68, 68, 68) %22%3E%3Crect%20width%3D%2216%22%20height%3D%2216%22%20fill%3D%22rgb(68%2C%2068%2C%2068)%22%2F%3E%3Crect%20width%3D%2215%22%20height%3D%2215%22%20x%3D%220.5%22%20y%3D%220.5%22%20rx%3D%222.5%22%20fill%3D%22none%22%20stroke%3D%22rgba(0%2C0%2C0%2C0.42)%22%20stroke-width%3D%221%22%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E)
wireframe: rgba(255, 255, 255, 0) %22%3E%3Crect%20width%3D%2216%22%20height%3D%2216%22%20fill%3D%22%23fff%22%2F%3E%3Crect%20x%3D%220%22%20y%3D%220%22%20width%3D%228%22%20height%3D%228%22%20fill%3D%22%23e1e1e1%22%2F%3E%3Crect%20x%3D%228%22%20y%3D%228%22%20width%3D%228%22%20height%3D%228%22%20fill%3D%22%23e1e1e1%22%2F%3E%3Crect%20width%3D%2216%22%20height%3D%2216%22%20fill%3D%22rgba(255%2C%20255%2C%20255%2C%200)%22%2F%3E%3Crect%20width%3D%2215%22%20height%3D%2215%22%20x%3D%220.5%22%20y%3D%220.5%22%20rx%3D%222.5%22%20fill%3D%22none%22%20stroke%3D%22rgba(0%2C0%2C0%2C0.42)%22%20stroke-width%3D%221%22%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E) |
No |
- |
- |
| action-bar-bottom-to-content-area |
alias |
{spacing-200} |
12px |
Yes |
Use semantic token banner-padding-vertical instead. |
Replaced by padding-vertical |
| action-bar-close-button-to-counter |
alias |
{text-to-control-50} |
desktop: 4px
mobile: 5px |
Yes |
Use semantic token group-gap-extra-small instead. |
Replaced by group-gap-extra-small |
| action-bar-counter-font-size |
alias |
{font-size-100} |
desktop: 14px
mobile: 17px |
No |
- |
- |
| action-bar-edge-to-content-area |
alias |
{spacing-100} |
8px |
Yes |
Use semantic token banner-padding-horizontal-compact instead. |
Replaced by banner-padding-horizontal-compact |
| action-bar-height |
alias |
{component-height-400} |
desktop: 56px
mobile: 70px |
No |
- |
- |
| action-bar-label-to-action-group-area |
alias |
{spacing-300} |
16px |
Yes |
Use semantic token banner-gap-horizontal instead. |
Replaced by gap-horizontal |
| action-bar-minimum-width |
dimension |
176px |
176px |
No |
- |
- |
| action-bar-top-to-content-area |
alias |
{spacing-200} |
12px |
Yes |
Use semantic token banner-padding-vertical instead. |
Replaced by padding-vertical |
| action-bar-top-to-item-counter |
alias |
{component-top-to-text-300} |
desktop: 12px
mobile: 15px |
Yes |
Use semantic token banner-padding-vertical instead. |
Replaced by padding-vertical |