Category Colors
Intended audience: ADMINISTRATORS DEVELOPERS
AO Platform: 3.5
Overview
This topic describes the style configurations for Category Colors.
Variable Names
--vux-success-700
CSS Variable Name | --vux-success-700 |
|---|---|
Light |  |
Dark |  |
Description
Used for success button hover background color
Examples
success button hover background color
Switch handle checked background
--vux-success-600
CSS Variable Name | --vux-success-600 |
|---|---|
Light |  |
Dark |  |
Description
Used for view-template-dot background in file manager
Examples
view-template-dot background in file manager
--vux-success-500
CSS Variable Name | --vux-success-500 |
|---|---|
Light |  |
Dark |  |
Description
Used for success background color
Examples
Success button background color
Annotations panel approved status
Json diff missing line indication green text color
Webix success message alert text color
--vux-success-300
CSS Variable Name | --vux-success-300 |
|---|---|
Light |  |
Dark |  |
Description
Used for success light color
Examples
On/Off toggle switch handle background
Webix success message border
In webvowl label datatype, datatypeproperty fill color
--vux-success-100
CSS Variable Name | --vux-success-100 |
|---|---|
Light |  |
Dark |  |
Description
Used for very light success color
Examples
Pivot webix_column webix_max background
Success message background
json difference codeline -> missing background
--vux-error-700
CSS Variable Name | --vux-error-700 |
|---|---|
Light |  |
Dark |  |
Description
Used for dark red color
Examples
Notification bell icon badge background
ao-vux-listedit-controls hover color in TOC
webix_error message text color
--vux-error-500
CSS Variable Name | --vux-error-500 |
|---|---|
Light |  |
Dark |  |
Description
Used for error background and color
Examples
Uploader progress error background color
Webix danger button background
Error message input bottom label color
ao-vux-ac-card-status rejected color
--vux-error-300
CSS Variable Name | --vux-error-300 |
|---|---|
Light |  |
Dark |  |
Description
Used for invalid input, invalid radio, invalid inp_static, invalid select border color
Examples
invalid input, invalid radio, invalid inp_static, invalid select border color
--vux-error-100
CSS Variable Name | --vux-error-100 |
|---|---|
Light |  |
Dark |  |
Description
Used for webix error message background
Examples
.Webix error message background
codeLine type background color
invalid input, invalid radio, invalid inp_static, invalid select background color
--vux-danger-500
CSS Variable Name | --vux-danger-500 |
|---|---|
Light |  |
Dark |  |
Description
Used for danger red color
Examples
Invalid multicombo_value, invalid multicombo_tag
webix_remove_upload .cancel_icon hover color
webix_upload_error .error_icon color
invalidStyle color
--vux-danger-300
CSS Variable Name | --vux-danger-300 |
|---|---|
Light |  |
Dark |  |
Description
Used for webix error message alert border color
Examples
webix error message alert border color
invalidStyle background color
invalid .webix_inp_bottom_label color
incompleted background in schedular
Danger button active background
webix_warning > div color
--vux-danger-100
CSS Variable Name | --vux-danger-100 |
|---|---|
Light |  |
Dark |  |
Description
Used for webix danger button text on hover
Examples
webix danger button text on hover
--vux-loader-700
CSS Variable Name | --vux-loader-700 |
|---|---|
Light |  |
Dark |  |
Description
Used for entity Search highlight background
Examples
Entity Search highlight background
TOC results text color
--vux-loader-500
CSS Variable Name | --vux-loader-500 |
|---|---|
Light |  |
Dark |  |
Description
Used for ao-vux-annotation-close button icon background color in annotate window.
Examples
ao-vux-annotation-close button icon background color in annotate window.
Annotate window highlight border.
Inprogress background in scheduler
--vux-loader-300
CSS Variable Name | --vux-loader-300 |
|---|---|
Light |  |
Dark |  |
Description
Used for webix_badge background color
Examples
In Webix list item for webix_badge background color
Entity-tagger highlight-yellow tag class background color
--vux-loader-100
CSS Variable Name | --vux-loader-100 |
|---|---|
Light |  |
Dark |  |
Description
Used for TOC results text background color
Examples
TOC results text background color
Background for pre-annotation-dialog-window
--vux-document-flag-circle
CSS Variable Name | --vux-document-flag-circle |
|---|---|
Light |  |
Dark |  |
Description
Currently not using because of template, style overrides in solution
Examples
.vux_doccontent_content dot background
vux_doccontent_flag_selected_circle background