Core Variables
Total variables detected in Core.css: 1095
This generated document outlines a list of CSS variables detected in various production files, and their values across various selectors. Each variable is labeled with a prefix, followed by the component name, and the corresponding CSS property for the variable:
--{prefix}-{component-name}-{css-property}The following variable prefixes are interpreted as follows:
| Variable Prefix | Description |
|---|---|
| --ut, --u | Variables used across components. |
| --a | Variables imported from App UI. |
| --oj | Variables used in Oracle JavaScript Extension Toolkit components (JET). |
| --jui | Variables used in jQuery components. |
| --js | Variables used by Javascript. |
| --fc, --fc3 | Variables used in Full Calendar components (v3 & v5). |
| --rw | Variables used in Redwood components. |
--js-mq-xs
| Selector | Value | Color |
|---|---|---|
:root |
480px |
--js-mq-sm
| Selector | Value | Color |
|---|---|---|
:root |
640px |
--js-mq-md
| Selector | Value | Color |
|---|---|---|
:root |
768px |
--js-mq-lg
| Selector | Value | Color |
|---|---|---|
:root |
992px |
--js-mq-xl
| Selector | Value | Color |
|---|---|---|
:root |
1200px |
--js-mq-xxl
| Selector | Value | Color |
|---|---|---|
:root |
1400px |
--js-sticky-top
| Selector | Value | Color |
|---|---|---|
:root |
0rem | |
.t-Body-nav |
0rem | |
.t-Body-title |
0 | |
.t-Body-actions |
0 |
--js-page-title-height
| Selector | Value | Color |
|---|---|---|
:root |
0rem | |
.t-Body-side |
0 |
--ut-color-scheme
| Selector | Value | Color |
|---|---|---|
:root |
normal |
--a-base-font-family
| Selector | Value | Color |
|---|---|---|
:root |
system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen, Ubuntu, Cantarell, "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif |
--a-base-font-family-serif
| Selector | Value | Color |
|---|---|---|
:root |
"Iowan Old Style", "Apple Garamond", Baskerville, "Times New Roman", "Droid Serif", Times, "Source Serif Pro", serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol" |
--a-base-font-family-mono
| Selector | Value | Color |
|---|---|---|
:root |
ui-monospace, "Menlo", "Consolas", mono-space, monospace | |
code,
pre |
monospace | |
.t-Alert--page .htmldbOraErr |
monospace |
--a-base-link-text-color
| Selector | Value | Color |
|---|---|---|
:root |
var(--ut-link-text-color) |
--a-palette-primary
| Selector | Value | Color |
|---|---|---|
:root |
var(--ut-palette-primary) |
--a-palette-primary-contrast
| Selector | Value | Color |
|---|---|---|
:root |
var(--ut-palette-primary-contrast) |
--a-palette-primary-shade
| Selector | Value | Color |
|---|---|---|
:root |
var(--ut-palette-primary-shade) |
--a-palette-danger
| Selector | Value | Color |
|---|---|---|
:root |
var(--ut-palette-danger) |
--a-palette-danger-contrast
| Selector | Value | Color |
|---|---|---|
:root |
var(--ut-palette-danger-contrast) |
--a-palette-danger-shade
| Selector | Value | Color |
|---|---|---|
:root |
var(--ut-palette-danger-shade) |
--a-palette-warning
| Selector | Value | Color |
|---|---|---|
:root |
var(--ut-palette-warning) |
--a-palette-warning-contrast
| Selector | Value | Color |
|---|---|---|
:root |
var(--ut-palette-warning-contrast) |
--a-palette-warning-shade
| Selector | Value | Color |
|---|---|---|
:root |
var(--ut-palette-warning-shade) |
--a-palette-success
| Selector | Value | Color |
|---|---|---|
:root |
var(--ut-palette-success) |
--a-palette-success-contrast
| Selector | Value | Color |
|---|---|---|
:root |
var(--ut-palette-success-contrast) |
--a-palette-success-shade
| Selector | Value | Color |
|---|---|---|
:root |
var(--ut-palette-success-shade) |
--a-palette-info
| Selector | Value | Color |
|---|---|---|
:root |
var(--ut-palette-info) |
--a-palette-info-contrast
| Selector | Value | Color |
|---|---|---|
:root |
var(--ut-palette-info-contrast) |
--a-palette-info-shade
| Selector | Value | Color |
|---|---|---|
:root |
var(--ut-palette-info-shade) |
--a-popuplov-dialog-background-color
| Selector | Value | Color |
|---|---|---|
:root |
var(--jui-dialog-background-color) |
--a-iconlist-item-hover-text-color
| Selector | Value | Color |
|---|---|---|
:root |
var(--a-menu-focused-text-color) |
--a-iconlist-item-hover-background-color
| Selector | Value | Color |
|---|---|---|
:root |
var(--a-menu-focused-background-color) |
--jui-dialog-border-width
| Selector | Value | Color |
|---|---|---|
:root |
0px |
--jui-dialog-title-close-border-radius
| Selector | Value | Color |
|---|---|---|
:root |
var(--a-button-border-radius, .125rem) |
--jui-dialog-content-padding-y
| Selector | Value | Color |
|---|---|---|
:root |
0rem | |
.t-Dialog-page--wizard |
0rem | |
.ui-dialog--markdown |
.75rem | |
.ui-dialog--inline |
0rem | |
.ui-dialog--drawer |
0rem | |
.a-IRR-dialogBody |
.75rem |
--jui-dialog-content-padding-x
| Selector | Value | Color |
|---|---|---|
:root |
0rem | |
.t-Dialog-page--wizard |
0rem | |
.ui-dialog--markdown |
1rem | |
.ui-dialog--inline |
0rem | |
.ui-dialog--drawer |
0rem | |
.a-IRR-dialogBody |
.75rem |
--safe-area-inset-top
| Selector | Value | Color |
|---|---|---|
:root |
env(safe-area-inset-top) |
--safe-area-inset-right
| Selector | Value | Color |
|---|---|---|
:root |
env(safe-area-inset-right) |
--safe-area-inset-bottom
| Selector | Value | Color |
|---|---|---|
:root |
env(safe-area-inset-bottom) | |
.ui-dialog.a-pwaDialog |
0 |
--safe-area-inset-left
| Selector | Value | Color |
|---|---|---|
:root |
env(safe-area-inset-left) |
--js-dialog-open-timing
| Selector | Value | Color |
|---|---|---|
:root |
.2s |
--js-dialog-close-timing
| Selector | Value | Color |
|---|---|---|
:root |
.2s |
--ut-html-font-size
| Selector | Value | Color |
|---|---|---|
html |
1em |
--ut-base-font-family
| Selector | Value | Color |
|---|---|---|
body |
sans-serif |
--ut-base-font-size
| Selector | Value | Color |
|---|---|---|
body |
1rem |
--ut-focus-outline-color
| Selector | Value | Color |
|---|---|---|
* |
-webkit-focus-ring-color |
--ut-focus-outline
| Selector | Value | Color |
|---|---|---|
*:focus |
-webkit-focus-ring-color | |
button:-moz-focusring,
button::-moz-focus-inner,
.a-Button:-moz-focusring,
.a-Button::-moz-focus-inner,
.a-Toolbar-selectList:-moz-focusring,
.a-Toolbar-selectList::-moz-focus-inner,
.a-IRR-selectList:-moz-focusring,
.a-IRR-selectList::-moz-focus-inner |
-webkit-focus-ring-color | |
.a-Toolbar-radioGroup input:focus + .a-Button,
.a-Toolbar-toggleButton input:focus + .a-Button |
-webkit-focus-ring-color | |
.a-IRR-controlsCheckbox:focus + .a-IRR-controlsCheckboxLabel:before,
.a-IG-controlsCheckbox:focus + .a-IG-controlsCheckboxLabel:before |
-webkit-focus-ring-color | |
.a-IRR-headerLink:focus |
-webkit-focus-ring-color | |
.a-FS .apex-item-option:focus input + label:before,
.a-FS-facetPopupContent .apex-item-option:focus input + label:before |
-webkit-focus-ring-color | |
.a-CardView-fullLink:focus |
-webkit-focus-ring-color | |
.apex-item-text:focus, .apex-item-text:focus-within,
.apex-item-select:focus,
.apex-item-select:focus-within,
.apex-item-textarea:focus,
.apex-item-textarea:focus-within,
.u-TF-item--text:focus,
.u-TF-item--text:focus-within,
.u-TF-item--select:focus,
.u-TF-item--select:focus-within,
select.listmanager:focus,
select.listmanager:focus-within,
select.group_selectlist:focus,
select.group_selectlist:focus-within,
.apex-item-multi:focus,
.apex-item-multi:focus-within,
.datetimepicker_newMonth:focus,
.datetimepicker_newMonth:focus-within |
-webkit-focus-ring-color | |
.apex-item-file:focus + .apex-item-filedrop |
-webkit-focus-ring-color | |
.apex-item-wrapper--color-picker:focus-within .apex-item-group--color-picker |
-webkit-focus-ring-color | |
.apex-item-group--popup-lov:focus-within |
-webkit-focus-ring-color | |
.apex-item-multi-item.is-active > span |
-webkit-focus-ring-color | |
.apex-item-multi .apex-item-popup-lov |
none | |
.a-Switch input[type=checkbox]:focus + .a-Switch-toggle |
-webkit-focus-ring-color | |
.u-checkbox:focus:before,
.apex-item-checkbox input:focus + .u-checkbox:before,
.apex-item-checkbox input:focus + label:before,
.apex-item-checkbox .apex-item-option input:focus + label:before,
.apex-item-single-checkbox input:focus + .u-checkbox:before,
.apex-item-single-checkbox input:focus + label:before,
.u-radio:focus:before,
.apex-item-radio input:focus + .u-radio:before,
.apex-item-radio input:focus + label:before |
-webkit-focus-ring-color | |
.a-StarRating-stars.is-focused |
-webkit-focus-ring-color | |
.apex-item-wrapper--date-picker-jet .oj-text-field.oj-focus .oj-text-field-container,
.a-GV-columnItem .apex-item-datepicker-jet .oj-text-field.oj-focus .oj-text-field-container |
-webkit-focus-ring-color | |
.apex-item-wrapper--date-picker-jet .oj-datepicker-inline + .oj-inputdatetime-time-only .oj-text-field-input.oj-inputdatetime-input:focus,
.a-GV-columnItem .apex-item-datepicker-jet .oj-datepicker-inline + .oj-inputdatetime-time-only .oj-text-field-input.oj-inputdatetime-input:focus |
-webkit-focus-ring-color | |
.apex-item-comboselect.has-focus,
.apex-item-comboselect:focus-within |
-webkit-focus-ring-color | |
body .ck.ck-editor__editable:not(.ck-editor__nested-editable).ck-focused |
-webkit-focus-ring-color |
--ut-overlay-background-color
| Selector | Value | Color |
|---|---|---|
.apex_wait_overlay |
rgba(255, 255, 255, 0.5) |
--ut-nodata-padding
| Selector | Value | Color |
|---|---|---|
.nodatafound |
0.75rem |
--ut-nodata-font-size
| Selector | Value | Color |
|---|---|---|
.nodatafound |
0.75rem |
--a-base-font-weight-semibold
| Selector | Value | Color |
|---|---|---|
h1,
h2,
h3,
h4,
h5,
h6 |
500 | |
.t-Login-title |
500 | |
.t-NavTabs-label |
500 | |
.t-Alert-errorTitle |
500 | |
.t-Timeline-title |
500 | |
.t-Region-header |
500 | |
.t-ClassicCalendar-title |
500 | |
.t-ClassicCalendar--weekly .t-ClassicCalendar-timeCol,
.t-ClassicCalendar--daily .t-ClassicCalendar-timeCol |
500 | |
.fc-toolbar h2 |
500 | |
.ui-datepicker .ui-datepicker-title |
500 |
--ut-base-line-height
| Selector | Value | Color |
|---|---|---|
p |
1rem | |
p |
1rem |
--ut-grid-gutter-width
| Selector | Value | Color |
|---|---|---|
.no-gutters |
0rem | |
.col |
0.5rem | |
.col |
0.5rem | |
.col |
0.5rem | |
.col |
0.5rem | |
.row .col.col-start |
8px | |
.row .col.col-start |
8px | |
.row .col.col-end |
8px | |
.row .col.col-end |
8px | |
.t-Login-container |
0.5rem | |
.t-Login-container |
0.5rem | |
.t-Login-container |
0.5rem | |
.t-Login-container |
0.5rem | |
.t-Form--noPadding,
.t-Form-fieldContainer--noPadding |
0rem | |
.t-Form--slimPadding,
.t-Form-fieldContainer--slimPadding |
.25rem |
--ut-layout-transition
| Selector | Value | Color |
|---|---|---|
:root |
.1s | |
.t-Header,
.t-Header-branding,
.t-Body-main,
.t-Body-title,
.t-Body-actions,
.t-Body-nav,
.t-Body-side,
.t-Body-content,
.t-Button.t-Button--header |
0.1s | |
.no-anim .t-Header,
.no-anim .t-Header-branding,
.no-anim .t-Body-main,
.no-anim .t-Body-title,
.no-anim .t-Body-actions,
.no-anim .t-Body-nav,
.no-anim .t-Body-side,
.no-anim .t-Body-content,
.no-anim .t-Button.t-Button--header |
none | |
.t-TreeNav .a-TreeView-toggle:before |
0.1s eas | |
.t-TreeNav .a-TreeView-badge |
0.1s eas |
--ut-header-item-spacing
| Selector | Value | Color |
|---|---|---|
#t_Body_skipToContent:focus |
0.5rem | |
.t-Header-branding |
0.5rem | |
.t-Header-logo-link |
0.5rem | |
.t-Header-logo-link |
0.5rem | |
.t-MegaMenu--fullWidth:not(.js-menu-callout) |
0.5rem | |
.t-MegaMenu--fullWidth:not(.js-menu-callout) |
0.5rem |
--a-button-padding-y
| Selector | Value | Color |
|---|---|---|
#t_Body_skipToContent:focus |
0.5re | |
.t-Login-buttons |
1rem | |
.t-Button--inlineLink |
0rem | |
.t-Button--tiny,
.t-Button--xsmall |
.25rem | |
.t-Button--small |
.25rem | |
.t-Button--large |
.75rem | |
.t-Button--xlarge |
1rem | |
.t-Button--xlarge.t-Button--withIcon |
.75rem | |
.t-Button--hideShow |
.25rem | |
.t-Button--headerTree |
.5rem | |
.t-Dialog-page--wizard .ui-dialog-buttonpane |
.625rem | |
.t-Button--closeAlert |
.25rem | |
.a-IG-recordView .u-Form-fieldContainer .t-Button--helpButton,
.a-IG-recordView .u-Form-fieldContainer .a-Button--helpButton |
.25rem | |
.a-FS-search,
.a-FS-filter |
.5rem | |
.t-Form-fieldContainer--floatingLabel .a-Button |
.5rem | |
.t-Form-itemWrapper .a-Button,
.t-Form-itemWrapper .oj-inputdatetime-input-trigger |
.25rem | |
.apex-item-file--native::-webkit-file-upload-button |
.25rem | |
.a-GV-columnItem .apex-item-datepicker-jet |
.25rem |
--a-button-border-radius
| Selector | Value | Color |
|---|---|---|
#t_Body_skipToContent:focus |
0.125rem | |
.t-Button,
.t-Form-helpButton,
.apex-item-file--native::-webkit-file-upload-button |
0.125rem | |
.t-Button--pill |
0 | |
.u-RTL .t-Button--pillStart |
0.125rem | |
.u-RTL .t-Button--pillStart |
0.125rem | |
.u-RTL .t-Button--pillEnd |
0.125rem | |
.u-RTL .t-Button--pillEnd |
0.125rem | |
.t-Button--header.t-Button--headerRight |
0rem | |
.apex-button-group label,
.t-Form-fieldContainer--radioButtonGroup .apex-item-group--rc label |
0.125rem | |
.apex-button-group .apex-item-option:not(:last-of-type):not(:first-of-type) label,
.t-Form-fieldContainer--radioButtonGroup .apex-item-group--rc .apex-item-option:not(:last-of-type):not(:first-of-type) label |
0 | |
.u-RTL .t-Form-fieldContainer--radioButtonGroup .apex-item-grid .apex-item-grid-row:only-child .apex-item-option:first-of-type label |
0.125rem | |
.u-RTL .t-Form-fieldContainer--radioButtonGroup .apex-item-grid .apex-item-grid-row:only-child .apex-item-option:first-of-type label |
0.125rem | |
.u-RTL .t-Form-fieldContainer--radioButtonGroup .apex-item-grid .apex-item-grid-row:only-child .apex-item-option:last-of-type label |
0.125rem | |
.u-RTL .t-Form-fieldContainer--radioButtonGroup .apex-item-grid .apex-item-grid-row:only-child .apex-item-option:last-of-type label |
0.125rem | |
.t-Body-actionsToggle |
0.125rem | |
.u-RTL .t-Body-actionsToggle |
0.125rem | |
.u-RTL .t-Body-actionsToggle |
0.125rem | |
.apex-rds-hover a |
0.125rem | |
.t-Alert--page .t-Button.t-Button--closeAlert |
1.5rem | |
.a-FS-clearButton |
2px | |
.apex-item-wrapper--date-picker-jet .oj-text-field-container .oj-component-icon.oj-clickable-icon-nocontext:not(.oj-select-clear-entry-icon):not(.oj-combobox-clear-entry-icon):not(.oj-label-help-icon-anchor),
.a-GV-columnItem .apex-item-datepicker-jet .oj-text-field-container .oj-component-icon.oj-clickable-icon-nocontext:not(.oj-select-clear-entry-icon):not(.oj-combobox-clear-entry-icon):not(.oj-label-help-icon-anchor) |
0.125rem | |
.u-RTL .apex-item-wrapper--date-picker-jet .oj-text-field-container .oj-component-icon.oj-clickable-icon-nocontext:not(.oj-select-clear-entry-icon):not(.oj-combobox-clear-entry-icon):not(.oj-label-help-icon-anchor),
.u-RTL .a-GV-columnItem .apex-item-datepicker-jet .oj-text-field-container .oj-component-icon.oj-clickable-icon-nocontext:not(.oj-select-clear-entry-icon):not(.oj-combobox-clear-entry-icon):not(.oj-label-help-icon-anchor) |
0.125rem | |
.u-RTL .apex-item-wrapper--date-picker-jet .oj-text-field-container .oj-component-icon.oj-clickable-icon-nocontext:not(.oj-select-clear-entry-icon):not(.oj-combobox-clear-entry-icon):not(.oj-label-help-icon-anchor),
.u-RTL .a-GV-columnItem .apex-item-datepicker-jet .oj-text-field-container .oj-component-icon.oj-clickable-icon-nocontext:not(.oj-select-clear-entry-icon):not(.oj-combobox-clear-entry-icon):not(.oj-label-help-icon-anchor) |
0.125rem | |
.ui-datepicker .ui-datepicker-current,
.ui-datepicker .ui-datepicker-close |
0.125rem | |
.apex-fullcalendar-5 .fc-button |
0.125rem |
--a-button-font-weight
| Selector | Value | Color |
|---|---|---|
#t_Body_skipToContent:focus |
400 | |
.t-Button,
.t-Form-helpButton,
.apex-item-file--native::-webkit-file-upload-button |
400 | |
.t-Button--hot |
var(--a-base-font-weight-bold, 700) | |
.t-Body-actionsToggle |
400 | |
.apex-fullcalendar-5 .fc-button |
400 |
--a-button-font-size
| Selector | Value | Color |
|---|---|---|
#t_Body_skipToContent:focus |
0.75rem | |
.t-Login-buttons |
1rem | |
.t-Button,
.t-Form-helpButton,
.apex-item-file--native::-webkit-file-upload-button |
0.75rem | |
.t-Button--tiny,
.t-Button--xsmall |
.625rem | |
.t-Button--small |
.6875rem | |
.t-Button--large |
.875rem | |
.t-Button--xlarge |
1rem | |
.t-Button--hideShow |
.6875rem | |
.t-Body-actionsToggle |
0.75rem | |
.t-Dialog-page--wizard .ui-dialog-buttonpane |
.875rem | |
.t-Report-paginationLink |
.75rem | |
.apex-fullcalendar-5 .fc-button |
0.75rem |
--a-button-line-height
| Selector | Value | Color |
|---|---|---|
#t_Body_skipToContent:focus |
1rem | |
.t-Login-buttons |
1rem | |
.t-Button,
.t-Form-helpButton,
.apex-item-file--native::-webkit-file-upload-button |
1rem | |
.t-Button--tiny,
.t-Button--xsmall |
.75rem | |
.t-Button--small |
1rem | |
.t-Button--large |
1rem | |
.t-Button--xlarge |
1rem | |
.t-Button--hideShow |
.875rem | |
.t-Body-actionsToggle |
1rem | |
.t-Dialog-page--wizard .ui-dialog-buttonpane |
1rem | |
.t-Report-paginationLink |
1rem |
--ut-body-title-border-width
| Selector | Value | Color |
|---|---|---|
.t-Body-title |
1px | |
.t-Body-title:empty |
0px |
--ut-body-sidebar-width
| Selector | Value | Color |
|---|---|---|
.t-Body-side |
15rem | |
.t-PageBody--hideLeft |
0rem |
--ut-body-info-background-color
| Selector | Value | Color |
|---|---|---|
.t-Body-info |
var(--ut-body-title-background-color) | |
.t-PageBody--masterDetail .apex-rds-container |
var(--ut-body-title-background-color) |
--ut-body-info-text-color
| Selector | Value | Color |
|---|---|---|
.t-Body-info |
var(--ut-body-title-text-color) |
--ut-body-content-padding-y
| Selector | Value | Color |
|---|---|---|
.t-Body-contentInner |
1rem | |
.t-Body-contentInner |
1rem | |
.t-Body-contentInner |
1rem | |
.t-Body-contentInner |
1rem | |
.t-Body-contentInner |
var(--ut-xs-body-content-padding-y, .5rem) | |
.t-PageBody--noContentPadding |
0 |
--ut-body-content-padding-x
| Selector | Value | Color |
|---|---|---|
.t-Body-contentInner |
1rem | |
.t-Body-contentInner |
1rem | |
.t-Body-contentInner |
1rem | |
.t-Body-contentInner |
1rem | |
.t-Body-contentInner |
var(--ut-xs-body-content-padding-x, .5rem) | |
.t-PageBody--noContentPadding |
0 |
--ut-body-content-width
| Selector | Value | Color |
|---|---|---|
.t-Body-contentInner |
100% |
--ut-body-actions-width
| Selector | Value | Color |
|---|---|---|
.t-Body-actions |
12.5rem | |
.js-rightCollapsed .t-Body-actions |
0rem | |
.t-PageBody--hideActions |
0rem |
--ut-button-region-padding
| Selector | Value | Color |
|---|---|---|
.js-rightCollapsed .t-Body-actions .t-ButtonRegion |
0rem | |
.t-ButtonRegion-col--left .t-ButtonRegion-buttons |
1rem | |
.t-ButtonRegion-col--content |
1rem | |
.t-ButtonRegion-col--right .t-ButtonRegion-buttons |
1rem | |
.t-ButtonRegion--slimPadding |
.5rem | |
.t-ButtonRegion--noPadding |
0rem | |
.t-Body-actions .t-ButtonRegion |
.375rem | |
.t-Body-actions .t-ButtonRegion .t-ButtonRegion-wrap |
0.375rem | |
.t-Body-actions .t-ButtonRegion .t-ButtonRegion-col |
0.375rem |
--ut-body-title-box-shadow
| Selector | Value | Color |
|---|---|---|
.t-PageBody--masterDetail .t-Body-title |
none |
--ut-xs-body-content-padding-y
| Selector | Value | Color |
|---|---|---|
.t-PageBody--noContentPadding |
0 |
--ut-xs-body-content-padding-x
| Selector | Value | Color |
|---|---|---|
.t-PageBody--noContentPadding |
0 |
--ut-body-background-color
| Selector | Value | Color |
|---|---|---|
.t-PageBody--login |
var(--ut-login-page-background-color) | |
.t-LoginPage--bg1,
.t-LoginPage--bg2,
.t-LoginPage--bg3 |
var(--ut-palette-primary) |
--ut-login-region-max-width
| Selector | Value | Color |
|---|---|---|
.t-PageBody--login .t-Body-alert |
28.75rem | |
.t-Login-region |
28.75rem | |
.t-LoginPage--split .t-Login-container |
28.75rem |
--ut-login-container-item-spacing
| Selector | Value | Color |
|---|---|---|
.t-Login-container |
1rem |
--ut-field-padding-x
| Selector | Value | Color |
|---|---|---|
.t-Login-region |
0rem | |
.t-Form-labelContainer |
0.5rem | |
.t-Form-labelContainer |
0.5rem | |
.t-Form-labelContainer |
0.5rem | |
.t-Form-labelContainer |
0.5rem | |
.t-Form-inputContainer |
0.5rem | |
.t-Form-inputContainer |
0.5rem | |
.t-Form-inputContainer |
0.5rem | |
.t-Form-inputContainer |
0.5rem | |
.t-Form--noPadding,
.t-Form-fieldContainer--noPadding |
0rem | |
.t-Form--slimPadding,
.t-Form-fieldContainer--slimPadding |
.25rem | |
.t-Form-labelContainer--hiddenLabel.col-0, .t-Form-labelContainer--hiddenLabel.col-null |
0 | |
.t-Form-fieldContainer--floatingLabel.t-Form-fieldContainer |
0.5rem | |
.t-Form-fieldContainer--floatingLabel.t-Form-fieldContainer |
0.5rem | |
.t-Form-fieldContainer--floatingLabel.t-Form-fieldContainer |
0.5rem | |
.t-Form-fieldContainer--floatingLabel.t-Form-fieldContainer |
0.5rem |
--ut-field-padding-y
| Selector | Value | Color |
|---|---|---|
.t-Login-region |
1rem | |
.t-Header-navBar |
0rem | |
.t-Form-labelContainer |
0.5rem | |
.t-Form-labelContainer |
0.5rem | |
.t-Form-labelContainer |
0.5rem | |
.t-Form-labelContainer |
0.5rem | |
.t-Form-inputContainer |
0.5rem | |
.t-Form-inputContainer |
0.5rem | |
.t-Form-inputContainer |
0.5rem | |
.t-Form-inputContainer |
0.5rem | |
.t-Form--noPadding,
.t-Form-fieldContainer--noPadding |
0rem | |
.t-Form--slimPadding,
.t-Form-fieldContainer--slimPadding |
.25rem | |
.t-Form-labelContainer--hiddenLabel.col-0, .t-Form-labelContainer--hiddenLabel.col-null |
0 | |
.container > .row > .col:first-child > .t-Form-fieldContainer--hiddenLabel |
0.5rem | |
.container > .row > .col:first-child > .t-Form-fieldContainer--hiddenLabel |
0.5rem | |
.t-Form-fieldContainer--floatingLabel.t-Form-fieldContainer |
0.5rem | |
.t-Form-fieldContainer--floatingLabel.t-Form-fieldContainer |
0.5rem | |
.t-Form-fieldContainer--floatingLabel.t-Form-fieldContainer |
0.5rem | |
.t-Form-fieldContainer--floatingLabel.t-Form-fieldContainer |
0.5rem |
--ut-field-input-icon-padding-y
| Selector | Value | Color |
|---|---|---|
.t-Login-region |
.75rem | |
.a-FS-search,
.a-FS-filter |
.5rem | |
.a-FS-search span.apex-item-icon,
.a-FS-filter span.apex-item-icon |
0.25re | |
.apex-item-icon |
0.25re |
--ut-field-input-icon-padding-x
| Selector | Value | Color |
|---|---|---|
.t-Login-region |
.75rem | |
.a-FS-search,
.a-FS-filter |
.5rem | |
.t-Form-fieldContainer--floatingLabel |
.5rem | |
.apex-item-color-picker-preview |
0.25rem | |
.u-RTL .apex-item-color-picker-preview |
0.25rem |
--ut-login-region-padding
| Selector | Value | Color |
|---|---|---|
.t-Login-region |
2rem |
--ut-login-region-background-color
| Selector | Value | Color |
|---|---|---|
.t-Login-region |
var(--ut-component-background-color) | |
.t-LoginPage--split .t-Login-container |
var(--ut-component-background-color) |
--ut-login-region-border-width
| Selector | Value | Color |
|---|---|---|
.t-Login-region |
1px |
--ut-login-region-border-color
| Selector | Value | Color |
|---|---|---|
.t-Login-region |
var(--ut-component-border-color) |
--ut-login-region-border-radius
| Selector | Value | Color |
|---|---|---|
.t-Login-region |
0.5rem |
--ut-login-region-box-shadow
| Selector | Value | Color |
|---|---|---|
.t-Login-region |
var(--ut-component-box-shadow) |
--ut-login-logo-size
| Selector | Value | Color |
|---|---|---|
.t-Login-logo |
4rem | |
.t-Login-logo |
4rem | |
.t-Login-logo |
4rem |
--ut-login-logo-font-size
| Selector | Value | Color |
|---|---|---|
.t-Login-logo |
2rem | |
.apex-icons-fontawesome .t-Login-logo |
1.75rem |
--ut-login-logo-border-radius
| Selector | Value | Color |
|---|---|---|
.t-Login-logo |
0.25rem |
--ut-app-icon-background-color
| Selector | Value | Color |
|---|---|---|
.t-Login-logo |
var(--ut-component-icon-background-color) |
--ut-app-icon-color
| Selector | Value | Color |
|---|---|---|
.t-Login-logo |
var(--ut-component-icon-color) |
--a-button-padding-x
| Selector | Value | Color |
|---|---|---|
.t-Login-buttons |
1.5rem | |
.t-Button--icon.t-Button--slim |
.5rem | |
.t-Button--inlineLink |
0rem | |
.t-Button--tiny,
.t-Button--xsmall |
.375rem | |
.t-Button--small |
.5rem | |
.t-Button--large |
1rem | |
.t-Button--xlarge |
1.25rem | |
.t-Button--xlarge.t-Button--withIcon |
.875rem | |
.t-Button--hideShow |
.25rem | |
.t-Button--header |
.5rem | |
.t-Button--headerTree |
.5rem | |
.t-Dialog-page--wizard .ui-dialog-buttonpane |
.5rem | |
.t-Button--closeAlert |
.25rem | |
.a-IG-recordView .u-Form-fieldContainer .t-Button--helpButton,
.a-IG-recordView .u-Form-fieldContainer .a-Button--helpButton |
.25rem | |
.a-FS-search,
.a-FS-filter |
.75rem | |
.t-ConfigPanel-actions .t-Button |
1rem | |
.t-Form-fieldContainer--floatingLabel .a-Button |
.75rem | |
.t-Form-itemWrapper .a-Button,
.t-Form-itemWrapper .oj-inputdatetime-input-trigger |
.5rem | |
.apex-item-file--native::-webkit-file-upload-button |
.5rem | |
.apex-button-group |
.75rem | |
.a-GV-columnItem .apex-item-datepicker-jet |
.5rem |
--ut-component-border-color) 0 0 0 var(--ut-component-border-width)
| Selector | Value | Color |
|---|---|---|
.t-LoginPage--split .t-Login-container |
var(--ut-component-box-shadow |
--a-icon-padding
| Selector | Value | Color |
|---|---|---|
.t-Login-body |
.75rem | |
.t-Login-body .apex-item-icon |
.75rem | |
.t-Form-fieldContainer--floatingLabel.apex-item-wrapper--color-picker |
.5rem |
--a-icon-size
| Selector | Value | Color |
|---|---|---|
.t-Login-body |
1rem | |
.t-Button .a-Icon |
var(--a-button-icon-size) | |
.t-Footer-topButton |
1rem | |
.fa,
.fa.fa-sm,
.force-fa-lg .fa.fa-sm |
16px | |
.fa.fa-lg,
.force-fa-lg .fa |
32px | |
.fa-2x,
.fa-sm.fa-2x,
.force-fa-lg .fa.fa-sm.fa-2x |
32px | |
.fa-3x,
.fa-sm.fa-3x,
.force-fa-lg .fa.fa-sm.fa-3x |
48px | |
.fa-4x,
.fa-sm.fa-4x,
.force-fa-lg .fa.fa-sm.fa-4x |
64px | |
.fa-5x,
.fa-sm.fa-5x,
.force-fa-lg .fa.fa-sm.fa-5x |
80px | |
.fa-lg.fa-2x,
.force-fa-lg .fa.fa-2x |
64px | |
.fa-lg.fa-3x,
.force-fa-lg .fa.fa-3x |
96px | |
.fa-lg.fa-4x,
.force-fa-lg .fa.fa-4x |
128px | |
.fa-lg.fa-5x,
.force-fa-lg .fa.fa-5x |
160px | |
.a-Region-carouselControl .a-Tabs-button |
var(--ut-carousel-button-icon-size, 1.25rem) | |
.t-ConfigPanel-icon |
3rem | |
.t-ConfigPanel-icon:before |
2rem | |
.apex-item-wrapper--date-picker-jet .oj-text-field-container .oj-component-icon.oj-clickable-icon-nocontext:not(.oj-select-clear-entry-icon):not(.oj-combobox-clear-entry-icon):not(.oj-label-help-icon-anchor),
.a-GV-columnItem .apex-item-datepicker-jet .oj-text-field-container .oj-component-icon.oj-clickable-icon-nocontext:not(.oj-select-clear-entry-icon):not(.oj-combobox-clear-entry-icon):not(.oj-label-help-icon-anchor) |
1rem | |
.t-Validation-icon .a-Icon |
var(--ut-valiation-icon-size, 1.5rem) | |
.t-Validation-icon .a-Icon:before |
1rem |
--a-field-input-font-size
| Selector | Value | Color |
|---|---|---|
.t-Login-body |
1rem | |
.t-Form-fieldContainer |
var(--ut-xs-field-input-font-size) | |
.t-Form-fieldContainer--floatingLabel .apex-item-display-only |
0.75rem | |
.apex-item-display-only |
inherit | |
.apex-item-text,
.apex-item-select,
.apex-item-textarea,
.u-TF-item--text,
.u-TF-item--select,
select.listmanager,
select.group_selectlist,
.apex-item-multi,
.datetimepicker_newMonth |
0.75rem | |
.apex-item-file--native |
0.75rem | |
.apex-item-wrapper--date-picker-jet .oj-text-field,
.apex-item-wrapper--date-picker-jet .oj-inputdatetime,
.apex-item-wrapper--date-picker-jet .oj-inputdatetime-date-only,
.apex-item-wrapper--date-picker-jet .oj-inputdatetime-date-time,
.apex-item-wrapper--date-picker-jet .oj-inputdatetime-time-only,
.a-GV-columnItem .apex-item-datepicker-jet .oj-text-field,
.a-GV-columnItem .apex-item-datepicker-jet .oj-inputdatetime,
.a-GV-columnItem .apex-item-datepicker-jet .oj-inputdatetime-date-only,
.a-GV-columnItem .apex-item-datepicker-jet .oj-inputdatetime-date-time,
.a-GV-columnItem .apex-item-datepicker-jet .oj-inputdatetime-time-only |
0.75rem | |
.apex-item-wrapper--date-picker-jet .oj-text-field-input,
.a-GV-columnItem .apex-item-datepicker-jet .oj-text-field-input |
0.75rem | |
.ui-datepicker .datetimepicker_newMonth |
0.75rem |
--a-field-input-padding-x
| Selector | Value | Color |
|---|---|---|
.t-Login-body |
.5rem | |
.t-Form-fieldContainer--floatingLabel |
.5rem | |
.t-Form-fieldContainer--floatingLabel .t-Form-label |
0.25rem | |
.t-Form-fieldContainer--floatingLabel .t-Form-label |
0.25rem | |
.apex-item-file--native::-webkit-file-upload-button |
0.25rem | |
.apex-item-file--native::-webkit-file-upload-button |
0.25rem | |
.apex-item-multi .apex-item-popup-lov |
0rem |
--a-button-border-width
| Selector | Value | Color |
|---|---|---|
.t-Button,
.t-Form-helpButton,
.apex-item-file--native::-webkit-file-upload-button |
1px | |
.t-Button--inlineLink |
0px | |
.apex-button-group label,
.t-Form-fieldContainer--radioButtonGroup .apex-item-group--rc label |
1px | |
.apex-button-group input:focus + label,
.t-Form-fieldContainer--radioButtonGroup .apex-item-group--rc input:focus + label |
1px | |
.u-RTL .t-Body-actionsToggle |
1px | |
.t-Button--headerTree |
1px | |
.apex-rds-hover a |
1px | |
.apex-item-wrapper--date-picker-jet .oj-text-field-container .oj-component-icon.oj-clickable-icon-nocontext:not(.oj-select-clear-entry-icon):not(.oj-combobox-clear-entry-icon):not(.oj-label-help-icon-anchor),
.a-GV-columnItem .apex-item-datepicker-jet .oj-text-field-container .oj-component-icon.oj-clickable-icon-nocontext:not(.oj-select-clear-entry-icon):not(.oj-combobox-clear-entry-icon):not(.oj-label-help-icon-anchor) |
1px | |
.u-RTL .apex-item-wrapper--date-picker-jet .oj-text-field-container .oj-component-icon.oj-clickable-icon-nocontext:not(.oj-select-clear-entry-icon):not(.oj-combobox-clear-entry-icon):not(.oj-label-help-icon-anchor),
.u-RTL .a-GV-columnItem .apex-item-datepicker-jet .oj-text-field-container .oj-component-icon.oj-clickable-icon-nocontext:not(.oj-select-clear-entry-icon):not(.oj-combobox-clear-entry-icon):not(.oj-label-help-icon-anchor) |
1px | |
.ui-datepicker .ui-datepicker-current,
.ui-datepicker .ui-datepicker-close |
1px | |
.apex-fullcalendar-5 .fc-button |
1px |
--a-button-cursor
| Selector | Value | Color |
|---|---|---|
.t-Button,
.t-Form-helpButton,
.apex-item-file--native::-webkit-file-upload-button |
pointer | |
.apex-button-group label,
.t-Form-fieldContainer--radioButtonGroup .apex-item-group--rc label |
pointer | |
.t-Body-actionsToggle |
pointer | |
.apex-rds-hover a |
pointer | |
.t-Region-titleButton |
pointer | |
.apex-fullcalendar-5 .fc-button |
pointer |
--a-button-text-shadow
| Selector | Value | Color |
|---|---|---|
.t-Button,
.t-Form-helpButton,
.apex-item-file--native::-webkit-file-upload-button |
none | |
.apex-button-group label,
.t-Form-fieldContainer--radioButtonGroup .apex-item-group--rc label |
none | |
.t-Body-actionsToggle |
none | |
.apex-fullcalendar-5 .fc-button |
none |
--a-button-state-background-color
| Selector | Value | Color |
|---|---|---|
.t-Button,
.a-Button,
.ui-button,
.a-CardView-button,
.apex-button-group label,
.t-Form-fieldContainer--radioButtonGroup .apex-item-group--rc input + label,
.t-Form-helpButton |
transparent | |
.t-Button:hover,
.a-Button:hover,
.ui-button:hover,
.a-CardView-button:hover,
.apex-button-group label:hover,
.t-Form-fieldContainer--radioButtonGroup .apex-item-group--rc input + label:hover,
.t-Form-helpButton:hover |
var(--a-button-hover-background-color) | |
.t-Button.is-active, .t-Button.ui-state-active, .t-Button:active, .t-Button:active:focus,
.a-Button.is-active,
.a-Button.ui-state-active,
.a-Button:active,
.a-Button:active:focus,
.ui-button.is-active,
.ui-button.ui-state-active,
.ui-button:active,
.ui-button:active:focus,
.a-CardView-button.is-active,
.a-CardView-button.ui-state-active,
.a-CardView-button:active,
.a-CardView-button:active:focus,
.apex-button-group label.is-active,
.apex-button-group label.ui-state-active,
.apex-button-group label:active,
.apex-button-group label:active:focus,
.t-Form-fieldContainer--radioButtonGroup .apex-item-group--rc input + label.is-active,
.t-Form-fieldContainer--radioButtonGroup .apex-item-group--rc input + label.ui-state-active,
.t-Form-fieldContainer--radioButtonGroup .apex-item-group--rc input + label:active,
.t-Form-fieldContainer--radioButtonGroup .apex-item-group--rc input + label:active:focus,
.t-Form-helpButton.is-active,
.t-Form-helpButton.ui-state-active,
.t-Form-helpButton:active,
.t-Form-helpButton:active:focus |
var(--a-button-active-background-color, var(--a-button-hover-background-color)) | |
.t-Button:focus,
.a-Button:focus,
.ui-button:focus,
.a-CardView-button:focus,
.apex-button-group label:focus,
.t-Form-fieldContainer--radioButtonGroup .apex-item-group--rc input + label:focus,
.t-Form-helpButton:focus |
var(--a-button-focus-background-color) | |
.apex-item-file--native::-webkit-file-upload-button |
transparent | |
.apex-item-file--native::-webkit-file-upload-button:hover |
var(--a-button-hover-background-color) | |
.apex-item-file--native::-webkit-file-upload-button.is-active, .apex-item-file--native::-webkit-file-upload-button.ui-state-active, .apex-item-file--native::-webkit-file-upload-button:active, .apex-item-file--native::-webkit-file-upload-button:active:focus |
var(--a-button-active-background-color, var(--a-button-hover-background-color)) | |
.apex-item-file--native::-webkit-file-upload-button:focus |
var(--a-button-focus-background-color) | |
.apex-rds-hover a |
transparent | |
.apex-item-wrapper--date-picker-jet .oj-text-field-container .oj-component-icon.oj-clickable-icon-nocontext:not(.oj-select-clear-entry-icon):not(.oj-combobox-clear-entry-icon):not(.oj-label-help-icon-anchor),
.a-GV-columnItem .apex-item-datepicker-jet .oj-text-field-container .oj-component-icon.oj-clickable-icon-nocontext:not(.oj-select-clear-entry-icon):not(.oj-combobox-clear-entry-icon):not(.oj-label-help-icon-anchor) |
transparent | |
.apex-item-wrapper--date-picker-jet .oj-text-field-container .oj-component-icon.oj-clickable-icon-nocontext:not(.oj-select-clear-entry-icon):not(.oj-combobox-clear-entry-icon):not(.oj-disabled):hover,
.a-GV-columnItem .apex-item-datepicker-jet .oj-text-field-container .oj-component-icon.oj-clickable-icon-nocontext:not(.oj-select-clear-entry-icon):not(.oj-combobox-clear-entry-icon):not(.oj-disabled):hover |
var(--a-button-hover-background-color) | |
.apex-item-wrapper--date-picker-jet .oj-text-field-container .oj-component-icon.oj-clickable-icon-nocontext:not(.oj-select-clear-entry-icon):not(.oj-combobox-clear-entry-icon):not(.oj-disabled):active,
.a-GV-columnItem .apex-item-datepicker-jet .oj-text-field-container .oj-component-icon.oj-clickable-icon-nocontext:not(.oj-select-clear-entry-icon):not(.oj-combobox-clear-entry-icon):not(.oj-disabled):active |
var(--a-button-active-background-color, var(--a-button-hover-background-color)) | |
.apex-fullcalendar-5 .fc-button-primary.fc-button-active,
.apex-fullcalendar-5 .fc-button-primary.fc-button-active:disabled |
transparent | |
.apex-fullcalendar-5 .fc-button-primary.fc-button-active,
.apex-fullcalendar-5 .fc-button-primary.fc-button-active:disabled |
var(--a-button-active-background-color, var(--a-button-hover-background-color)) |
--a-button-state-text-color
| Selector | Value | Color |
|---|---|---|
.t-Button,
.a-Button,
.ui-button,
.a-CardView-button,
.apex-button-group label,
.t-Form-fieldContainer--radioButtonGroup .apex-item-group--rc input + label,
.t-Form-helpButton |
inherit | |
.t-Button:hover,
.a-Button:hover,
.ui-button:hover,
.a-CardView-button:hover,
.apex-button-group label:hover,
.t-Form-fieldContainer--radioButtonGroup .apex-item-group--rc input + label:hover,
.t-Form-helpButton:hover |
var(--a-button-hover-text-color) | |
.t-Button.is-active, .t-Button.ui-state-active, .t-Button:active, .t-Button:active:focus,
.a-Button.is-active,
.a-Button.ui-state-active,
.a-Button:active,
.a-Button:active:focus,
.ui-button.is-active,
.ui-button.ui-state-active,
.ui-button:active,
.ui-button:active:focus,
.a-CardView-button.is-active,
.a-CardView-button.ui-state-active,
.a-CardView-button:active,
.a-CardView-button:active:focus,
.apex-button-group label.is-active,
.apex-button-group label.ui-state-active,
.apex-button-group label:active,
.apex-button-group label:active:focus,
.t-Form-fieldContainer--radioButtonGroup .apex-item-group--rc input + label.is-active,
.t-Form-fieldContainer--radioButtonGroup .apex-item-group--rc input + label.ui-state-active,
.t-Form-fieldContainer--radioButtonGroup .apex-item-group--rc input + label:active,
.t-Form-fieldContainer--radioButtonGroup .apex-item-group--rc input + label:active:focus,
.t-Form-helpButton.is-active,
.t-Form-helpButton.ui-state-active,
.t-Form-helpButton:active,
.t-Form-helpButton:active:focus |
var(--a-button-active-text-color, var(--a-button-hover-text-color)) | |
.t-Button:focus,
.a-Button:focus,
.ui-button:focus,
.a-CardView-button:focus,
.apex-button-group label:focus,
.t-Form-fieldContainer--radioButtonGroup .apex-item-group--rc input + label:focus,
.t-Form-helpButton:focus |
var(--a-button-focus-text-color) | |
.apex-item-file--native::-webkit-file-upload-button |
inherit | |
.apex-item-file--native::-webkit-file-upload-button:hover |
var(--a-button-hover-text-color) | |
.apex-item-file--native::-webkit-file-upload-button.is-active, .apex-item-file--native::-webkit-file-upload-button.ui-state-active, .apex-item-file--native::-webkit-file-upload-button:active, .apex-item-file--native::-webkit-file-upload-button:active:focus |
var(--a-button-active-text-color, var(--a-button-hover-text-color)) | |
.apex-item-file--native::-webkit-file-upload-button:focus |
var(--a-button-focus-text-color) | |
.apex-rds-hover a |
inherit | |
.apex-item-wrapper--date-picker-jet .oj-text-field-container .oj-component-icon.oj-clickable-icon-nocontext:not(.oj-select-clear-entry-icon):not(.oj-combobox-clear-entry-icon):not(.oj-label-help-icon-anchor),
.a-GV-columnItem .apex-item-datepicker-jet .oj-text-field-container .oj-component-icon.oj-clickable-icon-nocontext:not(.oj-select-clear-entry-icon):not(.oj-combobox-clear-entry-icon):not(.oj-label-help-icon-anchor) |
inherit | |
.apex-item-wrapper--date-picker-jet .oj-text-field-container .oj-component-icon.oj-clickable-icon-nocontext:not(.oj-select-clear-entry-icon):not(.oj-combobox-clear-entry-icon):not(.oj-disabled):hover,
.a-GV-columnItem .apex-item-datepicker-jet .oj-text-field-container .oj-component-icon.oj-clickable-icon-nocontext:not(.oj-select-clear-entry-icon):not(.oj-combobox-clear-entry-icon):not(.oj-disabled):hover |
var(--a-button-hover-text-color) | |
.apex-item-wrapper--date-picker-jet .oj-text-field-container .oj-component-icon.oj-clickable-icon-nocontext:not(.oj-select-clear-entry-icon):not(.oj-combobox-clear-entry-icon):not(.oj-disabled):active,
.a-GV-columnItem .apex-item-datepicker-jet .oj-text-field-container .oj-component-icon.oj-clickable-icon-nocontext:not(.oj-select-clear-entry-icon):not(.oj-combobox-clear-entry-icon):not(.oj-disabled):active |
var(--a-button-active-text-color, var(--a-button-hover-text-color)) | |
.apex-fullcalendar-5 .fc-button-primary.fc-button-active,
.apex-fullcalendar-5 .fc-button-primary.fc-button-active:disabled |
inherit | |
.apex-fullcalendar-5 .fc-button-primary.fc-button-active,
.apex-fullcalendar-5 .fc-button-primary.fc-button-active:disabled |
var(--a-button-active-text-color, var(--a-button-hover-text-color)) |
--a-button-state-border-color
| Selector | Value | Color |
|---|---|---|
.t-Button,
.a-Button,
.ui-button,
.a-CardView-button,
.apex-button-group label,
.t-Form-fieldContainer--radioButtonGroup .apex-item-group--rc input + label,
.t-Form-helpButton |
var(--a-button-border-color) | |
.t-Button:hover,
.a-Button:hover,
.ui-button:hover,
.a-CardView-button:hover,
.apex-button-group label:hover,
.t-Form-fieldContainer--radioButtonGroup .apex-item-group--rc input + label:hover,
.t-Form-helpButton:hover |
var(--a-button-hover-border-color) | |
.t-Button.is-active, .t-Button.ui-state-active, .t-Button:active, .t-Button:active:focus,
.a-Button.is-active,
.a-Button.ui-state-active,
.a-Button:active,
.a-Button:active:focus,
.ui-button.is-active,
.ui-button.ui-state-active,
.ui-button:active,
.ui-button:active:focus,
.a-CardView-button.is-active,
.a-CardView-button.ui-state-active,
.a-CardView-button:active,
.a-CardView-button:active:focus,
.apex-button-group label.is-active,
.apex-button-group label.ui-state-active,
.apex-button-group label:active,
.apex-button-group label:active:focus,
.t-Form-fieldContainer--radioButtonGroup .apex-item-group--rc input + label.is-active,
.t-Form-fieldContainer--radioButtonGroup .apex-item-group--rc input + label.ui-state-active,
.t-Form-fieldContainer--radioButtonGroup .apex-item-group--rc input + label:active,
.t-Form-fieldContainer--radioButtonGroup .apex-item-group--rc input + label:active:focus,
.t-Form-helpButton.is-active,
.t-Form-helpButton.ui-state-active,
.t-Form-helpButton:active,
.t-Form-helpButton:active:focus |
var(--a-button-active-border-color, var(--a-button-hover-border-color)) | |
.t-Button:focus,
.a-Button:focus,
.ui-button:focus,
.a-CardView-button:focus,
.apex-button-group label:focus,
.t-Form-fieldContainer--radioButtonGroup .apex-item-group--rc input + label:focus,
.t-Form-helpButton:focus |
var(--a-button-focus-border-color) | |
.apex-item-file--native::-webkit-file-upload-button |
var(--a-button-border-color) | |
.apex-item-file--native::-webkit-file-upload-button:hover |
var(--a-button-hover-border-color) | |
.apex-item-file--native::-webkit-file-upload-button.is-active, .apex-item-file--native::-webkit-file-upload-button.ui-state-active, .apex-item-file--native::-webkit-file-upload-button:active, .apex-item-file--native::-webkit-file-upload-button:active:focus |
var(--a-button-active-border-color, var(--a-button-hover-border-color)) | |
.apex-item-file--native::-webkit-file-upload-button:focus |
var(--a-button-focus-border-color) | |
.apex-rds-hover a |
var(--a-button-border-color) | |
.apex-item-text.apex-page-item-error + .a-Button,
.apex-item-select.apex-page-item-error + .a-Button,
.apex-item-textarea.apex-page-item-error + .a-Button,
.u-TF-item--text.apex-page-item-error + .a-Button,
.u-TF-item--select.apex-page-item-error + .a-Button,
select.listmanager.apex-page-item-error + .a-Button,
select.group_selectlist.apex-page-item-error + .a-Button,
.apex-item-multi.apex-page-item-error + .a-Button,
.datetimepicker_newMonth.apex-page-item-error + .a-Button |
var(--ut-palette-danger) | |
.apex-item-text.apex-page-item-error:required:valid + .a-Button,
.apex-item-select.apex-page-item-error:required:valid + .a-Button,
.apex-item-textarea.apex-page-item-error:required:valid + .a-Button,
.u-TF-item--text.apex-page-item-error:required:valid + .a-Button,
.u-TF-item--select.apex-page-item-error:required:valid + .a-Button,
select.listmanager.apex-page-item-error:required:valid + .a-Button,
select.group_selectlist.apex-page-item-error:required:valid + .a-Button,
.apex-item-multi.apex-page-item-error:required:valid + .a-Button,
.datetimepicker_newMonth.apex-page-item-error:required:valid + .a-Button |
var(--a-button-border-color) | |
.apex-item-wrapper--color-picker:focus-within .apex-item-group--color-picker |
var(--a-field-input-focus-border-color) | |
.apex-item-group--popup-lov:focus-within |
var(--a-field-input-focus-border-color) | |
.apex-item-wrapper--date-picker-jet .oj-text-field.oj-focus .oj-text-field-container,
.a-GV-columnItem .apex-item-datepicker-jet .oj-text-field.oj-focus .oj-text-field-container |
var(--a-field-input-focus-border-color) | |
.apex-item-wrapper--date-picker-jet .oj-text-field.apex-page-item-error + .a-Button,
.a-GV-columnItem .apex-item-datepicker-jet .oj-text-field.apex-page-item-error + .a-Button |
var(--ut-palette-danger) | |
.apex-item-wrapper--date-picker-jet .oj-text-field.apex-page-item-error:required:valid + .a-Button,
.a-GV-columnItem .apex-item-datepicker-jet .oj-text-field.apex-page-item-error:required:valid + .a-Button |
var(--a-button-border-color) | |
.apex-item-wrapper--date-picker-jet .oj-text-field-container .oj-component-icon.oj-clickable-icon-nocontext:not(.oj-select-clear-entry-icon):not(.oj-combobox-clear-entry-icon):not(.oj-label-help-icon-anchor),
.a-GV-columnItem .apex-item-datepicker-jet .oj-text-field-container .oj-component-icon.oj-clickable-icon-nocontext:not(.oj-select-clear-entry-icon):not(.oj-combobox-clear-entry-icon):not(.oj-label-help-icon-anchor) |
var(--a-button-border-color) | |
.apex-item-wrapper--date-picker-jet .oj-text-field-container .oj-component-icon.oj-clickable-icon-nocontext:not(.oj-select-clear-entry-icon):not(.oj-combobox-clear-entry-icon):not(.oj-disabled):hover,
.a-GV-columnItem .apex-item-datepicker-jet .oj-text-field-container .oj-component-icon.oj-clickable-icon-nocontext:not(.oj-select-clear-entry-icon):not(.oj-combobox-clear-entry-icon):not(.oj-disabled):hover |
var(--a-button-hover-border-color) | |
.apex-item-wrapper--date-picker-jet .oj-text-field-container .oj-component-icon.oj-clickable-icon-nocontext:not(.oj-select-clear-entry-icon):not(.oj-combobox-clear-entry-icon):not(.oj-disabled):active,
.a-GV-columnItem .apex-item-datepicker-jet .oj-text-field-container .oj-component-icon.oj-clickable-icon-nocontext:not(.oj-select-clear-entry-icon):not(.oj-combobox-clear-entry-icon):not(.oj-disabled):active |
var(--a-button-active-border-color, var(--a-button-hover-border-color)) | |
.apex-fullcalendar-5 .fc-button-primary.fc-button-active,
.apex-fullcalendar-5 .fc-button-primary.fc-button-active:disabled |
var(--a-button-border-color) | |
.apex-fullcalendar-5 .fc-button-primary.fc-button-active,
.apex-fullcalendar-5 .fc-button-primary.fc-button-active:disabled |
var(--a-button-active-border-color, var(--a-button-hover-border-color)) |
--a-button-state-shadow
| Selector | Value | Color |
|---|---|---|
.t-Button,
.a-Button,
.ui-button,
.a-CardView-button,
.apex-button-group label,
.t-Form-fieldContainer--radioButtonGroup .apex-item-group--rc input + label,
.t-Form-helpButton |
none | |
.t-Button:hover,
.a-Button:hover,
.ui-button:hover,
.a-CardView-button:hover,
.apex-button-group label:hover,
.t-Form-fieldContainer--radioButtonGroup .apex-item-group--rc input + label:hover,
.t-Form-helpButton:hover |
var(--a-button-hover-shadow) | |
.t-Button.is-active, .t-Button.ui-state-active, .t-Button:active, .t-Button:active:focus,
.a-Button.is-active,
.a-Button.ui-state-active,
.a-Button:active,
.a-Button:active:focus,
.ui-button.is-active,
.ui-button.ui-state-active,
.ui-button:active,
.ui-button:active:focus,
.a-CardView-button.is-active,
.a-CardView-button.ui-state-active,
.a-CardView-button:active,
.a-CardView-button:active:focus,
.apex-button-group label.is-active,
.apex-button-group label.ui-state-active,
.apex-button-group label:active,
.apex-button-group label:active:focus,
.t-Form-fieldContainer--radioButtonGroup .apex-item-group--rc input + label.is-active,
.t-Form-fieldContainer--radioButtonGroup .apex-item-group--rc input + label.ui-state-active,
.t-Form-fieldContainer--radioButtonGroup .apex-item-group--rc input + label:active,
.t-Form-fieldContainer--radioButtonGroup .apex-item-group--rc input + label:active:focus,
.t-Form-helpButton.is-active,
.t-Form-helpButton.ui-state-active,
.t-Form-helpButton:active,
.t-Form-helpButton:active:focus |
var(--a-button-active-shadow, var(--a-button-hover-shadow)) | |
.t-Button:focus,
.a-Button:focus,
.ui-button:focus,
.a-CardView-button:focus,
.apex-button-group label:focus,
.t-Form-fieldContainer--radioButtonGroup .apex-item-group--rc input + label:focus,
.t-Form-helpButton:focus |
var(--a-button-focus-shadow) | |
.apex-item-file--native::-webkit-file-upload-button |
none | |
.apex-item-file--native::-webkit-file-upload-button:hover |
var(--a-button-hover-shadow) | |
.apex-item-file--native::-webkit-file-upload-button.is-active, .apex-item-file--native::-webkit-file-upload-button.ui-state-active, .apex-item-file--native::-webkit-file-upload-button:active, .apex-item-file--native::-webkit-file-upload-button:active:focus |
var(--a-button-active-shadow, var(--a-button-hover-shadow)) | |
.apex-item-file--native::-webkit-file-upload-button:focus |
var(--a-button-focus-shadow) | |
.apex-rds-hover a |
none | |
.apex-item-wrapper--date-picker-jet .oj-text-field-container .oj-component-icon.oj-clickable-icon-nocontext:not(.oj-select-clear-entry-icon):not(.oj-combobox-clear-entry-icon):not(.oj-label-help-icon-anchor),
.a-GV-columnItem .apex-item-datepicker-jet .oj-text-field-container .oj-component-icon.oj-clickable-icon-nocontext:not(.oj-select-clear-entry-icon):not(.oj-combobox-clear-entry-icon):not(.oj-label-help-icon-anchor) |
none | |
.apex-item-wrapper--date-picker-jet .oj-text-field-container .oj-component-icon.oj-clickable-icon-nocontext:not(.oj-select-clear-entry-icon):not(.oj-combobox-clear-entry-icon):not(.oj-disabled):hover,
.a-GV-columnItem .apex-item-datepicker-jet .oj-text-field-container .oj-component-icon.oj-clickable-icon-nocontext:not(.oj-select-clear-entry-icon):not(.oj-combobox-clear-entry-icon):not(.oj-disabled):hover |
var(--a-button-hover-shadow) | |
.apex-item-wrapper--date-picker-jet .oj-text-field-container .oj-component-icon.oj-clickable-icon-nocontext:not(.oj-select-clear-entry-icon):not(.oj-combobox-clear-entry-icon):not(.oj-disabled):active,
.a-GV-columnItem .apex-item-datepicker-jet .oj-text-field-container .oj-component-icon.oj-clickable-icon-nocontext:not(.oj-select-clear-entry-icon):not(.oj-combobox-clear-entry-icon):not(.oj-disabled):active |
var(--a-button-active-shadow, var(--a-button-hover-shadow)) | |
.apex-fullcalendar-5 .fc-button-primary.fc-button-active,
.apex-fullcalendar-5 .fc-button-primary.fc-button-active:disabled |
none | |
.apex-fullcalendar-5 .fc-button-primary.fc-button-active,
.apex-fullcalendar-5 .fc-button-primary.fc-button-active:disabled |
var(--a-button-active-shadow, var(--a-button-hover-shadow)) |
--a-button-zindex
| Selector | Value | Color |
|---|---|---|
.t-Button:hover,
.a-Button:hover,
.ui-button:hover,
.a-CardView-button:hover,
.apex-button-group label:hover,
.t-Form-fieldContainer--radioButtonGroup .apex-item-group--rc input + label:hover,
.t-Form-helpButton:hover |
100 | |
.t-Button.is-active, .t-Button.ui-state-active, .t-Button:active, .t-Button:active:focus,
.a-Button.is-active,
.a-Button.ui-state-active,
.a-Button:active,
.a-Button:active:focus,
.ui-button.is-active,
.ui-button.ui-state-active,
.ui-button:active,
.ui-button:active:focus,
.a-CardView-button.is-active,
.a-CardView-button.ui-state-active,
.a-CardView-button:active,
.a-CardView-button:active:focus,
.apex-button-group label.is-active,
.apex-button-group label.ui-state-active,
.apex-button-group label:active,
.apex-button-group label:active:focus,
.t-Form-fieldContainer--radioButtonGroup .apex-item-group--rc input + label.is-active,
.t-Form-fieldContainer--radioButtonGroup .apex-item-group--rc input + label.ui-state-active,
.t-Form-fieldContainer--radioButtonGroup .apex-item-group--rc input + label:active,
.t-Form-fieldContainer--radioButtonGroup .apex-item-group--rc input + label:active:focus,
.t-Form-helpButton.is-active,
.t-Form-helpButton.ui-state-active,
.t-Form-helpButton:active,
.t-Form-helpButton:active:focus |
100 | |
.t-Button:focus,
.a-Button:focus,
.ui-button:focus,
.a-CardView-button:focus,
.apex-button-group label:focus,
.t-Form-fieldContainer--radioButtonGroup .apex-item-group--rc input + label:focus,
.t-Form-helpButton:focus |
110 | |
.apex-item-file--native::-webkit-file-upload-button:hover |
100 | |
.apex-item-file--native::-webkit-file-upload-button.is-active, .apex-item-file--native::-webkit-file-upload-button.ui-state-active, .apex-item-file--native::-webkit-file-upload-button:active, .apex-item-file--native::-webkit-file-upload-button:active:focus |
100 | |
.apex-item-file--native::-webkit-file-upload-button:focus |
110 |
--a-button-disabled-cursor
| Selector | Value | Color |
|---|---|---|
.t-Button.is-disabled, .t-Button[disabled],
.a-Button.is-disabled,
.a-Button[disabled],
.ui-button.is-disabled,
.ui-button[disabled],
.a-CardView-button.is-disabled,
.a-CardView-button[disabled],
.apex-button-group label.is-disabled,
.apex-button-group label[disabled],
.t-Form-fieldContainer--radioButtonGroup .apex-item-group--rc input + label.is-disabled,
.t-Form-fieldContainer--radioButtonGroup .apex-item-group--rc input + label[disabled],
.t-Form-helpButton.is-disabled,
.t-Form-helpButton[disabled] |
default | |
.apex-item-file--native::-webkit-file-upload-button.is-disabled, .apex-item-file--native::-webkit-file-upload-button[disabled] |
default |
--a-button-disabled-opacity
| Selector | Value | Color |
|---|---|---|
.t-Button.is-disabled, .t-Button[disabled],
.a-Button.is-disabled,
.a-Button[disabled],
.ui-button.is-disabled,
.ui-button[disabled],
.a-CardView-button.is-disabled,
.a-CardView-button[disabled],
.apex-button-group label.is-disabled,
.apex-button-group label[disabled],
.t-Form-fieldContainer--radioButtonGroup .apex-item-group--rc input + label.is-disabled,
.t-Form-fieldContainer--radioButtonGroup .apex-item-group--rc input + label[disabled],
.t-Form-helpButton.is-disabled,
.t-Form-helpButton[disabled] |
0.5 | |
.apex-item-file--native::-webkit-file-upload-button.is-disabled, .apex-item-file--native::-webkit-file-upload-button[disabled] |
0.5 |
--a-button-icon-size
| Selector | Value | Color |
|---|---|---|
.t-Button .t-Icon,
.t-Button .a-Icon,
.t-Button-icon,
.a-CardView-buttonIcon |
1rem | |
.t-Button--tiny,
.t-Button--xsmall |
.75rem | |
.t-Button--small |
.75rem | |
.t-Button--headerTree.t-Button:before |
1rem | |
.t-Button--headerTree.t-Button:before |
1rem | |
.t-Button--headerTree:hover .t-Header-controlsIcon, .t-Button--headerTree:hover .t-Header-controlsIcon:after, .t-Button--headerTree:hover .t-Header-controlsIcon:before |
1rem | |
.t-Button--headerTree.is-active:hover .t-Header-controlsIcon:before,
.t-Button--headerTree.is-active:focus .t-Header-controlsIcon:before |
1rem | |
.t-Button--headerTree.is-active:hover .t-Header-controlsIcon:after,
.t-Button--headerTree.is-active:focus .t-Header-controlsIcon:after |
1rem | |
.t-Button--headerTree.is-active .t-Header-controlsIcon:after |
1rem |
--a-button-icon-spacing
| Selector | Value | Color |
|---|---|---|
.t-Button-badge |
0.25rem | |
.t-Button-badge |
0.25rem | |
.t-Button--noLabel |
0rem | |
.t-Button--iconLeft .t-Icon |
0.25rem | |
.t-Button--iconLeft .t-Icon |
0.25rem | |
.t-Button--iconRight .t-Icon |
0.25rem | |
.t-Button--iconRight .t-Icon |
0.25rem | |
.t-Button--navBar .t-Icon |
0.25rem | |
.t-Button--navBar .t-Icon |
0.25rem | |
.t-NavigationBar-item.icon-only .t-Icon |
0rem |
--jui-icon-size
| Selector | Value | Color |
|---|---|---|
.ui-button |
var(--a-button-icon-size) |
--a-button-text-color
| Selector | Value | Color |
|---|---|---|
.t-Button--link |
var(--ut-link-text-color) |
--ut-link-text-decoration
| Selector | Value | Color |
|---|---|---|
.t-Button--link:hover |
underline | |
.t-Button--link:hover |
underline | |
.t-Footer-apex a:hover |
underline | |
.t-Footer-apex a:hover |
underline | |
.t-Alert--page .a-Notification-link:hover |
underline | |
.t-Alert--page .a-Notification-link:hover |
underline | |
.t-Alert--page a |
underline | |
.t-Alert--page a |
underline | |
.t-ContentRow-title a:not([class]):hover |
underline | |
.t-ContentRow-title a:not([class]):hover |
underline | |
.t-Comments-info a:not(.t-Button):hover |
underline | |
.t-Comments-info a:not(.t-Button):hover |
underline | |
.t-Breadcrumb-item a:hover |
underline | |
.t-Breadcrumb-item a:hover |
underline | |
.t-MegaMenu-itemBody.is-focused .t-MegaMenu-label, .t-MegaMenu-itemBody:hover .t-MegaMenu-label |
underline | |
.t-MegaMenu-itemBody.is-focused .t-MegaMenu-label, .t-MegaMenu-itemBody:hover .t-MegaMenu-label |
underline | |
.apex-quick-picks a:hover |
underline | |
.apex-quick-picks a:hover |
underline |
--a-button-gap-x
| Selector | Value | Color |
|---|---|---|
.t-Button + .t-Button |
0.5rem | |
.t-Button + .t-Button |
0.5rem | |
.t-Button--header + .t-Button--header |
0rem | |
.t-BreadcrumbRegion |
calc(var(--a-button-gap-x, .5rem) / 2) | |
.t-Region-headerItems--buttons .t-Button--icon + .t-Button--icon |
0 | |
.t-Validation-actions |
0.5rem | |
.t-Validation-actions |
0.5rem |
--a-button-shadow
| Selector | Value | Color |
|---|---|---|
.t-Button--header |
none |
--a-field-input-flex-grow
| Selector | Value | Color |
|---|---|---|
.t-Form--stretchInputs .apex-button-group,
.t-Form-fieldContainer--stretchInputs .apex-button-group,
.t-Form--stretchInputs .t-Form-fieldContainer--radioButtonGroup .apex-item-group--rc,
.t-Form-fieldContainer--stretchInputs.t-Form-fieldContainer--radioButtonGroup .apex-item-group--rc |
1 | |
.apex-button-group,
.t-Form-fieldContainer--radioButtonGroup .apex-item-group--rc |
0 | |
.t-Form--stretchInputs .t-Form-fieldContainer,
.t-Form-fieldContainer--stretchInputs |
1 | |
.t-Form-fieldContainer--floatingLabel |
1 | |
.apex-item-text,
.apex-item-select,
.apex-item-textarea,
.u-TF-item--text,
.u-TF-item--select,
select.listmanager,
select.group_selectlist,
.apex-item-multi,
.datetimepicker_newMonth |
1 |
--ut-pillbutton-font-size
| Selector | Value | Color |
|---|---|---|
.apex-button-group label,
.t-Form-fieldContainer--radioButtonGroup .apex-item-group--rc label |
0.75rem |
--ut-pillbutton-line-height
| Selector | Value | Color |
|---|---|---|
.apex-button-group label,
.t-Form-fieldContainer--radioButtonGroup .apex-item-group--rc label |
1rem |
--ut-pillbutton-checkbox-line-height
| Selector | Value | Color |
|---|---|---|
.t-Form-fieldContainer--radioButtonGroup .apex-item-group--rc.apex-item-checkbox input + label |
1rem |
--ut-body-actions-border-width
| Selector | Value | Color |
|---|---|---|
.t-Body-actionsToggle |
1px |
--ut-body-actions-border-color
| Selector | Value | Color |
|---|---|---|
.t-Body-actionsToggle |
var(--ut-component-border-color) |
--ut-body-actionstoggle-background-color
| Selector | Value | Color |
|---|---|---|
.t-Body-actionsToggle |
var(--ut-body-actions-background-color) | |
.t-Body-actionsToggle:active |
var(--ut-body-actionstoggle-hover-background-color) |
--ut-body-actionstoggle-text-color
| Selector | Value | Color |
|---|---|---|
.t-Body-actionsToggle |
var(--ut-body-actions-text-color) |
--ut-body-actions-toggle-offset
| Selector | Value | Color |
|---|---|---|
.t-Body-actionsToggle |
0 | |
.t-Body-actionsToggle |
0 |
--ut-body-actionstoggle-padding-x
| Selector | Value | Color |
|---|---|---|
.t-Body-actionsToggle.is-active, .t-Body-actionsToggle:hover, .t-Body-actionsToggle:focus |
.625rem |
--a-icon-font-family
| Selector | Value | Color |
|---|---|---|
.t-Body-actionsControlsIcon:before |
"apex-5-icon-font" | |
.ui-dialog--apex.t-Dialog-page--wizard .ui-dialog-content:after,
.ui-dialog--apex.t-Dialog-page--standard .ui-dialog-content:after |
"apex-5-icon-font" | |
.t-LinksList-link:before |
"apex-5-icon-font" | |
.t-WizardSteps-step.is-complete .t-WizardSteps-marker:before |
"apex-5-icon-font" | |
.t-BreadcrumbRegion .t-Breadcrumb-item:nth-last-child(2) .t-Breadcrumb-label:before |
"apex-5-icon-font" | |
.a-GeoCoder-map:empty:before |
"apex-5-icon-font" | |
.apex-item-wrapper--date-picker-jet .oj-fwk-icon-calendar:before,
.apex-item-wrapper--date-picker-jet .oj-inputdatetime-calendar-icon:before,
.a-GV-columnItem .apex-item-datepicker-jet .oj-fwk-icon-calendar:before,
.a-GV-columnItem .apex-item-datepicker-jet .oj-inputdatetime-calendar-icon:before |
"apex-5-icon-font" | |
.apex-item-wrapper--date-picker-jet .oj-fwk-icon-calendar-clock:before,
.apex-item-wrapper--date-picker-jet .oj-inputdatetime-calendar-clock-icon:before,
.a-GV-columnItem .apex-item-datepicker-jet .oj-fwk-icon-calendar-clock:before,
.a-GV-columnItem .apex-item-datepicker-jet .oj-inputdatetime-calendar-clock-icon:before |
"apex-5-icon-font" |
--ut-header-padding-y
| Selector | Value | Color |
|---|---|---|
.t-Header-branding |
0.5rem | |
.t-Header-branding |
0.5rem |
--ut-header-padding-x
| Selector | Value | Color |
|---|---|---|
.t-Header-branding |
0.5rem | |
.t-Header-branding |
0.5rem | |
.t-Header-branding |
0.5rem | |
.t-Header-branding |
0.5rem |
--ut-header-border-width
| Selector | Value | Color |
|---|---|---|
.t-Header-branding |
1px |
--ut-header-controls-icon-middle-width
| Selector | Value | Color |
|---|---|---|
.t-Header-controlsIcon, .t-Header-controlsIcon:after, .t-Header-controlsIcon:before |
1rem |
--ut-header-controls-icon-height
| Selector | Value | Color |
|---|---|---|
.t-Header-controlsIcon, .t-Header-controlsIcon:after, .t-Header-controlsIcon:before |
0.125rem |
--ut-header-controls-icon-border-radius
| Selector | Value | Color |
|---|---|---|
.t-Header-controlsIcon, .t-Header-controlsIcon:after, .t-Header-controlsIcon:before |
0.25rem |
--ut-header-controls-icon-transition
| Selector | Value | Color |
|---|---|---|
.t-Header-controlsIcon, .t-Header-controlsIcon:after, .t-Header-controlsIcon:before |
transform 0.12s ease | |
.t-Header-controlsIcon:before |
inset-block-start 75ms ease 0.12s, opacity 75ms ease, width 75ms ease | |
.t-Header-controlsIcon:after |
inset-block-end 75ms ease 0.12s, transform 75ms cubic-bezier(0.55, 0.055, 0.675, 0.19), width 75ms ease | |
.t-Button--headerTree.is-active:hover .t-Header-controlsIcon:before,
.t-Button--headerTree.is-active:focus .t-Header-controlsIcon:before |
inset-block-start 75ms ease, opacity 75ms ease 0.12s | |
.t-Button--headerTree.is-active:hover .t-Header-controlsIcon:after,
.t-Button--headerTree.is-active:focus .t-Header-controlsIcon:after |
inset-block-end 75ms ease, transform 75ms cubic-bezier(0.215, 0.61, 0.355, 1) 0.12s, width 75ms ease | |
.t-Button--headerTree.is-active .t-Header-controlsIcon:before |
inset-block-start 75ms ease, opacity 75ms ease 0.12s | |
.t-Button--headerTree.is-active .t-Header-controlsIcon:after |
inset-block-end 75ms ease, transform 75ms cubic-bezier(0.215, 0.61, 0.355, 1) 0.12s |
--ut-header-controls-icon-top-width
| Selector | Value | Color |
|---|---|---|
.t-Header-controlsIcon:before |
0.75rem |
--ut-header-controls-icon-bottom-width
| Selector | Value | Color |
|---|---|---|
.t-Header-controlsIcon:after |
0.5rem |
--ut-logo-font-size
| Selector | Value | Color |
|---|---|---|
.t-Header-logo |
1.125rem |
--ut-logo-line-height
| Selector | Value | Color |
|---|---|---|
.t-Header-logo |
1.5rem |
--ut-logo-font-weight
| Selector | Value | Color |
|---|---|---|
.t-Header-logo |
500 |
--ut-logo-text-color
| Selector | Value | Color |
|---|---|---|
.t-Header-logo-link |
inherit |
--ut-header-logo-height
| Selector | Value | Color |
|---|---|---|
.t-Header-logo-link img |
0.5r |
--ut-logo-img-spacing
| Selector | Value | Color |
|---|---|---|
.t-Header-logo-link .apex-logo-img + .apex-logo-text |
0.25rem | |
.t-Header-logo-link .apex-logo-img + .apex-logo-text |
0.25rem |
--ut-button-badge-font-size
| Selector | Value | Color |
|---|---|---|
.t-Button--navBar .t-Button-badge |
0.6875rem |
--a-treeview-toggle-size
| Selector | Value | Color |
|---|---|---|
.t-TreeNav |
1rem |
--a-treeview-node-indent
| Selector | Value | Color |
|---|---|---|
.t-TreeNav |
0rem | |
.t-TreeNav .a-TreeView-node--topLevel > ul |
var(--ut-treeview-node-indent, 1rem) | |
.t-TreeNav .a-TreeView-node--topLevel > ul ul |
calc(var(--ut-treeview-leaf-node-indent, var(--ut-treeview-node-indent-placeholder)) * 2) |
--a-treeview-node-padding-y
| Selector | Value | Color |
|---|---|---|
.t-TreeNav |
.5rem |
--a-treeview-node-padding-x
| Selector | Value | Color |
|---|---|---|
.t-TreeNav |
.5rem |
--a-treeview-node-cursor
| Selector | Value | Color |
|---|---|---|
.t-TreeNav |
pointer | |
.no-js .t-TreeNav |
default |
--ut-treeview-icon-size
| Selector | Value | Color |
|---|---|---|
.t-TreeNav .a-TreeView-content .fa |
1rem | |
.t-TreeNav .a-TreeView-node--topLevel > ul |
var(--ut-treeview-node-icon-size) |
--ut-treeview-toggle-width
| Selector | Value | Color |
|---|---|---|
.t-TreeNav .a-TreeView-toggle |
2rem |
--ut-treeview-badge-padding-x
| Selector | Value | Color |
|---|---|---|
.t-TreeNav .a-TreeView-badge |
0.375rem | |
.t-TreeNav .a-TreeView-badge |
0.375rem | |
.t-TreeNav .a-TreeView-badge |
0.375rem | |
.t-TreeNav .a-TreeView-badge |
0.375rem | |
.apex-side-nav.js-navCollapsed .t-TreeNav .a-TreeView-badge |
var(--ut-treeview-collapsed-badge-padding-x, .25rem) |
--ut-treeview-badge-padding-y
| Selector | Value | Color |
|---|---|---|
.t-TreeNav .a-TreeView-badge |
0 | |
.t-TreeNav .a-TreeView-badge |
0 | |
.t-TreeNav .a-TreeView-badge |
0 | |
.t-TreeNav .a-TreeView-badge |
0 |
--ut-treeview-badge-font-size
| Selector | Value | Color |
|---|---|---|
.t-TreeNav .a-TreeView-badge |
0.6875rem | |
.apex-side-nav.js-navCollapsed .t-TreeNav .a-TreeView-badge |
var(--ut-treeview-collapsed-badge-font-size, .5625rem) |
--ut-treeview-badge-line-height
| Selector | Value | Color |
|---|---|---|
.t-TreeNav .a-TreeView-badge |
1.25rem | |
.apex-side-nav.js-navCollapsed .t-TreeNav .a-TreeView-badge |
var(--ut-treeview-collapsed-badge-line-height, .875rem) |
--ut-treeview-badge-border-radius
| Selector | Value | Color |
|---|---|---|
.t-TreeNav .a-TreeView-badge |
0.25rem | |
.apex-side-nav.js-navCollapsed .t-TreeNav .a-TreeView-badge |
var(--ut-treeview-collapsed-badge-border-radius, 1.25rem) |
--ut-treeview-badge-background-color
| Selector | Value | Color |
|---|---|---|
.t-TreeNav .a-TreeView-badge |
var(--ut-component-icon-background-color) |
--ut-treeview-badge-text-color
| Selector | Value | Color |
|---|---|---|
.t-TreeNav .a-TreeView-badge |
var(--ut-component-icon-color) |
--ut-treeview-icon-container-width
| Selector | Value | Color |
|---|---|---|
.t-TreeNav .a-TreeView-node .a-TreeView-content |
auto 1f | |
.t-TreeNav .a-TreeView-node--topLevel |
var(--ut-treeview-toplevel-icon-container-width, 1.5rem) | |
.t-TreeNav .a-TreeView-node--topLevel > ul |
var(--ut-treeview-node-icon-container-width, auto) |
--a-treeview-node-font-size
| Selector | Value | Color |
|---|---|---|
.t-TreeNav .a-TreeView-node--topLevel > .a-TreeView-content |
var(--ut-treeview-toplevel-node-font-size, .875rem) |
--ut-treeview-icon-container-height
| Selector | Value | Color |
|---|---|---|
.t-TreeNav .a-TreeView-node--topLevel > .a-TreeView-content |
var(--ut-treeview-toplevel-icon-container-height, 1.5rem) | |
.t-TreeNav .a-TreeView-node--topLevel > ul |
var(--ut-treeview-node-icon-container-height) |
--ut-treeview-node-indent-placeholder
| Selector | Value | Color |
|---|---|---|
.t-TreeNav .a-TreeView-node--topLevel > ul |
var(--a-treeview-node-indent) |
--ut-treeview-toplevel-leaf-padding-y
| Selector | Value | Color |
|---|---|---|
.t-TreeNav .a-TreeView-node--topLevel > ul |
0.5rem | |
.t-TreeNav .a-TreeView-node--topLevel > ul |
0.5rem | |
.t-TreeNav .a-TreeView-node--topLevel > ul |
0.5rem | |
.t-TreeNav .a-TreeView-node--topLevel > ul |
0.5rem |
--a-treeview-node-font-weight
| Selector | Value | Color |
|---|---|---|
.t-TreeNav .is-current,
.t-TreeNav .is-current--top |
var(--a-base-font-weight-semibold, 500) |
--ut-dialog-padding-y
| Selector | Value | Color |
|---|---|---|
.t-Dialog-body |
1rem | |
.t-Dialog-body |
1rem | |
.t-Dialog-body |
1rem | |
.t-Dialog-body |
1rem | |
.t-Dialog--noPadding |
0 | |
.t-Drawer-body |
1rem | |
.t-Drawer-body |
1rem | |
.t-Drawer-body |
1rem | |
.t-Drawer-body |
1rem | |
.t-Drawer--noPadding |
0 |
--ut-dialog-padding-x
| Selector | Value | Color |
|---|---|---|
.t-Dialog-body |
1rem | |
.t-Dialog-body |
1rem | |
.t-Dialog-body |
1rem | |
.t-Dialog-body |
1rem | |
.t-Dialog--noPadding |
0 | |
.t-Drawer-body |
1rem | |
.t-Drawer-body |
1rem | |
.t-Drawer-body |
1rem | |
.t-Drawer-body |
1rem | |
.t-Drawer--noPadding |
0 |
--jui-dialog-titlebar-border-width
| Selector | Value | Color |
|---|---|---|
.t-Dialog-page--wizard |
0px |
--jui-dialog-titlebar-background-color
| Selector | Value | Color |
|---|---|---|
.t-Dialog-page--wizard |
transparent |
--jui-dialog-title-font-weight
| Selector | Value | Color |
|---|---|---|
.t-Dialog-page--wizard |
var(--a-base-font-weight-semibold, 500) |
--jui-dialog-title-font-size
| Selector | Value | Color |
|---|---|---|
.t-Dialog-page--wizard |
1.25rem |
--jui-dialog-title-line-height
| Selector | Value | Color |
|---|---|---|
.t-Dialog-page--wizard |
2rem |
--jui-dialog-titlebar-padding-y
| Selector | Value | Color |
|---|---|---|
.t-Dialog-page--wizard |
.75rem |
--jui-dialog-titlebar-padding-x
| Selector | Value | Color |
|---|---|---|
.t-Dialog-page--wizard |
1rem |
--jui-dialog-buttonpane-border-width
| Selector | Value | Color |
|---|---|---|
.t-Dialog-page--wizard |
0px |
--jui-dialog-buttonpane-content-padding-y
| Selector | Value | Color |
|---|---|---|
.t-Dialog-page--wizard |
1rem |
--jui-dialog-buttonpane-content-padding-x
| Selector | Value | Color |
|---|---|---|
.t-Dialog-page--wizard |
1rem |
--ut-dialog-content-font-size
| Selector | Value | Color |
|---|---|---|
.t-Dialog-page--wizard |
.875rem |
--ut-pwa-dialog-border-top-radius
| Selector | Value | Color |
|---|---|---|
.ui-dialog.a-pwaDialog |
0.75rem | |
.ui-dialog.a-pwaDialog |
0.75rem |
--ut-dialog-region-padding-y
| Selector | Value | Color |
|---|---|---|
.t-DialogRegion-body |
1rem | |
.t-DialogRegion-body |
1rem | |
.t-DialogRegion-body |
1rem | |
.t-DialogRegion-body |
1rem | |
.t-DrawerRegion-body |
1rem | |
.t-DrawerRegion-body |
1rem | |
.t-DrawerRegion-body |
1rem | |
.t-DrawerRegion-body |
1rem |
--ut-dialog-region-padding-x
| Selector | Value | Color |
|---|---|---|
.t-DialogRegion-body |
1rem | |
.t-DialogRegion-body |
1rem | |
.t-DialogRegion-body |
1rem | |
.t-DialogRegion-body |
1rem | |
.t-DrawerRegion-body |
1rem | |
.t-DrawerRegion-body |
1rem | |
.t-DrawerRegion-body |
1rem | |
.t-DrawerRegion-body |
1rem |
--ut-component-border-width
| Selector | Value | Color |
|---|---|---|
.t-DialogRegion-buttons |
var(--jui-dialog-buttonpane-border-width) | |
.t-DrawerRegion-buttons |
var(--jui-dialog-buttonpane-border-width) |
--ut-component-border-color
| Selector | Value | Color |
|---|---|---|
.t-DialogRegion-buttons |
var(--jui-dialog-buttonpane-border-color) | |
.t-DrawerRegion-buttons |
var(--jui-dialog-buttonpane-border-color) |
--ut-dialog-pullout-max-width
| Selector | Value | Color |
|---|---|---|
.t-Drawer-page--standard |
90vw | |
.ui-dialog.t-Dialog--pullOutRight,
.ui-dialog.t-Dialog--pullOutLeft |
97vw | |
.ui-dialog--drawer |
90vw |
--ut-file-icon-padding
| Selector | Value | Color |
|---|---|---|
.u-file-icon |
0.25rem 0.5rem |
--ut-file-icon-text-color
| Selector | Value | Color |
|---|---|---|
.u-file-icon |
#fff |
--ut-file-icon-border-radius
| Selector | Value | Color |
|---|---|---|
.u-file-icon |
0.125rem |
--ut-file-icon-background-color
| Selector | Value | Color |
|---|---|---|
.u-file-icon.fa-file-powerpoint-o |
#D24726 | |
.u-file-icon.fa-file-excel-o |
#217345 | |
.u-file-icon.fa-file-word-o |
#2A579A | |
.u-file-icon.fa-file-pdf-o |
#F40700 | |
.u-file-icon.fa-file-image-o |
#C88821 | |
.u-file-icon.fa-file-o |
#6A788A |
--ut-badgelist-text-color
| Selector | Value | Color |
|---|---|---|
.t-BadgeList |
var(--ut-component-text-default-color) |
--ut-badgelist-item-padding-x
| Selector | Value | Color |
|---|---|---|
.t-BadgeList-item |
0.75rem | |
.t-BadgeList-item |
0.75rem | |
.t-BadgeList-item |
0.75rem | |
.t-BadgeList-item |
0.75rem |
--ut-badgelist-item-padding-y
| Selector | Value | Color |
|---|---|---|
.t-BadgeList-item |
0.75rem | |
.t-BadgeList-item |
0.75rem | |
.t-BadgeList-item |
0.75rem | |
.t-BadgeList-item |
0.75rem |
--ut-badgelist-label-line-height
| Selector | Value | Color |
|---|---|---|
.t-BadgeList-label |
1.5 | |
.t-BadgeList--dash |
1.25rem |
--ut-badgelist-value-font-weight
| Selector | Value | Color |
|---|---|---|
.t-BadgeList-value |
500 |
--ut-badgelist-label-margin-y
| Selector | Value | Color |
|---|---|---|
.t-BadgeList--circular .t-BadgeList-label |
0.5rem | |
.t-BadgeList--circular .t-BadgeList-label |
0.5rem |
--ut-badgelist-label-text-color
| Selector | Value | Color |
|---|---|---|
.t-BadgeList--circular .t-BadgeList-label |
var(--ut-component-text-title-color) |
--u-color
| Selector | Value | Color |
|---|---|---|
.t-BadgeList--circular .t-BadgeList-value |
var(--ut-component-background-color) | |
.t-MediaList-icon |
var(--ut-component-icon-background-color) | |
.t-Card-icon |
var(--ut-component-icon-background-color) | |
.t-Cards--animColorFill .t-Card-icon:before |
inherit | |
.t-Cards--animColorFill .t-Card:hover .t-Card-colorFill:before,
.t-Cards--animColorFill .t-Card-wrap:focus .t-Card-colorFill:before |
var(--ut-component-icon-background-color) | |
.u-color-1 |
var(--u-color-1) | |
.u-color-2 |
var(--u-color-2) | |
.u-color-3 |
var(--u-color-3) | |
.u-color-4 |
var(--u-color-4) | |
.u-color-5 |
var(--u-color-5) | |
.u-color-6 |
var(--u-color-6) | |
.u-color-7 |
var(--u-color-7) | |
.u-color-8 |
var(--u-color-8) | |
.u-color-9 |
var(--u-color-9) | |
.u-color-10 |
var(--u-color-10) | |
.u-color-11 |
var(--u-color-11) | |
.u-color-12 |
var(--u-color-12) | |
.u-color-13 |
var(--u-color-13) | |
.u-color-14 |
var(--u-color-14) | |
.u-color-15 |
var(--u-color-15) | |
.u-color-16 |
var(--u-color-16) | |
.u-color-17 |
var(--u-color-17) | |
.u-color-18 |
var(--u-color-18) | |
.u-color-19 |
var(--u-color-19) | |
.u-color-20 |
var(--u-color-20) | |
.u-color-21 |
var(--u-color-21) | |
.u-color-22 |
var(--u-color-22) | |
.u-color-23 |
var(--u-color-23) | |
.u-color-24 |
var(--u-color-24) | |
.u-color-25 |
var(--u-color-25) | |
.u-color-26 |
var(--u-color-26) | |
.u-color-27 |
var(--u-color-27) | |
.u-color-28 |
var(--u-color-28) | |
.u-color-29 |
var(--u-color-29) | |
.u-color-30 |
var(--u-color-30) | |
.u-color-31 |
var(--u-color-31) | |
.u-color-32 |
var(--u-color-32) | |
.u-color-33 |
var(--u-color-33) | |
.u-color-34 |
var(--u-color-34) | |
.u-color-35 |
var(--u-color-35) | |
.u-color-36 |
var(--u-color-36) | |
.u-color-37 |
var(--u-color-37) | |
.u-color-38 |
var(--u-color-38) | |
.u-color-39 |
var(--u-color-39) | |
.u-color-40 |
var(--u-color-40) | |
.u-color-41 |
var(--u-color-41) | |
.u-color-42 |
var(--u-color-42) | |
.u-color-43 |
var(--u-color-43) | |
.u-color-44 |
var(--u-color-44) | |
.u-color-45 |
var(--u-color-45) | |
.u-colors > :nth-child(45n+1) .u-color, .u-colors .a-CardView-items > :nth-child(45n+1) .u-color |
var(--u-color-1) | |
.u-colors > :nth-child(45n+1) .u-color-bg,
.u-colors > :nth-child(45n+1) .u-color-background, .u-colors .a-CardView-items > :nth-child(45n+1) .u-color-bg,
.u-colors .a-CardView-items > :nth-child(45n+1) .u-color-background |
var(--u-color-1) | |
.u-colors > :nth-child(45n+1) .u-color-bd,
.u-colors > :nth-child(45n+1) .u-color-border, .u-colors .a-CardView-items > :nth-child(45n+1) .u-color-bd,
.u-colors .a-CardView-items > :nth-child(45n+1) .u-color-border |
var(--u-color-1) | |
.u-colors > :nth-child(45n+2) .u-color, .u-colors .a-CardView-items > :nth-child(45n+2) .u-color |
var(--u-color-2) | |
.u-colors > :nth-child(45n+2) .u-color-bg,
.u-colors > :nth-child(45n+2) .u-color-background, .u-colors .a-CardView-items > :nth-child(45n+2) .u-color-bg,
.u-colors .a-CardView-items > :nth-child(45n+2) .u-color-background |
var(--u-color-2) | |
.u-colors > :nth-child(45n+2) .u-color-bd,
.u-colors > :nth-child(45n+2) .u-color-border, .u-colors .a-CardView-items > :nth-child(45n+2) .u-color-bd,
.u-colors .a-CardView-items > :nth-child(45n+2) .u-color-border |
var(--u-color-2) | |
.u-colors > :nth-child(45n+3) .u-color, .u-colors .a-CardView-items > :nth-child(45n+3) .u-color |
var(--u-color-3) | |
.u-colors > :nth-child(45n+3) .u-color-bg,
.u-colors > :nth-child(45n+3) .u-color-background, .u-colors .a-CardView-items > :nth-child(45n+3) .u-color-bg,
.u-colors .a-CardView-items > :nth-child(45n+3) .u-color-background |
var(--u-color-3) | |
.u-colors > :nth-child(45n+3) .u-color-bd,
.u-colors > :nth-child(45n+3) .u-color-border, .u-colors .a-CardView-items > :nth-child(45n+3) .u-color-bd,
.u-colors .a-CardView-items > :nth-child(45n+3) .u-color-border |
var(--u-color-3) | |
.u-colors > :nth-child(45n+4) .u-color, .u-colors .a-CardView-items > :nth-child(45n+4) .u-color |
var(--u-color-4) | |
.u-colors > :nth-child(45n+4) .u-color-bg,
.u-colors > :nth-child(45n+4) .u-color-background, .u-colors .a-CardView-items > :nth-child(45n+4) .u-color-bg,
.u-colors .a-CardView-items > :nth-child(45n+4) .u-color-background |
var(--u-color-4) | |
.u-colors > :nth-child(45n+4) .u-color-bd,
.u-colors > :nth-child(45n+4) .u-color-border, .u-colors .a-CardView-items > :nth-child(45n+4) .u-color-bd,
.u-colors .a-CardView-items > :nth-child(45n+4) .u-color-border |
var(--u-color-4) | |
.u-colors > :nth-child(45n+5) .u-color, .u-colors .a-CardView-items > :nth-child(45n+5) .u-color |
var(--u-color-5) | |
.u-colors > :nth-child(45n+5) .u-color-bg,
.u-colors > :nth-child(45n+5) .u-color-background, .u-colors .a-CardView-items > :nth-child(45n+5) .u-color-bg,
.u-colors .a-CardView-items > :nth-child(45n+5) .u-color-background |
var(--u-color-5) | |
.u-colors > :nth-child(45n+5) .u-color-bd,
.u-colors > :nth-child(45n+5) .u-color-border, .u-colors .a-CardView-items > :nth-child(45n+5) .u-color-bd,
.u-colors .a-CardView-items > :nth-child(45n+5) .u-color-border |
var(--u-color-5) | |
.u-colors > :nth-child(45n+6) .u-color, .u-colors .a-CardView-items > :nth-child(45n+6) .u-color |
var(--u-color-6) | |
.u-colors > :nth-child(45n+6) .u-color-bg,
.u-colors > :nth-child(45n+6) .u-color-background, .u-colors .a-CardView-items > :nth-child(45n+6) .u-color-bg,
.u-colors .a-CardView-items > :nth-child(45n+6) .u-color-background |
var(--u-color-6) | |
.u-colors > :nth-child(45n+6) .u-color-bd,
.u-colors > :nth-child(45n+6) .u-color-border, .u-colors .a-CardView-items > :nth-child(45n+6) .u-color-bd,
.u-colors .a-CardView-items > :nth-child(45n+6) .u-color-border |
var(--u-color-6) | |
.u-colors > :nth-child(45n+7) .u-color, .u-colors .a-CardView-items > :nth-child(45n+7) .u-color |
var(--u-color-7) | |
.u-colors > :nth-child(45n+7) .u-color-bg,
.u-colors > :nth-child(45n+7) .u-color-background, .u-colors .a-CardView-items > :nth-child(45n+7) .u-color-bg,
.u-colors .a-CardView-items > :nth-child(45n+7) .u-color-background |
var(--u-color-7) | |
.u-colors > :nth-child(45n+7) .u-color-bd,
.u-colors > :nth-child(45n+7) .u-color-border, .u-colors .a-CardView-items > :nth-child(45n+7) .u-color-bd,
.u-colors .a-CardView-items > :nth-child(45n+7) .u-color-border |
var(--u-color-7) | |
.u-colors > :nth-child(45n+8) .u-color, .u-colors .a-CardView-items > :nth-child(45n+8) .u-color |
var(--u-color-8) | |
.u-colors > :nth-child(45n+8) .u-color-bg,
.u-colors > :nth-child(45n+8) .u-color-background, .u-colors .a-CardView-items > :nth-child(45n+8) .u-color-bg,
.u-colors .a-CardView-items > :nth-child(45n+8) .u-color-background |
var(--u-color-8) | |
.u-colors > :nth-child(45n+8) .u-color-bd,
.u-colors > :nth-child(45n+8) .u-color-border, .u-colors .a-CardView-items > :nth-child(45n+8) .u-color-bd,
.u-colors .a-CardView-items > :nth-child(45n+8) .u-color-border |
var(--u-color-8) | |
.u-colors > :nth-child(45n+9) .u-color, .u-colors .a-CardView-items > :nth-child(45n+9) .u-color |
var(--u-color-9) | |
.u-colors > :nth-child(45n+9) .u-color-bg,
.u-colors > :nth-child(45n+9) .u-color-background, .u-colors .a-CardView-items > :nth-child(45n+9) .u-color-bg,
.u-colors .a-CardView-items > :nth-child(45n+9) .u-color-background |
var(--u-color-9) | |
.u-colors > :nth-child(45n+9) .u-color-bd,
.u-colors > :nth-child(45n+9) .u-color-border, .u-colors .a-CardView-items > :nth-child(45n+9) .u-color-bd,
.u-colors .a-CardView-items > :nth-child(45n+9) .u-color-border |
var(--u-color-9) | |
.u-colors > :nth-child(45n+10) .u-color, .u-colors .a-CardView-items > :nth-child(45n+10) .u-color |
var(--u-color-10) | |
.u-colors > :nth-child(45n+10) .u-color-bg,
.u-colors > :nth-child(45n+10) .u-color-background, .u-colors .a-CardView-items > :nth-child(45n+10) .u-color-bg,
.u-colors .a-CardView-items > :nth-child(45n+10) .u-color-background |
var(--u-color-10) | |
.u-colors > :nth-child(45n+10) .u-color-bd,
.u-colors > :nth-child(45n+10) .u-color-border, .u-colors .a-CardView-items > :nth-child(45n+10) .u-color-bd,
.u-colors .a-CardView-items > :nth-child(45n+10) .u-color-border |
var(--u-color-10) | |
.u-colors > :nth-child(45n+11) .u-color, .u-colors .a-CardView-items > :nth-child(45n+11) .u-color |
var(--u-color-11) | |
.u-colors > :nth-child(45n+11) .u-color-bg,
.u-colors > :nth-child(45n+11) .u-color-background, .u-colors .a-CardView-items > :nth-child(45n+11) .u-color-bg,
.u-colors .a-CardView-items > :nth-child(45n+11) .u-color-background |
var(--u-color-11) | |
.u-colors > :nth-child(45n+11) .u-color-bd,
.u-colors > :nth-child(45n+11) .u-color-border, .u-colors .a-CardView-items > :nth-child(45n+11) .u-color-bd,
.u-colors .a-CardView-items > :nth-child(45n+11) .u-color-border |
var(--u-color-11) | |
.u-colors > :nth-child(45n+12) .u-color, .u-colors .a-CardView-items > :nth-child(45n+12) .u-color |
var(--u-color-12) | |
.u-colors > :nth-child(45n+12) .u-color-bg,
.u-colors > :nth-child(45n+12) .u-color-background, .u-colors .a-CardView-items > :nth-child(45n+12) .u-color-bg,
.u-colors .a-CardView-items > :nth-child(45n+12) .u-color-background |
var(--u-color-12) | |
.u-colors > :nth-child(45n+12) .u-color-bd,
.u-colors > :nth-child(45n+12) .u-color-border, .u-colors .a-CardView-items > :nth-child(45n+12) .u-color-bd,
.u-colors .a-CardView-items > :nth-child(45n+12) .u-color-border |
var(--u-color-12) | |
.u-colors > :nth-child(45n+13) .u-color, .u-colors .a-CardView-items > :nth-child(45n+13) .u-color |
var(--u-color-13) | |
.u-colors > :nth-child(45n+13) .u-color-bg,
.u-colors > :nth-child(45n+13) .u-color-background, .u-colors .a-CardView-items > :nth-child(45n+13) .u-color-bg,
.u-colors .a-CardView-items > :nth-child(45n+13) .u-color-background |
var(--u-color-13) | |
.u-colors > :nth-child(45n+13) .u-color-bd,
.u-colors > :nth-child(45n+13) .u-color-border, .u-colors .a-CardView-items > :nth-child(45n+13) .u-color-bd,
.u-colors .a-CardView-items > :nth-child(45n+13) .u-color-border |
var(--u-color-13) | |
.u-colors > :nth-child(45n+14) .u-color, .u-colors .a-CardView-items > :nth-child(45n+14) .u-color |
var(--u-color-14) | |
.u-colors > :nth-child(45n+14) .u-color-bg,
.u-colors > :nth-child(45n+14) .u-color-background, .u-colors .a-CardView-items > :nth-child(45n+14) .u-color-bg,
.u-colors .a-CardView-items > :nth-child(45n+14) .u-color-background |
var(--u-color-14) | |
.u-colors > :nth-child(45n+14) .u-color-bd,
.u-colors > :nth-child(45n+14) .u-color-border, .u-colors .a-CardView-items > :nth-child(45n+14) .u-color-bd,
.u-colors .a-CardView-items > :nth-child(45n+14) .u-color-border |
var(--u-color-14) | |
.u-colors > :nth-child(45n+15) .u-color, .u-colors .a-CardView-items > :nth-child(45n+15) .u-color |
var(--u-color-15) | |
.u-colors > :nth-child(45n+15) .u-color-bg,
.u-colors > :nth-child(45n+15) .u-color-background, .u-colors .a-CardView-items > :nth-child(45n+15) .u-color-bg,
.u-colors .a-CardView-items > :nth-child(45n+15) .u-color-background |
var(--u-color-15) | |
.u-colors > :nth-child(45n+15) .u-color-bd,
.u-colors > :nth-child(45n+15) .u-color-border, .u-colors .a-CardView-items > :nth-child(45n+15) .u-color-bd,
.u-colors .a-CardView-items > :nth-child(45n+15) .u-color-border |
var(--u-color-15) | |
.u-colors > :nth-child(45n+16) .u-color, .u-colors .a-CardView-items > :nth-child(45n+16) .u-color |
var(--u-color-16) | |
.u-colors > :nth-child(45n+16) .u-color-bg,
.u-colors > :nth-child(45n+16) .u-color-background, .u-colors .a-CardView-items > :nth-child(45n+16) .u-color-bg,
.u-colors .a-CardView-items > :nth-child(45n+16) .u-color-background |
var(--u-color-16) | |
.u-colors > :nth-child(45n+16) .u-color-bd,
.u-colors > :nth-child(45n+16) .u-color-border, .u-colors .a-CardView-items > :nth-child(45n+16) .u-color-bd,
.u-colors .a-CardView-items > :nth-child(45n+16) .u-color-border |
var(--u-color-16) | |
.u-colors > :nth-child(45n+17) .u-color, .u-colors .a-CardView-items > :nth-child(45n+17) .u-color |
var(--u-color-17) | |
.u-colors > :nth-child(45n+17) .u-color-bg,
.u-colors > :nth-child(45n+17) .u-color-background, .u-colors .a-CardView-items > :nth-child(45n+17) .u-color-bg,
.u-colors .a-CardView-items > :nth-child(45n+17) .u-color-background |
var(--u-color-17) | |
.u-colors > :nth-child(45n+17) .u-color-bd,
.u-colors > :nth-child(45n+17) .u-color-border, .u-colors .a-CardView-items > :nth-child(45n+17) .u-color-bd,
.u-colors .a-CardView-items > :nth-child(45n+17) .u-color-border |
var(--u-color-17) | |
.u-colors > :nth-child(45n+18) .u-color, .u-colors .a-CardView-items > :nth-child(45n+18) .u-color |
var(--u-color-18) | |
.u-colors > :nth-child(45n+18) .u-color-bg,
.u-colors > :nth-child(45n+18) .u-color-background, .u-colors .a-CardView-items > :nth-child(45n+18) .u-color-bg,
.u-colors .a-CardView-items > :nth-child(45n+18) .u-color-background |
var(--u-color-18) | |
.u-colors > :nth-child(45n+18) .u-color-bd,
.u-colors > :nth-child(45n+18) .u-color-border, .u-colors .a-CardView-items > :nth-child(45n+18) .u-color-bd,
.u-colors .a-CardView-items > :nth-child(45n+18) .u-color-border |
var(--u-color-18) | |
.u-colors > :nth-child(45n+19) .u-color, .u-colors .a-CardView-items > :nth-child(45n+19) .u-color |
var(--u-color-19) | |
.u-colors > :nth-child(45n+19) .u-color-bg,
.u-colors > :nth-child(45n+19) .u-color-background, .u-colors .a-CardView-items > :nth-child(45n+19) .u-color-bg,
.u-colors .a-CardView-items > :nth-child(45n+19) .u-color-background |
var(--u-color-19) | |
.u-colors > :nth-child(45n+19) .u-color-bd,
.u-colors > :nth-child(45n+19) .u-color-border, .u-colors .a-CardView-items > :nth-child(45n+19) .u-color-bd,
.u-colors .a-CardView-items > :nth-child(45n+19) .u-color-border |
var(--u-color-19) | |
.u-colors > :nth-child(45n+20) .u-color, .u-colors .a-CardView-items > :nth-child(45n+20) .u-color |
var(--u-color-20) | |
.u-colors > :nth-child(45n+20) .u-color-bg,
.u-colors > :nth-child(45n+20) .u-color-background, .u-colors .a-CardView-items > :nth-child(45n+20) .u-color-bg,
.u-colors .a-CardView-items > :nth-child(45n+20) .u-color-background |
var(--u-color-20) | |
.u-colors > :nth-child(45n+20) .u-color-bd,
.u-colors > :nth-child(45n+20) .u-color-border, .u-colors .a-CardView-items > :nth-child(45n+20) .u-color-bd,
.u-colors .a-CardView-items > :nth-child(45n+20) .u-color-border |
var(--u-color-20) | |
.u-colors > :nth-child(45n+21) .u-color, .u-colors .a-CardView-items > :nth-child(45n+21) .u-color |
var(--u-color-21) | |
.u-colors > :nth-child(45n+21) .u-color-bg,
.u-colors > :nth-child(45n+21) .u-color-background, .u-colors .a-CardView-items > :nth-child(45n+21) .u-color-bg,
.u-colors .a-CardView-items > :nth-child(45n+21) .u-color-background |
var(--u-color-21) | |
.u-colors > :nth-child(45n+21) .u-color-bd,
.u-colors > :nth-child(45n+21) .u-color-border, .u-colors .a-CardView-items > :nth-child(45n+21) .u-color-bd,
.u-colors .a-CardView-items > :nth-child(45n+21) .u-color-border |
var(--u-color-21) | |
.u-colors > :nth-child(45n+22) .u-color, .u-colors .a-CardView-items > :nth-child(45n+22) .u-color |
var(--u-color-22) | |
.u-colors > :nth-child(45n+22) .u-color-bg,
.u-colors > :nth-child(45n+22) .u-color-background, .u-colors .a-CardView-items > :nth-child(45n+22) .u-color-bg,
.u-colors .a-CardView-items > :nth-child(45n+22) .u-color-background |
var(--u-color-22) | |
.u-colors > :nth-child(45n+22) .u-color-bd,
.u-colors > :nth-child(45n+22) .u-color-border, .u-colors .a-CardView-items > :nth-child(45n+22) .u-color-bd,
.u-colors .a-CardView-items > :nth-child(45n+22) .u-color-border |
var(--u-color-22) | |
.u-colors > :nth-child(45n+23) .u-color, .u-colors .a-CardView-items > :nth-child(45n+23) .u-color |
var(--u-color-23) | |
.u-colors > :nth-child(45n+23) .u-color-bg,
.u-colors > :nth-child(45n+23) .u-color-background, .u-colors .a-CardView-items > :nth-child(45n+23) .u-color-bg,
.u-colors .a-CardView-items > :nth-child(45n+23) .u-color-background |
var(--u-color-23) | |
.u-colors > :nth-child(45n+23) .u-color-bd,
.u-colors > :nth-child(45n+23) .u-color-border, .u-colors .a-CardView-items > :nth-child(45n+23) .u-color-bd,
.u-colors .a-CardView-items > :nth-child(45n+23) .u-color-border |
var(--u-color-23) | |
.u-colors > :nth-child(45n+24) .u-color, .u-colors .a-CardView-items > :nth-child(45n+24) .u-color |
var(--u-color-24) | |
.u-colors > :nth-child(45n+24) .u-color-bg,
.u-colors > :nth-child(45n+24) .u-color-background, .u-colors .a-CardView-items > :nth-child(45n+24) .u-color-bg,
.u-colors .a-CardView-items > :nth-child(45n+24) .u-color-background |
var(--u-color-24) | |
.u-colors > :nth-child(45n+24) .u-color-bd,
.u-colors > :nth-child(45n+24) .u-color-border, .u-colors .a-CardView-items > :nth-child(45n+24) .u-color-bd,
.u-colors .a-CardView-items > :nth-child(45n+24) .u-color-border |
var(--u-color-24) | |
.u-colors > :nth-child(45n+25) .u-color, .u-colors .a-CardView-items > :nth-child(45n+25) .u-color |
var(--u-color-25) | |
.u-colors > :nth-child(45n+25) .u-color-bg,
.u-colors > :nth-child(45n+25) .u-color-background, .u-colors .a-CardView-items > :nth-child(45n+25) .u-color-bg,
.u-colors .a-CardView-items > :nth-child(45n+25) .u-color-background |
var(--u-color-25) | |
.u-colors > :nth-child(45n+25) .u-color-bd,
.u-colors > :nth-child(45n+25) .u-color-border, .u-colors .a-CardView-items > :nth-child(45n+25) .u-color-bd,
.u-colors .a-CardView-items > :nth-child(45n+25) .u-color-border |
var(--u-color-25) | |
.u-colors > :nth-child(45n+26) .u-color, .u-colors .a-CardView-items > :nth-child(45n+26) .u-color |
var(--u-color-26) | |
.u-colors > :nth-child(45n+26) .u-color-bg,
.u-colors > :nth-child(45n+26) .u-color-background, .u-colors .a-CardView-items > :nth-child(45n+26) .u-color-bg,
.u-colors .a-CardView-items > :nth-child(45n+26) .u-color-background |
var(--u-color-26) | |
.u-colors > :nth-child(45n+26) .u-color-bd,
.u-colors > :nth-child(45n+26) .u-color-border, .u-colors .a-CardView-items > :nth-child(45n+26) .u-color-bd,
.u-colors .a-CardView-items > :nth-child(45n+26) .u-color-border |
var(--u-color-26) | |
.u-colors > :nth-child(45n+27) .u-color, .u-colors .a-CardView-items > :nth-child(45n+27) .u-color |
var(--u-color-27) | |
.u-colors > :nth-child(45n+27) .u-color-bg,
.u-colors > :nth-child(45n+27) .u-color-background, .u-colors .a-CardView-items > :nth-child(45n+27) .u-color-bg,
.u-colors .a-CardView-items > :nth-child(45n+27) .u-color-background |
var(--u-color-27) | |
.u-colors > :nth-child(45n+27) .u-color-bd,
.u-colors > :nth-child(45n+27) .u-color-border, .u-colors .a-CardView-items > :nth-child(45n+27) .u-color-bd,
.u-colors .a-CardView-items > :nth-child(45n+27) .u-color-border |
var(--u-color-27) | |
.u-colors > :nth-child(45n+28) .u-color, .u-colors .a-CardView-items > :nth-child(45n+28) .u-color |
var(--u-color-28) | |
.u-colors > :nth-child(45n+28) .u-color-bg,
.u-colors > :nth-child(45n+28) .u-color-background, .u-colors .a-CardView-items > :nth-child(45n+28) .u-color-bg,
.u-colors .a-CardView-items > :nth-child(45n+28) .u-color-background |
var(--u-color-28) | |
.u-colors > :nth-child(45n+28) .u-color-bd,
.u-colors > :nth-child(45n+28) .u-color-border, .u-colors .a-CardView-items > :nth-child(45n+28) .u-color-bd,
.u-colors .a-CardView-items > :nth-child(45n+28) .u-color-border |
var(--u-color-28) | |
.u-colors > :nth-child(45n+29) .u-color, .u-colors .a-CardView-items > :nth-child(45n+29) .u-color |
var(--u-color-29) | |
.u-colors > :nth-child(45n+29) .u-color-bg,
.u-colors > :nth-child(45n+29) .u-color-background, .u-colors .a-CardView-items > :nth-child(45n+29) .u-color-bg,
.u-colors .a-CardView-items > :nth-child(45n+29) .u-color-background |
var(--u-color-29) | |
.u-colors > :nth-child(45n+29) .u-color-bd,
.u-colors > :nth-child(45n+29) .u-color-border, .u-colors .a-CardView-items > :nth-child(45n+29) .u-color-bd,
.u-colors .a-CardView-items > :nth-child(45n+29) .u-color-border |
var(--u-color-29) | |
.u-colors > :nth-child(45n+30) .u-color, .u-colors .a-CardView-items > :nth-child(45n+30) .u-color |
var(--u-color-30) | |
.u-colors > :nth-child(45n+30) .u-color-bg,
.u-colors > :nth-child(45n+30) .u-color-background, .u-colors .a-CardView-items > :nth-child(45n+30) .u-color-bg,
.u-colors .a-CardView-items > :nth-child(45n+30) .u-color-background |
var(--u-color-30) | |
.u-colors > :nth-child(45n+30) .u-color-bd,
.u-colors > :nth-child(45n+30) .u-color-border, .u-colors .a-CardView-items > :nth-child(45n+30) .u-color-bd,
.u-colors .a-CardView-items > :nth-child(45n+30) .u-color-border |
var(--u-color-30) | |
.u-colors > :nth-child(45n+31) .u-color, .u-colors .a-CardView-items > :nth-child(45n+31) .u-color |
var(--u-color-31) | |
.u-colors > :nth-child(45n+31) .u-color-bg,
.u-colors > :nth-child(45n+31) .u-color-background, .u-colors .a-CardView-items > :nth-child(45n+31) .u-color-bg,
.u-colors .a-CardView-items > :nth-child(45n+31) .u-color-background |
var(--u-color-31) | |
.u-colors > :nth-child(45n+31) .u-color-bd,
.u-colors > :nth-child(45n+31) .u-color-border, .u-colors .a-CardView-items > :nth-child(45n+31) .u-color-bd,
.u-colors .a-CardView-items > :nth-child(45n+31) .u-color-border |
var(--u-color-31) | |
.u-colors > :nth-child(45n+32) .u-color, .u-colors .a-CardView-items > :nth-child(45n+32) .u-color |
var(--u-color-32) | |
.u-colors > :nth-child(45n+32) .u-color-bg,
.u-colors > :nth-child(45n+32) .u-color-background, .u-colors .a-CardView-items > :nth-child(45n+32) .u-color-bg,
.u-colors .a-CardView-items > :nth-child(45n+32) .u-color-background |
var(--u-color-32) | |
.u-colors > :nth-child(45n+32) .u-color-bd,
.u-colors > :nth-child(45n+32) .u-color-border, .u-colors .a-CardView-items > :nth-child(45n+32) .u-color-bd,
.u-colors .a-CardView-items > :nth-child(45n+32) .u-color-border |
var(--u-color-32) | |
.u-colors > :nth-child(45n+33) .u-color, .u-colors .a-CardView-items > :nth-child(45n+33) .u-color |
var(--u-color-33) | |
.u-colors > :nth-child(45n+33) .u-color-bg,
.u-colors > :nth-child(45n+33) .u-color-background, .u-colors .a-CardView-items > :nth-child(45n+33) .u-color-bg,
.u-colors .a-CardView-items > :nth-child(45n+33) .u-color-background |
var(--u-color-33) | |
.u-colors > :nth-child(45n+33) .u-color-bd,
.u-colors > :nth-child(45n+33) .u-color-border, .u-colors .a-CardView-items > :nth-child(45n+33) .u-color-bd,
.u-colors .a-CardView-items > :nth-child(45n+33) .u-color-border |
var(--u-color-33) | |
.u-colors > :nth-child(45n+34) .u-color, .u-colors .a-CardView-items > :nth-child(45n+34) .u-color |
var(--u-color-34) | |
.u-colors > :nth-child(45n+34) .u-color-bg,
.u-colors > :nth-child(45n+34) .u-color-background, .u-colors .a-CardView-items > :nth-child(45n+34) .u-color-bg,
.u-colors .a-CardView-items > :nth-child(45n+34) .u-color-background |
var(--u-color-34) | |
.u-colors > :nth-child(45n+34) .u-color-bd,
.u-colors > :nth-child(45n+34) .u-color-border, .u-colors .a-CardView-items > :nth-child(45n+34) .u-color-bd,
.u-colors .a-CardView-items > :nth-child(45n+34) .u-color-border |
var(--u-color-34) | |
.u-colors > :nth-child(45n+35) .u-color, .u-colors .a-CardView-items > :nth-child(45n+35) .u-color |
var(--u-color-35) | |
.u-colors > :nth-child(45n+35) .u-color-bg,
.u-colors > :nth-child(45n+35) .u-color-background, .u-colors .a-CardView-items > :nth-child(45n+35) .u-color-bg,
.u-colors .a-CardView-items > :nth-child(45n+35) .u-color-background |
var(--u-color-35) | |
.u-colors > :nth-child(45n+35) .u-color-bd,
.u-colors > :nth-child(45n+35) .u-color-border, .u-colors .a-CardView-items > :nth-child(45n+35) .u-color-bd,
.u-colors .a-CardView-items > :nth-child(45n+35) .u-color-border |
var(--u-color-35) | |
.u-colors > :nth-child(45n+36) .u-color, .u-colors .a-CardView-items > :nth-child(45n+36) .u-color |
var(--u-color-36) | |
.u-colors > :nth-child(45n+36) .u-color-bg,
.u-colors > :nth-child(45n+36) .u-color-background, .u-colors .a-CardView-items > :nth-child(45n+36) .u-color-bg,
.u-colors .a-CardView-items > :nth-child(45n+36) .u-color-background |
var(--u-color-36) | |
.u-colors > :nth-child(45n+36) .u-color-bd,
.u-colors > :nth-child(45n+36) .u-color-border, .u-colors .a-CardView-items > :nth-child(45n+36) .u-color-bd,
.u-colors .a-CardView-items > :nth-child(45n+36) .u-color-border |
var(--u-color-36) | |
.u-colors > :nth-child(45n+37) .u-color, .u-colors .a-CardView-items > :nth-child(45n+37) .u-color |
var(--u-color-37) | |
.u-colors > :nth-child(45n+37) .u-color-bg,
.u-colors > :nth-child(45n+37) .u-color-background, .u-colors .a-CardView-items > :nth-child(45n+37) .u-color-bg,
.u-colors .a-CardView-items > :nth-child(45n+37) .u-color-background |
var(--u-color-37) | |
.u-colors > :nth-child(45n+37) .u-color-bd,
.u-colors > :nth-child(45n+37) .u-color-border, .u-colors .a-CardView-items > :nth-child(45n+37) .u-color-bd,
.u-colors .a-CardView-items > :nth-child(45n+37) .u-color-border |
var(--u-color-37) | |
.u-colors > :nth-child(45n+38) .u-color, .u-colors .a-CardView-items > :nth-child(45n+38) .u-color |
var(--u-color-38) | |
.u-colors > :nth-child(45n+38) .u-color-bg,
.u-colors > :nth-child(45n+38) .u-color-background, .u-colors .a-CardView-items > :nth-child(45n+38) .u-color-bg,
.u-colors .a-CardView-items > :nth-child(45n+38) .u-color-background |
var(--u-color-38) | |
.u-colors > :nth-child(45n+38) .u-color-bd,
.u-colors > :nth-child(45n+38) .u-color-border, .u-colors .a-CardView-items > :nth-child(45n+38) .u-color-bd,
.u-colors .a-CardView-items > :nth-child(45n+38) .u-color-border |
var(--u-color-38) | |
.u-colors > :nth-child(45n+39) .u-color, .u-colors .a-CardView-items > :nth-child(45n+39) .u-color |
var(--u-color-39) | |
.u-colors > :nth-child(45n+39) .u-color-bg,
.u-colors > :nth-child(45n+39) .u-color-background, .u-colors .a-CardView-items > :nth-child(45n+39) .u-color-bg,
.u-colors .a-CardView-items > :nth-child(45n+39) .u-color-background |
var(--u-color-39) | |
.u-colors > :nth-child(45n+39) .u-color-bd,
.u-colors > :nth-child(45n+39) .u-color-border, .u-colors .a-CardView-items > :nth-child(45n+39) .u-color-bd,
.u-colors .a-CardView-items > :nth-child(45n+39) .u-color-border |
var(--u-color-39) | |
.u-colors > :nth-child(45n+40) .u-color, .u-colors .a-CardView-items > :nth-child(45n+40) .u-color |
var(--u-color-40) | |
.u-colors > :nth-child(45n+40) .u-color-bg,
.u-colors > :nth-child(45n+40) .u-color-background, .u-colors .a-CardView-items > :nth-child(45n+40) .u-color-bg,
.u-colors .a-CardView-items > :nth-child(45n+40) .u-color-background |
var(--u-color-40) | |
.u-colors > :nth-child(45n+40) .u-color-bd,
.u-colors > :nth-child(45n+40) .u-color-border, .u-colors .a-CardView-items > :nth-child(45n+40) .u-color-bd,
.u-colors .a-CardView-items > :nth-child(45n+40) .u-color-border |
var(--u-color-40) | |
.u-colors > :nth-child(45n+41) .u-color, .u-colors .a-CardView-items > :nth-child(45n+41) .u-color |
var(--u-color-41) | |
.u-colors > :nth-child(45n+41) .u-color-bg,
.u-colors > :nth-child(45n+41) .u-color-background, .u-colors .a-CardView-items > :nth-child(45n+41) .u-color-bg,
.u-colors .a-CardView-items > :nth-child(45n+41) .u-color-background |
var(--u-color-41) | |
.u-colors > :nth-child(45n+41) .u-color-bd,
.u-colors > :nth-child(45n+41) .u-color-border, .u-colors .a-CardView-items > :nth-child(45n+41) .u-color-bd,
.u-colors .a-CardView-items > :nth-child(45n+41) .u-color-border |
var(--u-color-41) | |
.u-colors > :nth-child(45n+42) .u-color, .u-colors .a-CardView-items > :nth-child(45n+42) .u-color |
var(--u-color-42) | |
.u-colors > :nth-child(45n+42) .u-color-bg,
.u-colors > :nth-child(45n+42) .u-color-background, .u-colors .a-CardView-items > :nth-child(45n+42) .u-color-bg,
.u-colors .a-CardView-items > :nth-child(45n+42) .u-color-background |
var(--u-color-42) | |
.u-colors > :nth-child(45n+42) .u-color-bd,
.u-colors > :nth-child(45n+42) .u-color-border, .u-colors .a-CardView-items > :nth-child(45n+42) .u-color-bd,
.u-colors .a-CardView-items > :nth-child(45n+42) .u-color-border |
var(--u-color-42) | |
.u-colors > :nth-child(45n+43) .u-color, .u-colors .a-CardView-items > :nth-child(45n+43) .u-color |
var(--u-color-43) | |
.u-colors > :nth-child(45n+43) .u-color-bg,
.u-colors > :nth-child(45n+43) .u-color-background, .u-colors .a-CardView-items > :nth-child(45n+43) .u-color-bg,
.u-colors .a-CardView-items > :nth-child(45n+43) .u-color-background |
var(--u-color-43) | |
.u-colors > :nth-child(45n+43) .u-color-bd,
.u-colors > :nth-child(45n+43) .u-color-border, .u-colors .a-CardView-items > :nth-child(45n+43) .u-color-bd,
.u-colors .a-CardView-items > :nth-child(45n+43) .u-color-border |
var(--u-color-43) | |
.u-colors > :nth-child(45n+44) .u-color, .u-colors .a-CardView-items > :nth-child(45n+44) .u-color |
var(--u-color-44) | |
.u-colors > :nth-child(45n+44) .u-color-bg,
.u-colors > :nth-child(45n+44) .u-color-background, .u-colors .a-CardView-items > :nth-child(45n+44) .u-color-bg,
.u-colors .a-CardView-items > :nth-child(45n+44) .u-color-background |
var(--u-color-44) | |
.u-colors > :nth-child(45n+44) .u-color-bd,
.u-colors > :nth-child(45n+44) .u-color-border, .u-colors .a-CardView-items > :nth-child(45n+44) .u-color-bd,
.u-colors .a-CardView-items > :nth-child(45n+44) .u-color-border |
var(--u-color-44) | |
.u-colors > :nth-child(45n+45) .u-color, .u-colors .a-CardView-items > :nth-child(45n+45) .u-color |
var(--u-color-45) | |
.u-colors > :nth-child(45n+45) .u-color-bg,
.u-colors > :nth-child(45n+45) .u-color-background, .u-colors .a-CardView-items > :nth-child(45n+45) .u-color-bg,
.u-colors .a-CardView-items > :nth-child(45n+45) .u-color-background |
var(--u-color-45) | |
.u-colors > :nth-child(45n+45) .u-color-bd,
.u-colors > :nth-child(45n+45) .u-color-border, .u-colors .a-CardView-items > :nth-child(45n+45) .u-color-bd,
.u-colors .a-CardView-items > :nth-child(45n+45) .u-color-border |
var(--u-color-45) | |
.u-color-transparent |
transparent | |
.u-color-transparent-bg |
transparent | |
.u-color-transparent-bd,
.u-color-transparent-border |
transparent | |
.oj-gantt-task-bar.oj-gantt-task-progress-container |
var(--oj-private-gantt-task-bg-color) |
--u-color-contrast
| Selector | Value | Color |
|---|---|---|
.t-BadgeList--circular .t-BadgeList-value |
var(--ut-badgelist-value-text-color) | |
.t-BadgeList--dash .t-BadgeList-label |
var(--ut-component-text-default-color) | |
.u-color-1 |
var(--u-color-1-contrast) | |
.u-color-2 |
var(--u-color-2-contrast) | |
.u-color-3 |
var(--u-color-3-contrast) | |
.u-color-4 |
var(--u-color-4-contrast) | |
.u-color-5 |
var(--u-color-5-contrast) | |
.u-color-6 |
var(--u-color-6-contrast) | |
.u-color-7 |
var(--u-color-7-contrast) | |
.u-color-8 |
var(--u-color-8-contrast) | |
.u-color-9 |
var(--u-color-9-contrast) | |
.u-color-10 |
var(--u-color-10-contrast) | |
.u-color-11 |
var(--u-color-11-contrast) | |
.u-color-12 |
var(--u-color-12-contrast) | |
.u-color-13 |
var(--u-color-13-contrast) | |
.u-color-14 |
var(--u-color-14-contrast) | |
.u-color-15 |
var(--u-color-15-contrast) | |
.u-color-16 |
var(--u-color-16-contrast) | |
.u-color-17 |
var(--u-color-17-contrast) | |
.u-color-18 |
var(--u-color-18-contrast) | |
.u-color-19 |
var(--u-color-19-contrast) | |
.u-color-20 |
var(--u-color-20-contrast) | |
.u-color-21 |
var(--u-color-21-contrast) | |
.u-color-22 |
var(--u-color-22-contrast) | |
.u-color-23 |
var(--u-color-23-contrast) | |
.u-color-24 |
var(--u-color-24-contrast) | |
.u-color-25 |
var(--u-color-25-contrast) | |
.u-color-26 |
var(--u-color-26-contrast) | |
.u-color-27 |
var(--u-color-27-contrast) | |
.u-color-28 |
var(--u-color-28-contrast) | |
.u-color-29 |
var(--u-color-29-contrast) | |
.u-color-30 |
var(--u-color-30-contrast) | |
.u-color-31 |
var(--u-color-31-contrast) | |
.u-color-32 |
var(--u-color-32-contrast) | |
.u-color-33 |
var(--u-color-33-contrast) | |
.u-color-34 |
var(--u-color-34-contrast) | |
.u-color-35 |
var(--u-color-35-contrast) | |
.u-color-36 |
var(--u-color-36-contrast) | |
.u-color-37 |
var(--u-color-37-contrast) | |
.u-color-38 |
var(--u-color-38-contrast) | |
.u-color-39 |
var(--u-color-39-contrast) | |
.u-color-40 |
var(--u-color-40-contrast) | |
.u-color-41 |
var(--u-color-41-contrast) | |
.u-color-42 |
var(--u-color-42-contrast) | |
.u-color-43 |
var(--u-color-43-contrast) | |
.u-color-44 |
var(--u-color-44-contrast) | |
.u-color-45 |
var(--u-color-45-contrast) | |
.u-colors > :nth-child(45n+1) .u-color, .u-colors .a-CardView-items > :nth-child(45n+1) .u-color |
var(--u-color-1-contrast) | |
.u-colors > :nth-child(45n+1) .u-color-txt,
.u-colors > :nth-child(45n+1) .u-color-text, .u-colors .a-CardView-items > :nth-child(45n+1) .u-color-txt,
.u-colors .a-CardView-items > :nth-child(45n+1) .u-color-text |
var(--u-color-1) | |
.u-colors > :nth-child(45n+2) .u-color, .u-colors .a-CardView-items > :nth-child(45n+2) .u-color |
var(--u-color-2-contrast) | |
.u-colors > :nth-child(45n+2) .u-color-txt,
.u-colors > :nth-child(45n+2) .u-color-text, .u-colors .a-CardView-items > :nth-child(45n+2) .u-color-txt,
.u-colors .a-CardView-items > :nth-child(45n+2) .u-color-text |
var(--u-color-2) | |
.u-colors > :nth-child(45n+3) .u-color, .u-colors .a-CardView-items > :nth-child(45n+3) .u-color |
var(--u-color-3-contrast) | |
.u-colors > :nth-child(45n+3) .u-color-txt,
.u-colors > :nth-child(45n+3) .u-color-text, .u-colors .a-CardView-items > :nth-child(45n+3) .u-color-txt,
.u-colors .a-CardView-items > :nth-child(45n+3) .u-color-text |
var(--u-color-3) | |
.u-colors > :nth-child(45n+4) .u-color, .u-colors .a-CardView-items > :nth-child(45n+4) .u-color |
var(--u-color-4-contrast) | |
.u-colors > :nth-child(45n+4) .u-color-txt,
.u-colors > :nth-child(45n+4) .u-color-text, .u-colors .a-CardView-items > :nth-child(45n+4) .u-color-txt,
.u-colors .a-CardView-items > :nth-child(45n+4) .u-color-text |
var(--u-color-4) | |
.u-colors > :nth-child(45n+5) .u-color, .u-colors .a-CardView-items > :nth-child(45n+5) .u-color |
var(--u-color-5-contrast) | |
.u-colors > :nth-child(45n+5) .u-color-txt,
.u-colors > :nth-child(45n+5) .u-color-text, .u-colors .a-CardView-items > :nth-child(45n+5) .u-color-txt,
.u-colors .a-CardView-items > :nth-child(45n+5) .u-color-text |
var(--u-color-5) | |
.u-colors > :nth-child(45n+6) .u-color, .u-colors .a-CardView-items > :nth-child(45n+6) .u-color |
var(--u-color-6-contrast) | |
.u-colors > :nth-child(45n+6) .u-color-txt,
.u-colors > :nth-child(45n+6) .u-color-text, .u-colors .a-CardView-items > :nth-child(45n+6) .u-color-txt,
.u-colors .a-CardView-items > :nth-child(45n+6) .u-color-text |
var(--u-color-6) | |
.u-colors > :nth-child(45n+7) .u-color, .u-colors .a-CardView-items > :nth-child(45n+7) .u-color |
var(--u-color-7-contrast) | |
.u-colors > :nth-child(45n+7) .u-color-txt,
.u-colors > :nth-child(45n+7) .u-color-text, .u-colors .a-CardView-items > :nth-child(45n+7) .u-color-txt,
.u-colors .a-CardView-items > :nth-child(45n+7) .u-color-text |
var(--u-color-7) | |
.u-colors > :nth-child(45n+8) .u-color, .u-colors .a-CardView-items > :nth-child(45n+8) .u-color |
var(--u-color-8-contrast) | |
.u-colors > :nth-child(45n+8) .u-color-txt,
.u-colors > :nth-child(45n+8) .u-color-text, .u-colors .a-CardView-items > :nth-child(45n+8) .u-color-txt,
.u-colors .a-CardView-items > :nth-child(45n+8) .u-color-text |
var(--u-color-8) | |
.u-colors > :nth-child(45n+9) .u-color, .u-colors .a-CardView-items > :nth-child(45n+9) .u-color |
var(--u-color-9-contrast) | |
.u-colors > :nth-child(45n+9) .u-color-txt,
.u-colors > :nth-child(45n+9) .u-color-text, .u-colors .a-CardView-items > :nth-child(45n+9) .u-color-txt,
.u-colors .a-CardView-items > :nth-child(45n+9) .u-color-text |
var(--u-color-9) | |
.u-colors > :nth-child(45n+10) .u-color, .u-colors .a-CardView-items > :nth-child(45n+10) .u-color |
var(--u-color-10-contrast) | |
.u-colors > :nth-child(45n+10) .u-color-txt,
.u-colors > :nth-child(45n+10) .u-color-text, .u-colors .a-CardView-items > :nth-child(45n+10) .u-color-txt,
.u-colors .a-CardView-items > :nth-child(45n+10) .u-color-text |
var(--u-color-10) | |
.u-colors > :nth-child(45n+11) .u-color, .u-colors .a-CardView-items > :nth-child(45n+11) .u-color |
var(--u-color-11-contrast) | |
.u-colors > :nth-child(45n+11) .u-color-txt,
.u-colors > :nth-child(45n+11) .u-color-text, .u-colors .a-CardView-items > :nth-child(45n+11) .u-color-txt,
.u-colors .a-CardView-items > :nth-child(45n+11) .u-color-text |
var(--u-color-11) | |
.u-colors > :nth-child(45n+12) .u-color, .u-colors .a-CardView-items > :nth-child(45n+12) .u-color |
var(--u-color-12-contrast) | |
.u-colors > :nth-child(45n+12) .u-color-txt,
.u-colors > :nth-child(45n+12) .u-color-text, .u-colors .a-CardView-items > :nth-child(45n+12) .u-color-txt,
.u-colors .a-CardView-items > :nth-child(45n+12) .u-color-text |
var(--u-color-12) | |
.u-colors > :nth-child(45n+13) .u-color, .u-colors .a-CardView-items > :nth-child(45n+13) .u-color |
var(--u-color-13-contrast) | |
.u-colors > :nth-child(45n+13) .u-color-txt,
.u-colors > :nth-child(45n+13) .u-color-text, .u-colors .a-CardView-items > :nth-child(45n+13) .u-color-txt,
.u-colors .a-CardView-items > :nth-child(45n+13) .u-color-text |
var(--u-color-13) | |
.u-colors > :nth-child(45n+14) .u-color, .u-colors .a-CardView-items > :nth-child(45n+14) .u-color |
var(--u-color-14-contrast) | |
.u-colors > :nth-child(45n+14) .u-color-txt,
.u-colors > :nth-child(45n+14) .u-color-text, .u-colors .a-CardView-items > :nth-child(45n+14) .u-color-txt,
.u-colors .a-CardView-items > :nth-child(45n+14) .u-color-text |
var(--u-color-14) | |
.u-colors > :nth-child(45n+15) .u-color, .u-colors .a-CardView-items > :nth-child(45n+15) .u-color |
var(--u-color-15-contrast) | |
.u-colors > :nth-child(45n+15) .u-color-txt,
.u-colors > :nth-child(45n+15) .u-color-text, .u-colors .a-CardView-items > :nth-child(45n+15) .u-color-txt,
.u-colors .a-CardView-items > :nth-child(45n+15) .u-color-text |
var(--u-color-15) | |
.u-colors > :nth-child(45n+16) .u-color, .u-colors .a-CardView-items > :nth-child(45n+16) .u-color |
var(--u-color-16-contrast) | |
.u-colors > :nth-child(45n+16) .u-color-txt,
.u-colors > :nth-child(45n+16) .u-color-text, .u-colors .a-CardView-items > :nth-child(45n+16) .u-color-txt,
.u-colors .a-CardView-items > :nth-child(45n+16) .u-color-text |
var(--u-color-16) | |
.u-colors > :nth-child(45n+17) .u-color, .u-colors .a-CardView-items > :nth-child(45n+17) .u-color |
var(--u-color-17-contrast) | |
.u-colors > :nth-child(45n+17) .u-color-txt,
.u-colors > :nth-child(45n+17) .u-color-text, .u-colors .a-CardView-items > :nth-child(45n+17) .u-color-txt,
.u-colors .a-CardView-items > :nth-child(45n+17) .u-color-text |
var(--u-color-17) | |
.u-colors > :nth-child(45n+18) .u-color, .u-colors .a-CardView-items > :nth-child(45n+18) .u-color |
var(--u-color-18-contrast) | |
.u-colors > :nth-child(45n+18) .u-color-txt,
.u-colors > :nth-child(45n+18) .u-color-text, .u-colors .a-CardView-items > :nth-child(45n+18) .u-color-txt,
.u-colors .a-CardView-items > :nth-child(45n+18) .u-color-text |
var(--u-color-18) | |
.u-colors > :nth-child(45n+19) .u-color, .u-colors .a-CardView-items > :nth-child(45n+19) .u-color |
var(--u-color-19-contrast) | |
.u-colors > :nth-child(45n+19) .u-color-txt,
.u-colors > :nth-child(45n+19) .u-color-text, .u-colors .a-CardView-items > :nth-child(45n+19) .u-color-txt,
.u-colors .a-CardView-items > :nth-child(45n+19) .u-color-text |
var(--u-color-19) | |
.u-colors > :nth-child(45n+20) .u-color, .u-colors .a-CardView-items > :nth-child(45n+20) .u-color |
var(--u-color-20-contrast) | |
.u-colors > :nth-child(45n+20) .u-color-txt,
.u-colors > :nth-child(45n+20) .u-color-text, .u-colors .a-CardView-items > :nth-child(45n+20) .u-color-txt,
.u-colors .a-CardView-items > :nth-child(45n+20) .u-color-text |
var(--u-color-20) | |
.u-colors > :nth-child(45n+21) .u-color, .u-colors .a-CardView-items > :nth-child(45n+21) .u-color |
var(--u-color-21-contrast) | |
.u-colors > :nth-child(45n+21) .u-color-txt,
.u-colors > :nth-child(45n+21) .u-color-text, .u-colors .a-CardView-items > :nth-child(45n+21) .u-color-txt,
.u-colors .a-CardView-items > :nth-child(45n+21) .u-color-text |
var(--u-color-21) | |
.u-colors > :nth-child(45n+22) .u-color, .u-colors .a-CardView-items > :nth-child(45n+22) .u-color |
var(--u-color-22-contrast) | |
.u-colors > :nth-child(45n+22) .u-color-txt,
.u-colors > :nth-child(45n+22) .u-color-text, .u-colors .a-CardView-items > :nth-child(45n+22) .u-color-txt,
.u-colors .a-CardView-items > :nth-child(45n+22) .u-color-text |
var(--u-color-22) | |
.u-colors > :nth-child(45n+23) .u-color, .u-colors .a-CardView-items > :nth-child(45n+23) .u-color |
var(--u-color-23-contrast) | |
.u-colors > :nth-child(45n+23) .u-color-txt,
.u-colors > :nth-child(45n+23) .u-color-text, .u-colors .a-CardView-items > :nth-child(45n+23) .u-color-txt,
.u-colors .a-CardView-items > :nth-child(45n+23) .u-color-text |
var(--u-color-23) | |
.u-colors > :nth-child(45n+24) .u-color, .u-colors .a-CardView-items > :nth-child(45n+24) .u-color |
var(--u-color-24-contrast) | |
.u-colors > :nth-child(45n+24) .u-color-txt,
.u-colors > :nth-child(45n+24) .u-color-text, .u-colors .a-CardView-items > :nth-child(45n+24) .u-color-txt,
.u-colors .a-CardView-items > :nth-child(45n+24) .u-color-text |
var(--u-color-24) | |
.u-colors > :nth-child(45n+25) .u-color, .u-colors .a-CardView-items > :nth-child(45n+25) .u-color |
var(--u-color-25-contrast) | |
.u-colors > :nth-child(45n+25) .u-color-txt,
.u-colors > :nth-child(45n+25) .u-color-text, .u-colors .a-CardView-items > :nth-child(45n+25) .u-color-txt,
.u-colors .a-CardView-items > :nth-child(45n+25) .u-color-text |
var(--u-color-25) | |
.u-colors > :nth-child(45n+26) .u-color, .u-colors .a-CardView-items > :nth-child(45n+26) .u-color |
var(--u-color-26-contrast) | |
.u-colors > :nth-child(45n+26) .u-color-txt,
.u-colors > :nth-child(45n+26) .u-color-text, .u-colors .a-CardView-items > :nth-child(45n+26) .u-color-txt,
.u-colors .a-CardView-items > :nth-child(45n+26) .u-color-text |
var(--u-color-26) | |
.u-colors > :nth-child(45n+27) .u-color, .u-colors .a-CardView-items > :nth-child(45n+27) .u-color |
var(--u-color-27-contrast) | |
.u-colors > :nth-child(45n+27) .u-color-txt,
.u-colors > :nth-child(45n+27) .u-color-text, .u-colors .a-CardView-items > :nth-child(45n+27) .u-color-txt,
.u-colors .a-CardView-items > :nth-child(45n+27) .u-color-text |
var(--u-color-27) | |
.u-colors > :nth-child(45n+28) .u-color, .u-colors .a-CardView-items > :nth-child(45n+28) .u-color |
var(--u-color-28-contrast) | |
.u-colors > :nth-child(45n+28) .u-color-txt,
.u-colors > :nth-child(45n+28) .u-color-text, .u-colors .a-CardView-items > :nth-child(45n+28) .u-color-txt,
.u-colors .a-CardView-items > :nth-child(45n+28) .u-color-text |
var(--u-color-28) | |
.u-colors > :nth-child(45n+29) .u-color, .u-colors .a-CardView-items > :nth-child(45n+29) .u-color |
var(--u-color-29-contrast) | |
.u-colors > :nth-child(45n+29) .u-color-txt,
.u-colors > :nth-child(45n+29) .u-color-text, .u-colors .a-CardView-items > :nth-child(45n+29) .u-color-txt,
.u-colors .a-CardView-items > :nth-child(45n+29) .u-color-text |
var(--u-color-29) | |
.u-colors > :nth-child(45n+30) .u-color, .u-colors .a-CardView-items > :nth-child(45n+30) .u-color |
var(--u-color-30-contrast) | |
.u-colors > :nth-child(45n+30) .u-color-txt,
.u-colors > :nth-child(45n+30) .u-color-text, .u-colors .a-CardView-items > :nth-child(45n+30) .u-color-txt,
.u-colors .a-CardView-items > :nth-child(45n+30) .u-color-text |
var(--u-color-30) | |
.u-colors > :nth-child(45n+31) .u-color, .u-colors .a-CardView-items > :nth-child(45n+31) .u-color |
var(--u-color-31-contrast) | |
.u-colors > :nth-child(45n+31) .u-color-txt,
.u-colors > :nth-child(45n+31) .u-color-text, .u-colors .a-CardView-items > :nth-child(45n+31) .u-color-txt,
.u-colors .a-CardView-items > :nth-child(45n+31) .u-color-text |
var(--u-color-31) | |
.u-colors > :nth-child(45n+32) .u-color, .u-colors .a-CardView-items > :nth-child(45n+32) .u-color |
var(--u-color-32-contrast) | |
.u-colors > :nth-child(45n+32) .u-color-txt,
.u-colors > :nth-child(45n+32) .u-color-text, .u-colors .a-CardView-items > :nth-child(45n+32) .u-color-txt,
.u-colors .a-CardView-items > :nth-child(45n+32) .u-color-text |
var(--u-color-32) | |
.u-colors > :nth-child(45n+33) .u-color, .u-colors .a-CardView-items > :nth-child(45n+33) .u-color |
var(--u-color-33-contrast) | |
.u-colors > :nth-child(45n+33) .u-color-txt,
.u-colors > :nth-child(45n+33) .u-color-text, .u-colors .a-CardView-items > :nth-child(45n+33) .u-color-txt,
.u-colors .a-CardView-items > :nth-child(45n+33) .u-color-text |
var(--u-color-33) | |
.u-colors > :nth-child(45n+34) .u-color, .u-colors .a-CardView-items > :nth-child(45n+34) .u-color |
var(--u-color-34-contrast) | |
.u-colors > :nth-child(45n+34) .u-color-txt,
.u-colors > :nth-child(45n+34) .u-color-text, .u-colors .a-CardView-items > :nth-child(45n+34) .u-color-txt,
.u-colors .a-CardView-items > :nth-child(45n+34) .u-color-text |
var(--u-color-34) | |
.u-colors > :nth-child(45n+35) .u-color, .u-colors .a-CardView-items > :nth-child(45n+35) .u-color |
var(--u-color-35-contrast) | |
.u-colors > :nth-child(45n+35) .u-color-txt,
.u-colors > :nth-child(45n+35) .u-color-text, .u-colors .a-CardView-items > :nth-child(45n+35) .u-color-txt,
.u-colors .a-CardView-items > :nth-child(45n+35) .u-color-text |
var(--u-color-35) | |
.u-colors > :nth-child(45n+36) .u-color, .u-colors .a-CardView-items > :nth-child(45n+36) .u-color |
var(--u-color-36-contrast) | |
.u-colors > :nth-child(45n+36) .u-color-txt,
.u-colors > :nth-child(45n+36) .u-color-text, .u-colors .a-CardView-items > :nth-child(45n+36) .u-color-txt,
.u-colors .a-CardView-items > :nth-child(45n+36) .u-color-text |
var(--u-color-36) | |
.u-colors > :nth-child(45n+37) .u-color, .u-colors .a-CardView-items > :nth-child(45n+37) .u-color |
var(--u-color-37-contrast) | |
.u-colors > :nth-child(45n+37) .u-color-txt,
.u-colors > :nth-child(45n+37) .u-color-text, .u-colors .a-CardView-items > :nth-child(45n+37) .u-color-txt,
.u-colors .a-CardView-items > :nth-child(45n+37) .u-color-text |
var(--u-color-37) | |
.u-colors > :nth-child(45n+38) .u-color, .u-colors .a-CardView-items > :nth-child(45n+38) .u-color |
var(--u-color-38-contrast) | |
.u-colors > :nth-child(45n+38) .u-color-txt,
.u-colors > :nth-child(45n+38) .u-color-text, .u-colors .a-CardView-items > :nth-child(45n+38) .u-color-txt,
.u-colors .a-CardView-items > :nth-child(45n+38) .u-color-text |
var(--u-color-38) | |
.u-colors > :nth-child(45n+39) .u-color, .u-colors .a-CardView-items > :nth-child(45n+39) .u-color |
var(--u-color-39-contrast) | |
.u-colors > :nth-child(45n+39) .u-color-txt,
.u-colors > :nth-child(45n+39) .u-color-text, .u-colors .a-CardView-items > :nth-child(45n+39) .u-color-txt,
.u-colors .a-CardView-items > :nth-child(45n+39) .u-color-text |
var(--u-color-39) | |
.u-colors > :nth-child(45n+40) .u-color, .u-colors .a-CardView-items > :nth-child(45n+40) .u-color |
var(--u-color-40-contrast) | |
.u-colors > :nth-child(45n+40) .u-color-txt,
.u-colors > :nth-child(45n+40) .u-color-text, .u-colors .a-CardView-items > :nth-child(45n+40) .u-color-txt,
.u-colors .a-CardView-items > :nth-child(45n+40) .u-color-text |
var(--u-color-40) | |
.u-colors > :nth-child(45n+41) .u-color, .u-colors .a-CardView-items > :nth-child(45n+41) .u-color |
var(--u-color-41-contrast) | |
.u-colors > :nth-child(45n+41) .u-color-txt,
.u-colors > :nth-child(45n+41) .u-color-text, .u-colors .a-CardView-items > :nth-child(45n+41) .u-color-txt,
.u-colors .a-CardView-items > :nth-child(45n+41) .u-color-text |
var(--u-color-41) | |
.u-colors > :nth-child(45n+42) .u-color, .u-colors .a-CardView-items > :nth-child(45n+42) .u-color |
var(--u-color-42-contrast) | |
.u-colors > :nth-child(45n+42) .u-color-txt,
.u-colors > :nth-child(45n+42) .u-color-text, .u-colors .a-CardView-items > :nth-child(45n+42) .u-color-txt,
.u-colors .a-CardView-items > :nth-child(45n+42) .u-color-text |
var(--u-color-42) | |
.u-colors > :nth-child(45n+43) .u-color, .u-colors .a-CardView-items > :nth-child(45n+43) .u-color |
var(--u-color-43-contrast) | |
.u-colors > :nth-child(45n+43) .u-color-txt,
.u-colors > :nth-child(45n+43) .u-color-text, .u-colors .a-CardView-items > :nth-child(45n+43) .u-color-txt,
.u-colors .a-CardView-items > :nth-child(45n+43) .u-color-text |
var(--u-color-43) | |
.u-colors > :nth-child(45n+44) .u-color, .u-colors .a-CardView-items > :nth-child(45n+44) .u-color |
var(--u-color-44-contrast) | |
.u-colors > :nth-child(45n+44) .u-color-txt,
.u-colors > :nth-child(45n+44) .u-color-text, .u-colors .a-CardView-items > :nth-child(45n+44) .u-color-txt,
.u-colors .a-CardView-items > :nth-child(45n+44) .u-color-text |
var(--u-color-44) | |
.u-colors > :nth-child(45n+45) .u-color, .u-colors .a-CardView-items > :nth-child(45n+45) .u-color |
var(--u-color-45-contrast) | |
.u-colors > :nth-child(45n+45) .u-color-txt,
.u-colors > :nth-child(45n+45) .u-color-text, .u-colors .a-CardView-items > :nth-child(45n+45) .u-color-txt,
.u-colors .a-CardView-items > :nth-child(45n+45) .u-color-text |
var(--u-color-45) | |
.u-color-transparent |
transparent | |
.u-color-transparent-txt,
.u-color-transparent-text |
transparent |
--ut-badgelist-value-border-radius
| Selector | Value | Color |
|---|---|---|
.t-BadgeList--circular .t-BadgeList-value |
8rem | |
.t-BadgeList--circular .t-BadgeList-value a:before |
8rem |
--ut-badgelist-value-border-width
| Selector | Value | Color |
|---|---|---|
.t-BadgeList--circular .t-BadgeList-value |
1px |
--ut-badgelist-value-border-color
| Selector | Value | Color |
|---|---|---|
.t-BadgeList--circular .t-BadgeList-value |
var(--ut-component-border-color) | |
.t-BadgeList--circular a.t-BadgeList-wrap:hover |
transparent |
--ut-badgelist-value-background-color
| Selector | Value | Color |
|---|---|---|
.t-BadgeList--circular a.t-BadgeList-wrap:hover |
var(--ut-component-icon-background-color) | |
.t-BadgeList--circular a.t-BadgeList-wrap:hover .t-BadgeList-value |
var(--ut-component-background-color) |
--ut-badgelist-value-text-color
| Selector | Value | Color |
|---|---|---|
.t-BadgeList--circular a.t-BadgeList-wrap:hover |
var(--ut-component-icon-color) |
--ut-badgelist-value-size
| Selector | Value | Color |
|---|---|---|
.t-BadgeList--dash |
auto | |
.t-BadgeList--circular.t-BadgeList--small |
var(--ut-badgelist-value-size-small, 2rem) | |
.t-BadgeList--circular.t-BadgeList--medium |
var(--ut-badgelist-value-size-medium, 3rem) | |
.t-BadgeList--circular.t-BadgeList--large |
var(--ut-badgelist-value-size-large, 4rem) | |
.t-BadgeList--circular.t-BadgeList--xlarge |
var(--ut-badgelist-value-size-xlarge, 6rem) | |
.t-BadgeList--circular.t-BadgeList--xxlarge |
var(--ut-badgelist-value-size-xxlarge, 8rem) |
--ut-badgelist-value-font-size
| Selector | Value | Color |
|---|---|---|
.t-BadgeList--dash |
2rem | |
.t-BadgeList--circular.t-BadgeList--small |
var(--ut-badgelist-value-font-size-small, 0.75rem) | |
.t-BadgeList--dash.t-BadgeList--small |
1rem | |
.t-BadgeList--circular.t-BadgeList--medium |
var(--ut-badgelist-value-font-size-medium, 1rem) | |
.t-BadgeList--dash.t-BadgeList--medium |
1.5rem | |
.t-BadgeList--circular.t-BadgeList--large |
var(--ut-badgelist-value-font-size-large, 1.25rem) | |
.t-BadgeList--dash.t-BadgeList--large |
2rem | |
.t-BadgeList--circular.t-BadgeList--xlarge |
var(--ut-badgelist-value-font-size-xlarge, 1.5rem) | |
.t-BadgeList--dash.t-BadgeList--xlarge |
3rem | |
.t-BadgeList--circular.t-BadgeList--xxlarge |
var(--ut-badgelist-value-font-size-xxlarge, 2rem) | |
.t-BadgeList--dash.t-BadgeList--xxlarge |
4rem |
--ut-badgelist-value-line-height
| Selector | Value | Color |
|---|---|---|
.t-BadgeList--dash |
1.5 | |
.t-BadgeList--dash.t-BadgeList--small |
1.5 | |
.t-BadgeList--dash.t-BadgeList--medium |
1.5 | |
.t-BadgeList--dash.t-BadgeList--large |
1.5 | |
.t-BadgeList--dash.t-BadgeList--xlarge |
1.5 | |
.t-BadgeList--dash.t-BadgeList--xxlarge |
1.5 |
--ut-badgelist-label-font-size
| Selector | Value | Color |
|---|---|---|
.t-BadgeList--dash |
.875rem | |
.t-BadgeList--circular.t-BadgeList--small |
var(--ut-badgelist-label-font-size-small, 0.625rem) | |
.t-BadgeList--dash.t-BadgeList--small |
var(--ut-badgelist-label-font-size-small, 0.625rem) | |
.t-BadgeList--circular.t-BadgeList--medium |
var(--ut-badgelist-label-font-size-medium, 0.75rem) | |
.t-BadgeList--dash.t-BadgeList--medium |
var(--ut-badgelist-label-font-size-medium, 0.75rem) | |
.t-BadgeList--circular.t-BadgeList--large |
var(--ut-badgelist-label-font-size-large, 0.875rem) | |
.t-BadgeList--dash.t-BadgeList--large |
var(--ut-badgelist-label-font-size-large, 0.875rem) | |
.t-BadgeList--circular.t-BadgeList--xlarge |
var(--ut-badgelist-label-font-size-xlarge, 1rem) | |
.t-BadgeList--dash.t-BadgeList--xlarge |
var(--ut-badgelist-label-font-size-xlarge, 1rem) | |
.t-BadgeList--circular.t-BadgeList--xxlarge |
var(--ut-badgelist-label-font-size-xxlarge, 1.25rem) | |
.t-BadgeList--dash.t-BadgeList--xxlarge |
var(--ut-badgelist-label-font-size-xxlarge, 1.25rem) |
--ut-badgelist-wrap-padding
| Selector | Value | Color |
|---|---|---|
.t-BadgeList--dash .t-BadgeList-wrap |
0.75rem | |
.t-BadgeList--dash .t-BadgeList-wrap:before |
0.75rem |
--ut-badgelist-wrap-border-radius
| Selector | Value | Color |
|---|---|---|
.t-BadgeList--dash .t-BadgeList-wrap |
0.25rem | |
.t-BadgeList--dash .t-BadgeList-wrap:before |
0.25rem |
--ut-badgelist-wrap-hover-background-color
| Selector | Value | Color |
|---|---|---|
.t-BadgeList--dash .t-BadgeList-wrap:before |
var(--ut-component-border-color) |
--ut-badgelist-item-border-color
| Selector | Value | Color |
|---|---|---|
.t-BadgeList-item:before, .t-BadgeList-item:after |
var(--ut-component-border-color) |
--ut-badgelist-item-border-width
| Selector | Value | Color |
|---|---|---|
.t-BadgeList-item:before |
1px | |
.t-BadgeList-item:after |
1px |
--ut-linkslist-item-border-width
| Selector | Value | Color |
|---|---|---|
.t-LinksList-item |
var(--ut-component-inner-border-width) | |
.t-LinksList-item:last-child |
0 | |
.t-LinksList-list |
0 | |
.t-LinksList--actions .t-LinksList-item:not(.t-LinksList-item--separator) |
0 |
--ut-linkslist-item-border-color
| Selector | Value | Color |
|---|---|---|
.t-LinksList-item |
var(--ut-component-inner-border-color) |
--ut-linkslist-label-font-weight
| Selector | Value | Color |
|---|---|---|
.t-LinksList-item.is-current > a |
var(--a-base-font-weight-bold, 700) |
--ut-linkslist-text-color
| Selector | Value | Color |
|---|---|---|
.t-LinksList-link |
var(--ut-link-text-color) |
--ut-linkslist-link-padding-x
| Selector | Value | Color |
|---|---|---|
.t-LinksList-link |
0.75rem | |
.t-LinksList-link |
0.75rem | |
.t-LinksList-link |
0.75rem | |
.t-LinksList-link |
0.75rem |
--ut-linkslist-link-padding-y
| Selector | Value | Color |
|---|---|---|
.t-LinksList-link |
0.5rem | |
.t-LinksList-link |
0.5rem | |
.t-LinksList-link |
0.5rem | |
.t-LinksList-link |
0.5rem | |
.t-LinksList--actions |
.625rem |
--ut-linkslist-background-color
| Selector | Value | Color |
|---|---|---|
.t-LinksList-link:hover |
var(--ut-linkslist-hover-background-color) |
--ut-linkslist-arrow-size
| Selector | Value | Color |
|---|---|---|
.t-LinksList-link:before |
1rem | |
.t-LinksList-link:before |
1rem | |
.t-LinksList-link:before |
1rem |
--ut-linkslist-arrow-color
| Selector | Value | Color |
|---|---|---|
.t-LinksList-link:before |
var(--ut-component-text-muted-color) |
--ut-linkslist-spacing
| Selector | Value | Color |
|---|---|---|
.t-LinksList-link:before |
0.75rem / 2 | |
.t-LinksList-link:before |
0.75rem / 2 | |
.t-LinksList-icon |
0.75rem / 2 | |
.t-LinksList-icon |
0.75rem / 2 | |
.t-LinksList--actions |
.75rem |
--ut-linkslist-icon-color
| Selector | Value | Color |
|---|---|---|
.t-LinksList-icon |
var(--ut-component-text-muted-color) |
--ut-linkslist-icon-size
| Selector | Value | Color |
|---|---|---|
.t-LinksList-icon |
1rem | |
.t-LinksList-icon .t-Icon |
1rem | |
.t-LinksList-icon .t-Icon |
1rem |
--ut-linkslist-badge-padding-x
| Selector | Value | Color |
|---|---|---|
.t-LinksList-badge |
0.5rem | |
.t-LinksList-badge |
0.5rem | |
.t-LinksList-badge |
0.5rem | |
.t-LinksList-badge |
0.5rem |
--ut-linkslist-badge-padding-y
| Selector | Value | Color |
|---|---|---|
.t-LinksList-badge |
0 | |
.t-LinksList-badge |
0 | |
.t-LinksList-badge |
0 | |
.t-LinksList-badge |
0 |
--ut-linkslist-badge-font-size
| Selector | Value | Color |
|---|---|---|
.t-LinksList-badge |
0.75rem |
--ut-linkslist-badge-line-height
| Selector | Value | Color |
|---|---|---|
.t-LinksList-badge |
1.25rem | |
.t-LinksList-badge |
1.25rem |
--ut-linkslist-badge-border-radius
| Selector | Value | Color |
|---|---|---|
.t-LinksList-badge |
0.25rem |
--ut-linkslist-badge-background-color
| Selector | Value | Color |
|---|---|---|
.t-LinksList-badge |
#f5f5f5 |
--ut-linkslist-badge-color
| Selector | Value | Color |
|---|---|---|
.t-LinksList-badge |
#262626 |
--ut-linkslist-separator-border-border-width
| Selector | Value | Color |
|---|---|---|
.t-LinksList--actions .t-LinksList-item--separator |
var(--ut-component-inner-border-width) |
--ut-linkslist-separator-border-border-color
| Selector | Value | Color |
|---|---|---|
.t-LinksList--actions .t-LinksList-item--separator |
var(--ut-component-inner-border-color) |
--ut-medialist-item-border-width
| Selector | Value | Color |
|---|---|---|
.t-MediaList-item |
var(--ut-component-inner-border-width) | |
.t-MediaList--horizontal .t-MediaList-item |
var(--ut-component-inner-border-width) | |
.t-MediaList--horizontal .t-MediaList-item .u-RTL |
var(--ut-component-inner-border-width) | |
.t-MediaList--cols |
var(--ut-component-inner-border-width) |
--ut-medialist-item-border-color
| Selector | Value | Color |
|---|---|---|
.t-MediaList-item |
var(--ut-component-inner-border-color) | |
.t-MediaList--horizontal .t-MediaList-item |
var(--ut-component-inner-border-color) | |
.t-MediaList--horizontal .t-MediaList-item .u-RTL |
var(--ut-component-inner-border-color) |
--ut-medialist-item-grid-gap
| Selector | Value | Color |
|---|---|---|
.t-MediaList-itemWrap |
0.5rem | |
.t-MediaList-itemWrap |
0.5rem | |
.t-MediaList-itemWrap |
1rem |
--ut-medialist-title-text-color
| Selector | Value | Color |
|---|---|---|
a.t-MediaList-itemWrap |
var(--ut-link-text-color) | |
.t-MediaList-title |
var(--ut-component-text-title-color) |
--ut-medialist-item-background-color
| Selector | Value | Color |
|---|---|---|
a.t-MediaList-itemWrap:hover |
var(--ut-medialist-item-hover-background-color, var(--ut-component-highlight-background-color)) |
--ut-medialist-icon-border-radius
| Selector | Value | Color |
|---|---|---|
.t-MediaList-icon |
100% | |
.t-MediaList--iconsSquare |
0 | |
.t-MediaList--iconsRounded |
12.5% |
--ut-medialist-icon-color
| Selector | Value | Color |
|---|---|---|
.t-MediaList-icon |
var(--ut-component-icon-color) |
--ut-medialist-icon-container-size
| Selector | Value | Color |
|---|---|---|
.t-MediaList-icon |
2rem | |
.t-MediaList-icon |
2rem | |
.t-MediaList--large |
4rem |
--ut-medialist-icon-size
| Selector | Value | Color |
|---|---|---|
.t-MediaList-icon .t-Icon |
1rem | |
.t-MediaList--large |
2rem |
--ut-medialist-body-padding-y
| Selector | Value | Color |
|---|---|---|
.t-MediaList-body |
1rem |
--ut-medialist-body-padding-x
| Selector | Value | Color |
|---|---|---|
.t-MediaList-body |
1rem |
--ut-medialist-title-font-size
| Selector | Value | Color |
|---|---|---|
.t-MediaList-title |
0.875rem | |
.t-MediaList--large |
1rem |
--ut-medialist-title-font-weight
| Selector | Value | Color |
|---|---|---|
.t-MediaList-title |
500 |
--ut-medialist-title-line-height
| Selector | Value | Color |
|---|---|---|
.t-MediaList-title |
1.25rem | |
.t-MediaList--large |
1.5rem |
--ut-medialist-desc-font-size
| Selector | Value | Color |
|---|---|---|
.t-MediaList-desc |
0.75rem | |
.t-MediaList--large |
.875rem |
--ut-medialist-desc-line-height
| Selector | Value | Color |
|---|---|---|
.t-MediaList-desc |
1rem | |
.t-MediaList--large |
1.25rem |
--ut-medialist-desc-text-color
| Selector | Value | Color |
|---|---|---|
.t-MediaList-desc |
var(--ut-component-text-muted-color) |
--ut-medialist-badge-padding-x
| Selector | Value | Color |
|---|---|---|
.t-MediaList-badge |
0.5rem | |
.t-MediaList-badge |
0.5rem | |
.t-MediaList-badge |
0.5rem | |
.t-MediaList-badge |
0.5rem |
--ut-medialist-badge-padding-y
| Selector | Value | Color |
|---|---|---|
.t-MediaList-badge |
0.125rem | |
.t-MediaList-badge |
0.125rem | |
.t-MediaList-badge |
0.125rem | |
.t-MediaList-badge |
0.125rem |
--ut-medialist-badge-background-color
| Selector | Value | Color |
|---|---|---|
.t-MediaList-badge |
var(--ut-component-badge-background-color) |
--ut-medialist-badge-color
| Selector | Value | Color |
|---|---|---|
.t-MediaList-badge |
var(--ut-component-badge-text-color) |
--ut-medialist-badge-font-size
| Selector | Value | Color |
|---|---|---|
.t-MediaList-badge |
0.75rem |
--ut-medialist-badge-line-height
| Selector | Value | Color |
|---|---|---|
.t-MediaList-badge |
1.25rem |
--ut-medialist-badge-border-radius
| Selector | Value | Color |
|---|---|---|
.t-MediaList-badge |
var(--ut-component-badge-border-radius) |
--ut-cardlist-color
| Selector | Value | Color |
|---|---|---|
.t-Card-wrap |
var(--ut-component-text-default-color) |
--ut-cardlist-background-color
| Selector | Value | Color |
|---|---|---|
.t-Card-wrap |
var(--ut-component-background-color) | |
.t-Cards--sampleAppsFooter |
transparent |
--ut-cardlist-wrap-border-width
| Selector | Value | Color |
|---|---|---|
.t-Card-wrap |
1px |
--ut-cardlist-wrap-border-color
| Selector | Value | Color |
|---|---|---|
.t-Card-wrap |
var(--ut-component-border-color) | |
.t-Cards--sampleAppsFooter |
transparent |
--ut-cardlist-border-radius
| Selector | Value | Color |
|---|---|---|
.t-Card-wrap |
var(--ut-component-border-radius) |
--ut-cardlist-box-shadow
| Selector | Value | Color |
|---|---|---|
.t-Card-wrap |
var(--ut-component-box-shadow) | |
.t-Cards--sampleAppsFooter |
none |
--ut-cardlist-icon-border-radius
| Selector | Value | Color |
|---|---|---|
.t-Card-icon |
100% | |
.t-Cards--block .t-Icon |
100% | |
.t-Cards--iconsSquare,
.t-Cards.Square |
0 | |
.t-Cards--iconsRounded |
12.5% |
--ut-cardlist-icon-color
| Selector | Value | Color |
|---|---|---|
.t-Card-icon |
var(--ut-component-icon-color) |
--ut-cardlist-initials-font-size
| Selector | Value | Color |
|---|---|---|
.t-Card-initials |
1.25rem | |
.t-Cards--basic |
.75rem | |
.t-Cards--compact |
.75rem | |
.t-Cards--featured |
1.25rem |
--ut-cardlist-initials-border-radius
| Selector | Value | Color |
|---|---|---|
.t-Card-initials img |
100% |
--ut-cardlist-title-text-color
| Selector | Value | Color |
|---|---|---|
.t-Card-title |
var(--ut-component-text-title-color) |
--ut-cardlist-subtitle-text-color
| Selector | Value | Color |
|---|---|---|
.t-Card-subtitle |
var(--ut-component-text-subtitle-color) |
--ut-cardlist-body-border-border-width
| Selector | Value | Color |
|---|---|---|
.t-Card-body |
var(--ut-component-inner-border-width) |
--ut-cardlist-body-border-border-color
| Selector | Value | Color |
|---|---|---|
.t-Card-body |
var(--ut-component-inner-border-color) |
--ut-cardlist-desc-color
| Selector | Value | Color |
|---|---|---|
.t-Card-desc |
var(--ut-component-text-default-color) |
--ut-cardlist-info-margin-y
| Selector | Value | Color |
|---|---|---|
.t-Card-desc:empty + .t-Card-info |
0 | |
.t-Card-info |
0.75rem | |
.t-Card-info |
0.75rem |
--ut-cardlist-info-color
| Selector | Value | Color |
|---|---|---|
.t-Card-info |
var(--ut-component-text-muted-color) |
--ut-cardlist-info-font-size
| Selector | Value | Color |
|---|---|---|
.t-Card-info |
0.6875rem |
--ut-cardlist-info-line-height
| Selector | Value | Color |
|---|---|---|
.t-Card-info |
1rem |
--ut-cardlist-icon-container-size
| Selector | Value | Color |
|---|---|---|
.t-Cards--basic |
2rem | |
.t-Cards--compact |
2rem | |
.t-Cards--featured |
4rem |
--ut-cardlist-icon-size
| Selector | Value | Color |
|---|---|---|
.t-Cards--basic |
1rem | |
.t-Cards--compact |
1rem | |
.t-Cards--featured |
2rem |
--ut-cardlist-initials-font-weight
| Selector | Value | Color |
|---|---|---|
.t-Cards--basic |
var(--a-base-font-weight-semibold, 500) | |
.t-Cards--compact |
var(--a-base-font-weight-semibold, 500) | |
.t-Cards--featured |
normal |
--ut-cardlist-titlewrap-padding-x
| Selector | Value | Color |
|---|---|---|
.t-Cards--basic |
1rem | |
.t-Cards--compact |
.5rem | |
.t-Cards--featured |
1rem |
--ut-cardlist-titlewrap-padding-y
| Selector | Value | Color |
|---|---|---|
.t-Cards--basic |
.75rem | |
.t-Cards--compact |
.5rem | |
.t-Cards--featured |
1.5rem |
--ut-cardlist-title-font-size
| Selector | Value | Color |
|---|---|---|
.t-Cards--basic |
1rem | |
.t-Cards--compact |
.875rem | |
.t-Cards--featured |
1rem | |
.t-Cards--sampleAppsFooter |
.75rem |
--ut-cardlist-title-font-weight
| Selector | Value | Color |
|---|---|---|
.t-Cards--basic |
var(--a-base-font-weight-semibold, 500) | |
.t-Cards--compact |
normal | |
.t-Cards--featured |
var(--a-base-font-weight-semibold, 500) |
--ut-cardlist-title-line-height
| Selector | Value | Color |
|---|---|---|
.t-Cards--basic |
1.25rem | |
.t-Cards--compact |
1rem | |
.t-Cards--featured |
1.5 | |
.t-Cards--sampleAppsFooter |
1.5 |
--ut-cardlist-subtitle-font-size
| Selector | Value | Color |
|---|---|---|
.t-Cards--basic |
.75rem | |
.t-Cards--compact |
.6875rem | |
.t-Cards--featured |
.75rem |
--ut-cardlist-subtitle-font-weight
| Selector | Value | Color |
|---|---|---|
.t-Cards--basic |
normal | |
.t-Cards--compact |
normal | |
.t-Cards--featured |
normal |
--ut-cardlist-subtitle-line-height
| Selector | Value | Color |
|---|---|---|
.t-Cards--basic |
1rem | |
.t-Cards--compact |
.75rem | |
.t-Cards--featured |
1rem |
--ut-cardlist-subtitle-margin-y
| Selector | Value | Color |
|---|---|---|
.t-Cards--basic |
.25rem | |
.t-Cards--compact |
.25rem | |
.t-Cards--featured |
.25rem |
--ut-cardlist-body-padding-x
| Selector | Value | Color |
|---|---|---|
.t-Cards--basic |
1rem | |
.t-Cards--compact |
.5rem | |
.t-Cards--featured |
1rem |
--ut-cardlist-body-padding-y
| Selector | Value | Color |
|---|---|---|
.t-Cards--basic |
1rem | |
.t-Cards--compact |
.5rem | |
.t-Cards--featured |
1rem |
--ut-cardlist-desc-font-size
| Selector | Value | Color |
|---|---|---|
.t-Cards--basic |
.875rem | |
.t-Cards--compact |
.75rem | |
.t-Cards--featured |
.875rem |
--ut-cardlist-desc-line-height
| Selector | Value | Color |
|---|---|---|
.t-Cards--basic |
1.25rem | |
.t-Cards--compact |
1rem | |
.t-Cards--featured |
1.25rem |
--ut-cardlist-icon-overlay-background-color
| Selector | Value | Color |
|---|---|---|
.t-Cards--block .t-Icon |
var(--ut-component-border-color) |
--ut-cardlist-desc-lines
| Selector | Value | Color |
|---|---|---|
.t-Cards--desc-2ln |
2 | |
.t-Cards--desc-3ln |
3 | |
.t-Cards--desc-4ln |
4 |
--ut-cardlist-item-max-width
| Selector | Value | Color |
|---|---|---|
.t-Cards--float |
20rem |
--ut-cardlist-grid-gap
| Selector | Value | Color |
|---|---|---|
.t-Cards--float .t-Cards-item |
1rem | |
.t-Cards--float .t-Cards-item |
1rem | |
.t-Cards--float .t-Cards-item |
1rem | |
.t-Cards--float .t-Cards-item |
1rem | |
.t-Cards--stacked,
.t-Cards--cols,
.t-Cards--2cols,
.t-Cards--3cols,
.t-Cards--4cols,
.t-Cards--5cols |
1rem |
--ut-cardlist-colorfill-size
| Selector | Value | Color |
|---|---|---|
.t-Card-colorFill:after |
0.125rem |
--ut-cardlist-colorfill-offset
| Selector | Value | Color |
|---|---|---|
.t-Card-colorFill:after |
0.125rem |
--ut-tabs-border-width
| Selector | Value | Color |
|---|---|---|
.t-Tabs |
0 | |
.t-Tabs--pill |
var(--ut-component-border-width) | |
.t-Tabs--pill .t-Tabs-item |
1px | |
.u-RTL .t-Tabs--pill .t-Tabs-item |
1px |
--ut-tabs-item-font-size
| Selector | Value | Color |
|---|---|---|
.t-Tabs-item |
0.875rem | |
.t-Tabs--large |
.875rem | |
.t-Tabs--small |
.6875rem | |
.apex-rds-item |
0.875rem |
--ut-tabs-item-line-height
| Selector | Value | Color |
|---|---|---|
.t-Tabs-item |
1rem | |
.apex-rds-item |
1rem |
--ut-tabs-item-icon-spacing
| Selector | Value | Color |
|---|---|---|
.t-Tabs-item .t-Icon |
0.375rem | |
.t-Tabs-item .t-Icon |
0.375rem | |
.t-Tabs--iconsAbove .t-Icon |
0.375rem | |
.t-Tabs--iconsAbove .t-Icon |
0.375rem |
--ut-tabs-item-background-color
| Selector | Value | Color |
|---|---|---|
.t-Tabs-item:hover |
var(--ut-tabs-item-hover-background-color, var(--ut-component-highlight-background-color)) | |
.t-Tabs-item.is-active |
var(--ut-tabs-item-active-background-color) | |
.apex-rds-selected |
var(--ut-tabs-item-active-background-color) |
--ut-tabs-item-text-color
| Selector | Value | Color |
|---|---|---|
.t-Tabs-item.is-active |
var(--ut-tabs-item-active-text-color) | |
.t-Tabs-link |
var(--ut-link-text-color) | |
.apex-rds-item a |
var(--ut-link-text-color) | |
.apex-rds-selected |
var(--ut-tabs-item-active-text-color) |
--ut-tabs-item-highlight-color
| Selector | Value | Color |
|---|---|---|
.t-Tabs-item.is-active |
var(--ut-tabs-item-active-highlight-color) | |
.apex-rds-selected |
var(--ut-tabs-item-active-highlight-color) |
--ut-tabs-item-font-weight
| Selector | Value | Color |
|---|---|---|
.t-Tabs-item.is-active |
var(--ut-tabs-item-active-font-weight) | |
.apex-rds-selected |
var(--ut-tabs-item-active-font-weight) |
--ut-tabs-item-padding-y
| Selector | Value | Color |
|---|---|---|
.t-Tabs-link |
0.75re | |
.t-Tabs--large |
1rem | |
.t-Tabs--small |
.5rem | |
.apex-rds |
.75rem | |
.apex-rds-item span |
0.75rem | |
.apex-rds-item span |
0.75rem | |
.apex-rds-item span |
0.75rem | |
.apex-rds-item span |
0.75rem | |
.vertical-rds .apex-rds,
.t-Body-side .apex-rds |
.5rem |
--ut-tabs-border-radius
| Selector | Value | Color |
|---|---|---|
.t-Tabs--pill |
var(--ut-component-border-radius, .125rem) | |
.t-Tabs--pill .t-Tabs-item:first-child .t-Tabs-link |
0.125rem | |
.t-Tabs--pill .t-Tabs-item:first-child .t-Tabs-link |
0.125rem | |
.u-RTL .t-Tabs--pill .t-Tabs-item:first-child .t-Tabs-link |
0.125rem | |
.u-RTL .t-Tabs--pill .t-Tabs-item:first-child .t-Tabs-link |
0.125rem | |
.t-Tabs--pill .t-Tabs-item:last-child .t-Tabs-link |
0.125rem | |
.t-Tabs--pill .t-Tabs-item:last-child .t-Tabs-link |
0.125rem | |
.u-RTL .t-Tabs--pill .t-Tabs-item:last-child .t-Tabs-link |
0.125rem | |
.u-RTL .t-Tabs--pill .t-Tabs-item:last-child .t-Tabs-link |
0.125rem |
--ut-tabs-border-color
| Selector | Value | Color |
|---|---|---|
.t-Tabs--pill |
var(--ut-component-border-color) | |
.t-Tabs--pill .t-Tabs-item |
rgba(0, 0, 0, 0.1) | |
.u-RTL .t-Tabs--pill .t-Tabs-item |
rgba(0, 0, 0, 0.1) |
--ut-tabs-box-shadow
| Selector | Value | Color |
|---|---|---|
.t-Tabs--pill |
var(--ut-shadow-sm) |
--ut-tabs-item-width
| Selector | Value | Color |
|---|---|---|
.t-Tabs--fixedLabels .t-Tabs-item |
7.5rem |
--ut-tabs-item-padding-x
| Selector | Value | Color |
|---|---|---|
.t-Tabs--large |
1.5rem | |
.t-Tabs--small |
.5rem | |
.apex-rds |
.5rem | |
.apex-rds-item a |
0.5rem | |
.apex-rds-item a |
0.5rem | |
.apex-rds-item a |
0.5rem | |
.apex-rds-item a |
0.5rem | |
.vertical-rds .apex-rds,
.t-Body-side .apex-rds |
.75rem | |
.vertical-rds .apex-rds span,
.t-Body-side .apex-rds span |
0.75rem | |
.vertical-rds .apex-rds span,
.t-Body-side .apex-rds span |
0.75rem | |
.vertical-rds .apex-rds span,
.t-Body-side .apex-rds span |
0.75rem | |
.vertical-rds .apex-rds span,
.t-Body-side .apex-rds span |
0.75rem | |
.t-Body-info .apex-rds |
0.5rem | |
.t-Body-info .apex-rds |
0.5rem | |
.t-Body-info .apex-rds |
0.5rem | |
.t-Body-info .apex-rds |
0.5rem | |
.t-Body-info .apex-rds |
0.5rem | |
.t-Body-info .apex-rds |
0.5rem | |
.t-Body-info .apex-rds a |
0.5rem | |
.t-Body-info .apex-rds a |
0.5rem |
--ut-tabs-item-active-highlight-width
| Selector | Value | Color |
|---|---|---|
.vertical-rds .apex-rds,
.t-Body-side .apex-rds |
.25rem | |
.vertical-rds .apex-rds-selected span,
.t-Body-side .apex-rds-selected span |
currentColor ins |
--ut-hero-region-padding-y
| Selector | Value | Color |
|---|---|---|
.t-HeroRegion |
1re | |
.t-HeroRegion |
var(--ut-xs-hero-region-padding-y, .5rem) | |
.t-HeroRegion--noPadding |
0rem |
--ut-hero-region-padding-x
| Selector | Value | Color |
|---|---|---|
.t-HeroRegion |
var(--ut-xs-hero-region-padding-x, .5rem) | |
.t-HeroRegion--noPadding |
0rem |
--ut-hero-region-spacing
| Selector | Value | Color |
|---|---|---|
.t-HeroRegion-bottom |
1rem | |
.t-HeroRegion-bottom |
1rem | |
.t-HeroRegion-bottom |
var(--ut-xs-hero-region-spacing, var(--ut-hero-region-spacing, var(--ut-hero-region-padding-y, 1rem))) |
--ut-hero-region-font-size
| Selector | Value | Color |
|---|---|---|
.t-HeroRegion-col--content |
1rem | |
.t-HeroRegion-col--content |
var(--ut-xs-hero-region-font-size, .75rem) |
--ut-hero-region-line-height
| Selector | Value | Color |
|---|---|---|
.t-HeroRegion-col--content |
1.5rem | |
.t-HeroRegion-col--content |
var(--ut-xs-hero-region-line-height, 1rem) |
--ut-hero-region-content-text-color
| Selector | Value | Color |
|---|---|---|
.t-HeroRegion-col--content |
var(--ut-component-text-muted-color) | |
.t-Body-title .t-HeroRegion-col--content |
var(--ut-hero-region-title-text-color, var(--ut-component-text-title-color)) |
--ut-hero-region-column-spacing
| Selector | Value | Color |
|---|---|---|
.t-HeroRegion-form |
1rem | |
.t-HeroRegion-form |
1rem | |
.t-HeroRegion--featured.t-HeroRegion--centered .t-HeroRegion-col--left |
1rem | |
.t-HeroRegion--featured.t-HeroRegion--centered .t-HeroRegion-col--left |
1rem | |
.t-HeroRegion--featured.t-HeroRegion--centered .t-HeroRegion-col--right |
1rem | |
.t-HeroRegion--featured.t-HeroRegion--centered .t-HeroRegion-col--right |
1rem |
--ut-hero-region-icon-container-size
| Selector | Value | Color |
|---|---|---|
.t-HeroRegion-icon |
4rem | |
.t-HeroRegion-icon |
4rem | |
.t-HeroRegion-icon |
4rem | |
.t-HeroRegion-icon |
var(--ut-xs-hero-region-icon-container-size, 2rem) | |
.t-HeroRegion--featured |
8rem | |
.t-HeroRegion--featured |
6rem |
--ut-hero-region-icon-border-radius
| Selector | Value | Color |
|---|---|---|
.t-HeroRegion-icon |
12.5% | |
.t-HeroRegion--iconsSquare |
0 | |
.t-HeroRegion--iconsRounded |
12.5% | |
.t-HeroRegion--iconsCircle |
100% |
--ut-hero-region-icon-spacing
| Selector | Value | Color |
|---|---|---|
.t-HeroRegion-icon |
1rem | |
.t-HeroRegion-icon |
1rem | |
.t-HeroRegion-icon |
var(--ut-xs-hero-region-icon-spacing, .5rem) |
--ut-hero-region-icon-background-color
| Selector | Value | Color |
|---|---|---|
.t-HeroRegion-icon |
var(--ut-component-icon-background-color) |
--ut-hero-region-icon-text-color
| Selector | Value | Color |
|---|---|---|
.t-HeroRegion-icon |
var(--ut-component-icon-color) |
--ut-hero-region-icon-size
| Selector | Value | Color |
|---|---|---|
.t-HeroRegion-icon, .t-HeroRegion-icon.fa-lg |
2rem | |
.t-HeroRegion-icon |
var(--ut-xs-hero-region-icon-size, 1rem) | |
.t-HeroRegion--featured |
4rem | |
.t-HeroRegion--featured |
3rem |
--ut-xs-hero-region-title-font-size
| Selector | Value | Color |
|---|---|---|
.t-HeroRegion-title |
1rem |
--ut-xs-hero-region-title-line-height
| Selector | Value | Color |
|---|---|---|
.t-HeroRegion-title |
1.5rem |
--ut-hero-region-title-font-weight
| Selector | Value | Color |
|---|---|---|
.t-HeroRegion-title |
500 | |
.t-HeroRegion--headingFontAlt |
var(--ut-alternate-heading-font-weight) |
--ut-hero-region-title-text-color
| Selector | Value | Color |
|---|---|---|
.t-HeroRegion-title |
var(--ut-component-text-title-color) |
--ut-hero-region-title-font-size
| Selector | Value | Color |
|---|---|---|
.t-HeroRegion-title |
2rem |
--ut-hero-region-title-line-height
| Selector | Value | Color |
|---|---|---|
.t-HeroRegion-title |
2.5rem |
--ut-hero-region-title-font-family
| Selector | Value | Color |
|---|---|---|
.t-HeroRegion--headingFontAlt |
var(--ut-alternate-heading-font-family) |
--ut-carousel-button-border-width
| Selector | Value | Color |
|---|---|---|
.a-Region-carouselControl .a-Tabs-button |
0 |
--ut-carousel-button-border-radius
| Selector | Value | Color |
|---|---|---|
.a-Region-carouselControl .a-Tabs-button |
0.25rem |
--ut-carousel-button-background-color
| Selector | Value | Color |
|---|---|---|
.a-Region-carouselControl .a-Tabs-button |
rgba(0, 0, 0, 0.5) |
--ut-carousel-button-text-color
| Selector | Value | Color |
|---|---|---|
.a-Region-carouselControl .a-Tabs-button |
#fff |
--ut-carousel-button-opacity
| Selector | Value | Color |
|---|---|---|
.a-Region-carouselControl .a-Tabs-button |
0.5 |
--ut-carousel-button-offset-x
| Selector | Value | Color |
|---|---|---|
.a-Region-carouselControl .a-Tabs-previous-region |
0.75rem | |
.u-RTL .a-Region-carouselControl .a-Tabs-previous-region |
0.75rem | |
.a-Region-carouselControl .a-Tabs-next-region |
0.75rem | |
.u-RTL .a-Region-carouselControl .a-Tabs-next-region |
0.75rem |
--ut-alert-type-border-width
| Selector | Value | Color |
|---|---|---|
.t-Alert |
var(--ut-component-border-width) |
--ut-alert-type-border-color
| Selector | Value | Color |
|---|---|---|
.t-Alert |
var(--ut-component-border-color) |
--ut-alert-type-box-shadow
| Selector | Value | Color |
|---|---|---|
.t-Alert |
none |
--ut-alert-type-border-radius
| Selector | Value | Color |
|---|---|---|
.t-Alert |
var(--ut-component-border-radius) | |
.t-Alert--wizard .t-Alert-icon,
.t-Alert--horizontal .t-Alert-icon |
var(--ut-component-border-radius) | |
.t-Alert--wizard .t-Alert-icon,
.t-Alert--horizontal .t-Alert-icon |
var(--ut-component-border-radius) | |
.u-RTL .t-Alert--wizard .t-Alert-icon,
.u-RTL .t-Alert--horizontal .t-Alert-icon |
var(--ut-component-border-radius) | |
.u-RTL .t-Alert--wizard .t-Alert-icon,
.u-RTL .t-Alert--horizontal .t-Alert-icon |
var(--ut-component-border-radius) |
--ut-alert-type-background-color
| Selector | Value | Color |
|---|---|---|
.t-Alert |
var(--ut-component-background-color) | |
.t-Alert--colorBG.t-Alert--warning, .t-Alert--colorBG.t-Alert--yellow |
var(--ut-palette-warning-shade) | |
.t-Alert--colorBG.t-Alert--success |
var(--ut-palette-success-shade) | |
.t-Alert--colorBG.t-Alert--danger, .t-Alert--colorBG.t-Alert--red |
var(--ut-palette-danger-shade) | |
.t-Alert--colorBG.t-Alert--info |
var(--ut-palette-info-shade) | |
.t-Alert--page.t-Alert--success |
var(--ut-palette-success) | |
.t-Alert--page.t-Alert--warning |
var(--ut-palette-warning) |
--ut-alert-type-text-color
| Selector | Value | Color |
|---|---|---|
.t-Alert |
var(--ut-component-text-default-color) | |
.t-Alert--page.t-Alert--success |
var(--ut-palette-success-contrast) | |
.t-Alert--page.t-Alert--warning |
var(--ut-palette-warning-contrast) |
--ut-alert-icon-size
| Selector | Value | Color |
|---|---|---|
.t-Alert--horizontal |
var(--ut-alert-horizontal-icon-size, 2rem) | |
.t-Alert--wizard |
var(--ut-alert-wizard-icon-size, 4rem) | |
.t-Alert--page |
1.5rem |
--ut-alert-icon-padding
| Selector | Value | Color |
|---|---|---|
.t-Alert--horizontal |
var(--ut-alert-horizontal-icon-padding, 1rem) | |
.t-Alert--page |
1rem |
--ut-alert-border-radius
| Selector | Value | Color |
|---|---|---|
.t-Alert--horizontal |
var(--ut-alert-horizontal-border-radius, .25rem) | |
.t-Alert--wizard |
var(--ut-alert-wizard-border-radius, .125rem) | |
.t-Alert--page |
.25rem |
--ut-alert-margin
| Selector | Value | Color |
|---|---|---|
.t-Alert--horizontal |
1rem | |
.t-Alert--horizontal |
1rem | |
.t-Alert--wizard |
1rem | |
.t-Alert--wizard |
1rem | |
.t-Alert--wizard |
1rem | |
.t-Alert--wizard |
1rem |
--ut-alert-title-font-size
| Selector | Value | Color |
|---|---|---|
.t-Alert--horizontal .t-Alert-title |
1.125rem | |
.t-Alert--horizontal .t-Alert-title |
1.25rem | |
.t-Alert--wizard .t-Alert-title |
1.5rem | |
.t-Alert--page .t-Alert-title |
1.125rem |
--ut-alert-title-line-height
| Selector | Value | Color |
|---|---|---|
.t-Alert--horizontal .t-Alert-title |
1.375rem | |
.t-Alert--horizontal .t-Alert-title |
1.5rem | |
.t-Alert--wizard .t-Alert-title |
2.25rem |
--ut-alert-border-width
| Selector | Value | Color |
|---|---|---|
.t-Alert--page |
0px |
--ut-alert-box-shadow
| Selector | Value | Color |
|---|---|---|
.t-Alert--page |
0 0 0 var(--ut-component-border-width) var(--ut-component-border-color) inset, var(--ut-shadow-md) |
--ut-alert-icon-background-color
| Selector | Value | Color |
|---|---|---|
.t-Alert--page |
transparent | |
.t-Alert--warning.t-Alert--horizontal,
.t-Alert--yellow.t-Alert--horizontal |
var(--ut-palette-warning-shade) | |
.t-Alert--success.t-Alert--horizontal |
var(--ut-palette-success-shade) | |
.t-Alert--info.t-Alert--horizontal |
var(--ut-palette-info-shade) | |
.t-Alert--danger.t-Alert--horizontal,
.t-Alert--red.t-Alert--horizontal |
var(--ut-palette-danger-shade) | |
.t-Alert--page.t-Alert--success |
transparent | |
.t-Alert--page.t-Alert--warning |
transparent |
--ut-alert-offset
| Selector | Value | Color |
|---|---|---|
.t-Alert--page |
1rem | |
.t-Alert--page |
1rem | |
.t-Alert--page |
1rem | |
.u-RTL .t-Alert--page |
1rem |
--ut-notification-title-font-size
| Selector | Value | Color |
|---|---|---|
.t-Alert--page.t-Alert--warning .a-Notification-title |
0.875rem |
--ut-notification-title-line-height
| Selector | Value | Color |
|---|---|---|
.t-Alert--page.t-Alert--warning .a-Notification-title |
1.25rem |
--ut-notification-title-font-weight
| Selector | Value | Color |
|---|---|---|
.t-Alert--page.t-Alert--warning .a-Notification-title |
700 |
--ut-notification-title-margin
| Selector | Value | Color |
|---|---|---|
.t-Alert--page.t-Alert--warning .a-Notification-title |
0 |
--a-base-font-weight-bold
| Selector | Value | Color |
|---|---|---|
.t-Alert--page .t-Alert-title |
700 | |
.t-Comments-text--newValue |
700 | |
.t-ConfigPanel-status |
700 | |
.t-StatusList-attrLabel |
700 | |
.apex-item-display-only |
700 | |
.apex-item-group--rc input:checked + label,
.apex-item-single-checkbox input:checked + label |
700 | |
.oj-datetimepicker-switcher-buttons [data-handler=switchDone] |
700 | |
.ui-datepicker .ui-state-highlight,
.ui-datepicker .ui-state-active |
700 |
--ut-notification-item-font-size
| Selector | Value | Color |
|---|---|---|
.t-Alert--page .a-Notification-item |
0.875rem | |
.t-Alert--page .a-Notification-item |
var(--ut-xs-notification-item-font-size, .75rem) |
--ut-notification-item-line-height
| Selector | Value | Color |
|---|---|---|
.t-Alert--page .a-Notification-item |
1.25rem |
--ut-button-region-margin
| Selector | Value | Color |
|---|---|---|
.t-Alert .t-ButtonRegion |
0rem | |
.t-ButtonRegion |
0.75rem | |
.t-ButtonRegion |
0.75rem | |
.col .t-ButtonRegion:only-child |
.5rem | |
.t-Dialog .col .t-ButtonRegion:only-child |
0rem | |
.t-ButtonRegion--noUI |
0rem | |
.t-ButtonRegion--stickToBottom |
0rem | |
.t-Body-actions .t-ButtonRegion |
0rem | |
.t-DialogRegion-buttons .t-ButtonRegion,
.t-Wizard-footer .t-ButtonRegion,
.t-Dialog-footer .t-ButtonRegion,
.t-ButtonRegion--dialogRegion |
0rem |
--ut-alert-icon-text-color
| Selector | Value | Color |
|---|---|---|
.t-Alert--warning,
.t-Alert--yellow |
var(--ut-palette-warning) | |
.t-Alert--success |
var(--ut-palette-success) | |
.t-Alert--info |
var(--ut-palette-info) | |
.t-Alert--danger,
.t-Alert--red |
var(--ut-palette-danger) | |
.t-Alert--page.t-Alert--success |
inherit | |
.t-Alert--page.t-Alert--warning |
inherit |
--ut-button-region-border-width
| Selector | Value | Color |
|---|---|---|
.t-ButtonRegion |
1px | |
.t-ButtonRegion--noUI |
0px | |
.t-ButtonRegion--noBorder |
0px | |
.t-ButtonRegion--stickToBottom |
1px | |
.t-Body-actions .t-ButtonRegion |
0px | |
.t-Dialog-footer .t-ButtonRegion |
1px |
--ut-button-region-border-color
| Selector | Value | Color |
|---|---|---|
.t-ButtonRegion |
var(--ut-component-border-color) |
--ut-button-region-box-shadow
| Selector | Value | Color |
|---|---|---|
.t-ButtonRegion |
var(--ut-component-box-shadow) | |
.t-ButtonRegion--noUI |
none | |
.t-ButtonRegion--stickToBottom |
none | |
.t-Body-actions .t-ButtonRegion |
none | |
.t-DialogRegion-buttons .t-ButtonRegion,
.t-Wizard-footer .t-ButtonRegion,
.t-Dialog-footer .t-ButtonRegion,
.t-ButtonRegion--dialogRegion |
none |
--ut-button-region-background-color
| Selector | Value | Color |
|---|---|---|
.t-ButtonRegion |
var(--ut-component-background-color) | |
.t-ButtonRegion--noUI |
transparent | |
.t-Body-actions .t-ButtonRegion |
transparent |
--ut-button-region-text-color
| Selector | Value | Color |
|---|---|---|
.t-ButtonRegion |
var(--ut-component-text-default-color) | |
.t-ButtonRegion--noUI |
currentColor |
--ut-button-region-border-radius
| Selector | Value | Color |
|---|---|---|
.t-ButtonRegion--stickToBottom |
0 | |
.t-Body-actions .t-ButtonRegion |
0 |
--ut-button-region-title-font-size
| Selector | Value | Color |
|---|---|---|
.t-ButtonRegion--showTitle .t-ButtonRegion-title |
1.25rem |
--ut-button-region-title-line-height
| Selector | Value | Color |
|---|---|---|
.t-ButtonRegion--showTitle .t-ButtonRegion-title |
1 |
--ut-button-region-title-font-weight
| Selector | Value | Color |
|---|---|---|
.t-ButtonRegion--showTitle .t-ButtonRegion-title |
normal |
--ut-timeline-border-width
| Selector | Value | Color |
|---|---|---|
.t-Timeline-item |
var(--ut-component-inner-border-width) | |
.t-Timeline-item:last-child |
0 | |
.t-Timeline + .t-Report-pagination |
1px |
--ut-timeline-border-color
| Selector | Value | Color |
|---|---|---|
.t-Timeline-item |
var(--ut-component-inner-border-color) | |
.t-Timeline + .t-Report-pagination |
var(--ut-component-border-color) |
--ut-timeline-grid-gap
| Selector | Value | Color |
|---|---|---|
.t-Timeline-wrap |
0.5rem | |
.t-Timeline-wrap |
0.5rem | |
.t-Timeline-wrap |
.75rem | |
.t-Timeline-avatar |
0.5rem | |
.t-Timeline-avatar |
0.5rem | |
.t-Timeline-typeWrap |
0.5rem | |
.t-Timeline-typeWrap |
0.5rem | |
.t-Timeline--compact |
.5rem | |
.t-Timeline--compact .t-Timeline-typeWrap |
0 |
--ut-timeline-background-color
| Selector | Value | Color |
|---|---|---|
a.t-Timeline-wrap:hover, a.t-Timeline-wrap:focus |
var(--ut-timeline-hover-background-color, rgba(0, 0, 0, .025)) |
--ut-timeline-box-shadow
| Selector | Value | Color |
|---|---|---|
a.t-Timeline-wrap:hover, a.t-Timeline-wrap:focus |
var(--ut-timeline-hover-box-shadow) |
--ut-timeline-z-index
| Selector | Value | Color |
|---|---|---|
a.t-Timeline-wrap:hover, a.t-Timeline-wrap:focus |
var(--ut-timeline-hover-z-index, 10) |
--ut-timeline-avatar-size
| Selector | Value | Color |
|---|---|---|
.t-Timeline-avatar |
2.5rem | |
.t-Timeline-avatar |
2.5rem | |
.t-Timeline-avatar |
2.5rem | |
.t-Timeline-avatar |
1.5rem |
--ut-timeline-avatar-border-radius
| Selector | Value | Color |
|---|---|---|
.t-Timeline-avatar |
100% |
--ut-timeline-avatar-font-size
| Selector | Value | Color |
|---|---|---|
.t-Timeline-avatar |
0.875rem | |
.t-Timeline-avatar |
.6875rem |
--ut-timeline-icon-background-color
| Selector | Value | Color |
|---|---|---|
.t-Timeline-avatar |
var(--ut-component-icon-background-color) |
--ut-timeline-icon-color
| Selector | Value | Color |
|---|---|---|
.t-Timeline-avatar |
var(--ut-component-icon-color) |
--ut-timeline-user-info-padding-y
| Selector | Value | Color |
|---|---|---|
.t-Timeline-userinfo |
0.25rem | |
.t-Timeline-userinfo |
0.25rem | |
.t-Timeline-userinfo |
0.25rem | |
.t-Timeline-userinfo |
0.25rem |
--ut-timeline-username-text-color
| Selector | Value | Color |
|---|---|---|
.t-Timeline-username |
var(--ut-component-text-default-color) |
--ut-timeline-username-font-size
| Selector | Value | Color |
|---|---|---|
.t-Timeline-username |
0.75rem |
--ut-timeline-username-line-height
| Selector | Value | Color |
|---|---|---|
.t-Timeline-username |
1rem |
--ut-timeline-date-text-color
| Selector | Value | Color |
|---|---|---|
.t-Timeline-date |
var(--ut-component-text-muted-color) |
--ut-timeline-date-font-size
| Selector | Value | Color |
|---|---|---|
.t-Timeline-date |
0.6875rem |
--ut-timeline-date-line-height
| Selector | Value | Color |
|---|---|---|
.t-Timeline-date |
1rem |
--ut-timeline-typewrap-width
| Selector | Value | Color |
|---|---|---|
.t-Timeline-typeWrap |
35% |
--ut-timeline-type-padding-y
| Selector | Value | Color |
|---|---|---|
.t-Timeline-type |
0.125rem | |
.t-Timeline-type |
0.125rem | |
.t-Timeline-type |
0.125rem | |
.t-Timeline-type |
0.125rem | |
.t-Timeline-type |
.75rem | |
.t-Timeline--compact .t-Timeline-type |
.125rem |
--ut-timeline-type-padding-x
| Selector | Value | Color |
|---|---|---|
.t-Timeline-type |
0.5rem | |
.t-Timeline-type |
0.5rem | |
.t-Timeline-type |
0.5rem | |
.t-Timeline-type |
0.5rem | |
.t-Timeline-type |
.375rem | |
.t-Timeline-type |
.75rem | |
.t-Timeline--compact .t-Timeline-type |
.375rem |
--ut-timeline-type-border-radius
| Selector | Value | Color |
|---|---|---|
.t-Timeline-type |
0.125rem |
--ut-timeline-type-min-height
| Selector | Value | Color |
|---|---|---|
.t-Timeline-type |
0 | |
.t-Timeline-type |
2.5rem | |
.t-Timeline--compact .t-Timeline-type |
0 |
--ut-timeline-type-text-color
| Selector | Value | Color |
|---|---|---|
.t-Timeline-type |
var(--ut-palette-generic-contrast) | |
.t-Timeline-type.is-updated |
var(--ut-timeline-type-updated-text-color, var(--ut-palette-info-contrast)) | |
.t-Timeline-type.is-removed |
var(--ut-timeline-type-removed-text-color, var(--ut-palette-danger-contrast)) | |
.t-Timeline-type.is-new |
var(--ut-timeline-type-is-new-text-color, var(--ut-palette-success-contrast)) |
--ut-timeline-type-background-color
| Selector | Value | Color |
|---|---|---|
.t-Timeline-type |
var(--ut-palette-generic) | |
.t-Timeline-type.is-updated |
var(--ut-timeline-type-updated-background-color, var(--ut-palette-info)) | |
.t-Timeline-type.is-removed |
var(--ut-timeline-type-removed-background-color, var(--ut-palette-danger)) | |
.t-Timeline-type.is-new |
var(--ut-timeline-type-is-new-background-color, var(--ut-palette-success)) |
--ut-timeline-icon-size
| Selector | Value | Color |
|---|---|---|
.t-Timeline .t-Icon |
1rem | |
.t-Timeline .t-Icon |
1rem |
--ut-timeline-icon-spacing
| Selector | Value | Color |
|---|---|---|
.t-Timeline .t-Icon |
0.375rem | |
.t-Timeline .t-Icon |
0.375rem |
--ut-timeline-type-font-size
| Selector | Value | Color |
|---|---|---|
.t-Timeline-typename |
0.625rem | |
.t-Timeline-typename |
.6875rem | |
.t-Timeline-typename |
.75rem | |
.t-Timeline--compact .t-Timeline-typename |
.6875rem |
--ut-timeline-type-line-height
| Selector | Value | Color |
|---|---|---|
.t-Timeline-typename |
1rem |
--ut-timeline-type-font-weight
| Selector | Value | Color |
|---|---|---|
.t-Timeline-typename |
normal | |
.t-Timeline-typename |
var(--a-base-font-weight-bold, 700) | |
.t-Timeline--compact .t-Timeline-typename |
normal |
--ut-timeline-title-font-size
| Selector | Value | Color |
|---|---|---|
.t-Timeline-title |
1rem |
--ut-timeline-title-line-height
| Selector | Value | Color |
|---|---|---|
.t-Timeline-title |
1.25rem |
--ut-timeline-title-margin
| Selector | Value | Color |
|---|---|---|
.t-Timeline-title |
0.125rem 0 0 | |
.t-Timeline--compact |
.25rem 0 0 |
--ut-timeline-title-text-color
| Selector | Value | Color |
|---|---|---|
.t-Timeline-title |
var(--ut-component-text-title-color) |
--ut-timeline-desc-font-size
| Selector | Value | Color |
|---|---|---|
.t-Timeline-desc |
0.6875rem |
--ut-timeline-desc-line-height
| Selector | Value | Color |
|---|---|---|
.t-Timeline-desc |
1rem |
--ut-timeline-desc-margin
| Selector | Value | Color |
|---|---|---|
.t-Timeline-desc |
0 0 0.125rem | |
.t-Timeline-desc:last-child |
0 |
--ut-timeline-desc-text-color
| Selector | Value | Color |
|---|---|---|
.t-Timeline-desc |
var(--ut-component-text-muted-color) |
--ut-avp-border-color
| Selector | Value | Color |
|---|---|---|
.t-AVPList-item |
var(--ut-component-inner-border-color) | |
.t-AVPList-label,
.t-AVPList-value |
var(--ut-component-inner-border-color) | |
.t-AVPList + .t-Report-pagination |
var(--ut-component-border-color) |
--ut-avp-border-width
| Selector | Value | Color |
|---|---|---|
.t-AVPList-item |
var(--ut-component-inner-border-width) | |
.t-AVPList-item:last-of-type,
.t-AVPList-item .t-AVPList-label,
.t-AVPList-item .t-AVPList-value |
0 | |
.t-AVPList-label,
.t-AVPList-value |
var(--ut-component-inner-border-width) | |
.t-AVPList-label:last-of-type,
.t-AVPList-value:last-of-type |
0 | |
.t-AVPList + .t-Report-pagination |
1px |
--ut-avp-label-text-color
| Selector | Value | Color |
|---|---|---|
.t-AVPList-label |
var(--ut-component-text-title-color) |
--ut-avp-value-text-color
| Selector | Value | Color |
|---|---|---|
.t-AVPList-value |
var(--ut-component-text-subtitle-color) |
--ut-avp-font-size
| Selector | Value | Color |
|---|---|---|
.t-AVPList-label,
.t-AVPList-value |
0.875rem |
--ut-avp-line-height
| Selector | Value | Color |
|---|---|---|
.t-AVPList-label,
.t-AVPList-value |
1.25rem |
--ut-avp-padding-y
| Selector | Value | Color |
|---|---|---|
.t-AVPList-label,
.t-AVPList-value |
0.5rem | |
.t-AVPList-label,
.t-AVPList-value |
0.5rem | |
.t-AVPList-label,
.t-AVPList-value |
0.5rem | |
.t-AVPList-label,
.t-AVPList-value |
0.5rem |
--ut-avp-padding-x
| Selector | Value | Color |
|---|---|---|
.t-AVPList-label,
.t-AVPList-value |
0.75rem | |
.t-AVPList-label,
.t-AVPList-value |
0.75rem | |
.t-AVPList-label,
.t-AVPList-value |
0.75rem | |
.t-AVPList-label,
.t-AVPList-value |
0.75rem | |
.t-Body-info .t-AVPList-label,
.t-Body-info .t-AVPList-value |
1rem |
--ut-avp-label-width
| Selector | Value | Color |
|---|---|---|
.t-AVPList--leftAligned .t-AVPList-label |
30% | |
.t-AVPList--rightAligned .t-AVPList-value |
30% | |
.t-AVPList--fixedLabelSmall |
10rem | |
.t-AVPList--fixedLabelMedium |
13.75rem | |
.t-AVPList--fixedLabelLarge |
16.25rem | |
.t-AVPList--variableLabelSmall |
20% | |
.t-AVPList--variableLabelMedium |
30% | |
.t-AVPList--variableLabelLarge |
40% |
--ut-wizard-title-text-color
| Selector | Value | Color |
|---|---|---|
.t-Wizard-header |
var(--ut-component-text-title-color) | |
.t-Wizard .t-Wizard-title |
var(--ut-component-text-title-color) |
--ut-wizard-max-width
| Selector | Value | Color |
|---|---|---|
.t-Wizard |
78.75rem |
--ut-wizard-margin-x
| Selector | Value | Color |
|---|---|---|
.t-Wizard |
auto | |
.t-Wizard |
auto | |
.t-Wizard |
auto | |
.t-Wizard |
auto |
--ut-wizard-margin-y
| Selector | Value | Color |
|---|---|---|
.t-Wizard |
1rem | |
.t-Wizard |
1rem |
--ut-wizard-border-width
| Selector | Value | Color |
|---|---|---|
.t-Wizard |
1px |
--ut-wizard-border-color
| Selector | Value | Color |
|---|---|---|
.t-Wizard |
var(--ut-component-border-color) |
--ut-wizard-background-color
| Selector | Value | Color |
|---|---|---|
.t-Wizard |
var(--ut-region-background-color) |
--ut-wizard-box-shadow
| Selector | Value | Color |
|---|---|---|
.t-Wizard |
var(--ut-shadow-sm) |
--ut-wizard-controls-padding-x
| Selector | Value | Color |
|---|---|---|
.t-Wizard .t-Wizard-controls |
1rem | |
.t-Wizard .t-Wizard-controls |
1rem | |
.t-Wizard .t-Wizard-controls |
1rem | |
.t-Wizard .t-Wizard-controls |
1rem | |
.t-Wizard:not(.t-Wizard--showTitle) .t-Wizard-controls |
1rem | |
.t-Wizard:not(.t-Wizard--showTitle) .t-Wizard-controls |
1rem | |
.t-Wizard:not(.t-Wizard--showTitle) .t-Wizard-controls |
1rem | |
.t-Wizard:not(.t-Wizard--showTitle) .t-Wizard-controls |
1rem |
--ut-wizard-controls-padding-y
| Selector | Value | Color |
|---|---|---|
.t-Wizard .t-Wizard-controls |
1rem | |
.t-Wizard .t-Wizard-controls |
1rem | |
.t-Wizard .t-Wizard-controls |
1rem | |
.t-Wizard .t-Wizard-controls |
1rem | |
.t-Wizard:not(.t-Wizard--showTitle) .t-Wizard-controls |
1.5rem | |
.t-Wizard:not(.t-Wizard--showTitle) .t-Wizard-controls |
1.5rem | |
.t-Wizard:not(.t-Wizard--showTitle) .t-Wizard-controls |
1.5rem | |
.t-Wizard:not(.t-Wizard--showTitle) .t-Wizard-controls |
1.5rem |
--ut-wizard-title-font-size
| Selector | Value | Color |
|---|---|---|
.t-Wizard .t-Wizard-title |
1.5rem |
--ut-wizard-title-line-height
| Selector | Value | Color |
|---|---|---|
.t-Wizard .t-Wizard-title |
1 |
--ut-wizard-title-padding-x
| Selector | Value | Color |
|---|---|---|
.t-Wizard .t-Wizard-title |
0 | |
.t-Wizard .t-Wizard-title |
0 | |
.t-Wizard .t-Wizard-title |
0 | |
.t-Wizard .t-Wizard-title |
0 |
--ut-wizard-title-padding-y
| Selector | Value | Color |
|---|---|---|
.t-Wizard .t-Wizard-title |
1.5rem | |
.t-Wizard .t-Wizard-title |
1.5rem | |
.t-Wizard .t-Wizard-title |
1.5rem | |
.t-Wizard .t-Wizard-title |
1.5rem |
--ut-wizard-body-padding-x
| Selector | Value | Color |
|---|---|---|
.t-Wizard .t-Wizard-body |
1rem | |
.t-Wizard .t-Wizard-body |
1rem | |
.t-Wizard .t-Wizard-body |
1rem | |
.t-Wizard .t-Wizard-body |
1rem |
--ut-wizard-body-padding-y
| Selector | Value | Color |
|---|---|---|
.t-Wizard .t-Wizard-body |
1.5rem | |
.t-Wizard .t-Wizard-body |
1.5rem | |
.t-Wizard .t-Wizard-body |
1.5rem | |
.t-Wizard .t-Wizard-body |
1.5rem |
--ut-wp-min-height
| Selector | Value | Color |
|---|---|---|
.t-WizardSteps-wrap |
2rem |
--ut-wp-step-track-size
| Selector | Value | Color |
|---|---|---|
.t-WizardSteps-wrap:after |
0.125rem | |
.t-WizardSteps--vertical .t-WizardSteps-wrap:after |
0.125rem | |
.t-WizardSteps--vertical .t-WizardSteps-step:first-child .t-WizardSteps-wrap:after,
.t-WizardSteps--vertical .t-WizardSteps-step:last-child .t-WizardSteps-wrap:after |
0.125rem |
--ut-wp-track-color
| Selector | Value | Color |
|---|---|---|
.t-WizardSteps-wrap:after |
var(--ut-component-border-color) |
--ut-wp-link-color
| Selector | Value | Color |
|---|---|---|
a.t-WizardSteps-wrap[href]:focus .t-WizardSteps-label,
a.t-WizardSteps-wrap[href]:hover .t-WizardSteps-label |
var(--ut-link-text-color) |
--ut-wp-marker-size
| Selector | Value | Color |
|---|---|---|
.t-WizardSteps-marker |
0.75rem | |
.t-WizardSteps-marker |
0.75rem | |
.t-WizardSteps-step.is-active .t-WizardSteps-marker,
.t-WizardSteps-step.is-complete .t-WizardSteps-marker |
1.25rem |
--ut-wp-marker-color
| Selector | Value | Color |
|---|---|---|
.t-WizardSteps-marker |
var(--ut-component-border-color) |
--ut-wp-marker-border-radius
| Selector | Value | Color |
|---|---|---|
.t-WizardSteps-marker |
100% |
--ut-wp-marker-padding
| Selector | Value | Color |
|---|---|---|
.t-WizardSteps-step.is-active .t-WizardSteps-marker,
.t-WizardSteps-step.is-complete .t-WizardSteps-marker |
.125rem |
--ut-wp-completed-marker-icon
| Selector | Value | Color |
|---|---|---|
.t-WizardSteps-step.is-complete .t-WizardSteps-marker:before |
"\e007" |
--ut-wp-completed-marker-font-size
| Selector | Value | Color |
|---|---|---|
.t-WizardSteps-step.is-complete .t-WizardSteps-marker:before |
1rem |
--ut-wp-checkmark-color
| Selector | Value | Color |
|---|---|---|
.t-WizardSteps-step.is-complete .t-WizardSteps-marker:before |
#fff | |
.t-WizardSteps-step.is-complete .t-WizardSteps-marker |
#fff |
--ut-wp-complete-background-color
| Selector | Value | Color |
|---|---|---|
.t-WizardSteps-step.is-complete .t-WizardSteps-marker |
var(--ut-palette-success) |
--ut-wp-active-background-color
| Selector | Value | Color |
|---|---|---|
.t-WizardSteps-step.is-active .t-WizardSteps-marker |
var(--ut-palette-primary) |
--ut-wp-active-text-color
| Selector | Value | Color |
|---|---|---|
.t-WizardSteps-step.is-active .t-WizardSteps-marker |
#fff |
--ut-wp-label-active-font-weight
| Selector | Value | Color |
|---|---|---|
.t-WizardSteps-step.is-active .t-WizardSteps-label |
700 |
--ut-wp-vertical-marker-size
| Selector | Value | Color |
|---|---|---|
.t-WizardSteps--vertical .t-WizardSteps-step .t-WizardSteps-marker |
1.25rem | |
.t-WizardSteps--vertical .t-WizardSteps-step .t-WizardSteps-marker |
1.25rem |
--ut-wp-label-padding-y
| Selector | Value | Color |
|---|---|---|
.t-WizardSteps-label |
0.25rem | |
.t-WizardSteps-label |
0.25rem |
--ut-wp-label-line-height
| Selector | Value | Color |
|---|---|---|
.t-WizardSteps-label |
1.125rem |
--ut-wp-label-font-size
| Selector | Value | Color |
|---|---|---|
.t-WizardSteps-label |
0.75rem |
--ut-wp-label-color
| Selector | Value | Color |
|---|---|---|
.t-WizardSteps-label |
var(--ut-component-text-default-color) |
--ut-wp-vertical-marker-margin-y
| Selector | Value | Color |
|---|---|---|
.t-WizardSteps--vertical .t-WizardSteps-label |
0.5rem | |
.t-WizardSteps--vertical .t-WizardSteps-label |
0.5rem | |
.t-WizardSteps--vertical .t-WizardSteps-label |
0.5rem | |
.t-WizardSteps--vertical .t-WizardSteps-label |
0.5rem |
--ut-wp-vertical-marker-margin-x
| Selector | Value | Color |
|---|---|---|
.t-WizardSteps--vertical .t-WizardSteps-label |
0.5rem | |
.t-WizardSteps--vertical .t-WizardSteps-label |
0.5rem |
--ut-cr-border-width
| Selector | Value | Color |
|---|---|---|
.t-ContentRow |
0 | |
.t-ContentRow-item + .t-Report-pagination |
var(--ut-component-border-width) |
--ut-cr-item-border-color
| Selector | Value | Color |
|---|---|---|
.t-ContentRow-item:not(:only-child):not(:last-child) |
var(--ut-component-inner-border-color) |
--ut-cr-item-border-width
| Selector | Value | Color |
|---|---|---|
.t-ContentRow-item:not(:only-child):not(:last-child) |
var(--ut-component-inner-border-width) | |
.t-ContentRow--hideBorders |
0px |
--ut-cr-border-color
| Selector | Value | Color |
|---|---|---|
.t-ContentRow-item + .t-Report-pagination |
var(--ut-component-border-color) |
--ut-cr-wrap-padding-x
| Selector | Value | Color |
|---|---|---|
.t-ContentRow-wrap |
1rem | |
.t-ContentRow-wrap |
1rem | |
.t-ContentRow-wrap |
1rem | |
.t-ContentRow-wrap |
1rem | |
.t-ContentRow-wrap |
var(--ut-xs-cr-wrap-padding-x, .75rem) | |
.t-ContentRow-misc |
0.75rem | |
.t-ContentRow-misc |
0.75rem | |
.t-ContentRow-actions |
0.75rem | |
.t-ContentRow-actions |
0.75rem | |
.t-ContentRow--styleCompact |
.75rem |
--ut-cr-wrap-padding-y
| Selector | Value | Color |
|---|---|---|
.t-ContentRow-wrap |
1rem | |
.t-ContentRow-wrap |
1rem | |
.t-ContentRow-wrap |
1rem | |
.t-ContentRow-wrap |
1rem | |
.t-ContentRow-wrap |
var(--ut-xs-cr-wrap-padding-y, .75rem) | |
.t-ContentRow--styleCompact |
.75rem | |
.t-ContentRow--removePadding .t-ContentRow-wrap |
.5rem |
--ut-cr-selection-spacing
| Selector | Value | Color |
|---|---|---|
.t-ContentRow-selection |
1rem | |
.t-ContentRow-selection |
1rem | |
.t-ContentRow--styleCompact |
.625rem |
--ut-cr-selection-font-size
| Selector | Value | Color |
|---|---|---|
.t-ContentRow-selection |
1rem | |
.t-ContentRow-selection input |
1rem |
--ut-cr-icon-spacing
| Selector | Value | Color |
|---|---|---|
.t-ContentRow-iconWrap |
0.75rem | |
.t-ContentRow-iconWrap |
0.75rem | |
.t-ContentRow--styleCompact |
.625rem |
--ut-cr-icon-text-color
| Selector | Value | Color |
|---|---|---|
.t-ContentRow-iconWrap |
var(--ut-component-text-muted-color) |
--ut-cr-img-max-width
| Selector | Value | Color |
|---|---|---|
.t-ContentRow .t-ContentRow-iconWrap img |
2.5rem | |
.t-ContentRow--styleCompact |
1.5rem |
--ut-cr-title-font-size
| Selector | Value | Color |
|---|---|---|
.t-ContentRow-title |
1rem | |
.t-ContentRow--styleCompact |
.9375rem |
--ut-cr-title-line-height
| Selector | Value | Color |
|---|---|---|
.t-ContentRow-title |
1.25rem |
--ut-cr-title-font-weight
| Selector | Value | Color |
|---|---|---|
.t-ContentRow-title |
700 |
--ut-cr-title-margin-x
| Selector | Value | Color |
|---|---|---|
.t-ContentRow-title |
0.5rem | |
.t-ContentRow-title |
0.5rem |
--ut-cr-title-text-color
| Selector | Value | Color |
|---|---|---|
.t-ContentRow-title |
var(--ut-component-text-title-color) |
--ut-cr-desc-margin-y
| Selector | Value | Color |
|---|---|---|
.t-ContentRow-description |
0.25rem | |
.t-ContentRow-description |
0.25rem | |
.t-ContentRow--hideTitle |
0rem |
--ut-cr-desc-font-size
| Selector | Value | Color |
|---|---|---|
.t-ContentRow-description |
0.75rem |
--ut-cr-desc-line-height
| Selector | Value | Color |
|---|---|---|
.t-ContentRow-description |
1.25rem |
--ut-cr-desc-text-color
| Selector | Value | Color |
|---|---|---|
.t-ContentRow-description |
var(--ut-component-text-muted-color) |
--ut-cr-misc-margin-y
| Selector | Value | Color |
|---|---|---|
.t-ContentRow-misc |
0.25rem | |
.t-ContentRow-misc |
0.25rem |
--ut-cr-misc-font-size
| Selector | Value | Color |
|---|---|---|
.t-ContentRow-misc |
0.75rem |
--ut-cr-desc-misc-text-color
| Selector | Value | Color |
|---|---|---|
.t-ContentRow-misc |
var(--ut-component-text-muted-color) |
--ut-cr-actions-margin-y
| Selector | Value | Color |
|---|---|---|
.t-ContentRow-actions |
0.25rem | |
.t-ContentRow-actions |
0.25rem |
--ut-cr-actions-font-size
| Selector | Value | Color |
|---|---|---|
.t-ContentRow-actions |
0.75rem |
--ut-cr-desc-actions-text-color
| Selector | Value | Color |
|---|---|---|
.t-ContentRow-actions |
var(--ut-component-text-muted-color) |
--ut-comment-item-margin-bottom
| Selector | Value | Color |
|---|---|---|
.t-Comments-item |
1rem | |
.t-Comments-item |
1rem | |
.t-Comments-item:last-child |
0 |
--ut-comment-icon-margin-x
| Selector | Value | Color |
|---|---|---|
.t-Comments-icon |
0.75rem | |
.t-Comments-icon |
0.75rem |
--ut-comment-icon-border-radius
| Selector | Value | Color |
|---|---|---|
.t-Comments-userIcon,
.t-Comments-userImg |
100% | |
.t-Comments--iconsSquare |
0 |
--ut-comment-icon-size
| Selector | Value | Color |
|---|---|---|
.t-Comments-userIcon,
.t-Comments-userImg |
2rem | |
.t-Comments-userIcon,
.t-Comments-userImg |
2rem | |
.t-Comments-userIcon |
2rem |
--ut-comment-icon-background-color
| Selector | Value | Color |
|---|---|---|
.t-Comments-userIcon,
.t-Comments-userImg |
var(--ut-component-icon-background-color) |
--ut-comment-icon-color
| Selector | Value | Color |
|---|---|---|
.t-Comments-userIcon,
.t-Comments-userImg |
var(--ut-component-icon-color) |
--ut-comment-icon-font-size
| Selector | Value | Color |
|---|---|---|
.t-Comments-userIcon |
0.75rem |
--ut-comment-icon-font-weight
| Selector | Value | Color |
|---|---|---|
.t-Comments-userIcon |
500 |
--ut-comment-icon-rounded-border-radius
| Selector | Value | Color |
|---|---|---|
.t-Comments--iconsRounded |
.25rem |
--ut-comment-info-color
| Selector | Value | Color |
|---|---|---|
.t-Comments-info |
var(--ut-component-text-muted-color) |
--ut-comment-info-font-size
| Selector | Value | Color |
|---|---|---|
.t-Comments-info |
0.75rem |
--ut-comment-info-margin-x
| Selector | Value | Color |
|---|---|---|
.t-Comments-date |
0.5rem | |
.t-Comments-date |
0.5rem | |
.t-Comments-date:last-child |
0rem |
--ut-comment-info-sep-opacity
| Selector | Value | Color |
|---|---|---|
.t-Comments-date:before |
0.5 |
--ut-comment-font-size
| Selector | Value | Color |
|---|---|---|
.t-Comments-comment |
0.875rem |
--ut-comment-line-height
| Selector | Value | Color |
|---|---|---|
.t-Comments-comment |
1.25rem |
--ut-comment-chat-padding-x
| Selector | Value | Color |
|---|---|---|
.t-Comments--chat |
.5rem |
--ut-comment-chat-padding-y
| Selector | Value | Color |
|---|---|---|
.t-Comments--chat |
.375rem |
--ut-comment-chat-border-radius
| Selector | Value | Color |
|---|---|---|
.t-Comments--chat |
.25rem |
--ut-comment-info-margin-y
| Selector | Value | Color |
|---|---|---|
.t-Comments--chat .t-Comments-info |
0.25rem | |
.t-Comments--chat .t-Comments-info |
0.25rem |
--ut-comment-chat-text-color
| Selector | Value | Color |
|---|---|---|
.t-Comments--chat .t-Comments-comment |
var(--ut-component-text-default-color) | |
.t-Comments--chat .t-Comments-item.is-active |
var(--ut-comment-chat-active-text-color) |
--ut-comment-chat-top
| Selector | Value | Color |
|---|---|---|
.t-Comments--chat .t-Comments-comment:after |
1rem |
--ut-comment-caret-border-width
| Selector | Value | Color |
|---|---|---|
.t-Comments--chat .t-Comments-comment:after |
0.375rem |
--ut-comment-chat-background-color
| Selector | Value | Color |
|---|---|---|
.t-Comments--chat .t-Comments-item.is-active |
var(--ut-comment-chat-active-background-color) |
--ut-breadcrumb-padding-y
| Selector | Value | Color |
|---|---|---|
.t-BreadcrumbRegion |
1re | |
.t-BreadcrumbRegion |
var(--ut-xs-breadcrumb-padding-y, 1rem) | |
.t-BreadcrumbRegion |
.5rem | |
.t-BreadcrumbRegion-body |
0.5rem | |
.t-BreadcrumbRegion-body |
0.5rem | |
.t-BreadcrumbRegion-body |
0.5rem | |
.t-BreadcrumbRegion-body |
0.5rem | |
.t-BreadcrumbRegion + div > .apex-rds-container |
.5rem | |
.t-Body-title-shrink .t-BreadcrumbRegion |
.5rem | |
.t-Body-title-shrink .t-BreadcrumbRegion-body |
0.5rem | |
.t-Body-title-shrink .t-BreadcrumbRegion-body |
0.5rem | |
.t-Body-title-shrink .t-BreadcrumbRegion-body |
0.5rem | |
.t-Body-title-shrink .t-BreadcrumbRegion-body |
0.5rem |
--ut-breadcrumb-padding-x
| Selector | Value | Color |
|---|---|---|
.t-BreadcrumbRegion |
var(--ut-xs-breadcrumb-padding-x, 1rem) |
--ut-breadcrumb-region-spacing
| Selector | Value | Color |
|---|---|---|
.t-BreadcrumbRegion-bottom |
1rem | |
.t-BreadcrumbRegion-bottom |
1rem | |
.t-BreadcrumbRegion-bottom |
var(--ut-xs-breadcrumb-region-spacing, var(--ut-breadcrumb-region-spacing, var(--ut-breadcrumb-padding-y, 1rem))) |
--ut-breadcrumb-item-active-font-weight
| Selector | Value | Color |
|---|---|---|
.t-BreadcrumbRegion--useBreadcrumbTitle .t-Breadcrumb-item.is-active,
.t-BreadcrumbRegion-titleText |
500 |
--ut-breadcrumb-item-active-text-color
| Selector | Value | Color |
|---|---|---|
.t-BreadcrumbRegion--useBreadcrumbTitle .t-Breadcrumb-item.is-active,
.t-BreadcrumbRegion-titleText |
var(--ut-component-text-title-color) |
--ut-breadcrumb-item-font-size
| Selector | Value | Color |
|---|---|---|
.t-BreadcrumbRegion--useRegionTitle .t-BreadcrumbRegion-titleText |
0.875rem | |
.t-Body-title-shrink .t-BreadcrumbRegion--useRegionTitle .t-BreadcrumbRegion-titleText |
0.875rem | |
.t-BreadcrumbRegion--compactTitle .t-BreadcrumbRegion-titleText |
0.875rem | |
.t-Breadcrumb-item |
0.875rem |
--ut-breadcrumb-item-line-height
| Selector | Value | Color |
|---|---|---|
.t-BreadcrumbRegion--useRegionTitle .t-BreadcrumbRegion-titleText |
1rem | |
.t-Body-title-shrink .t-BreadcrumbRegion--useRegionTitle .t-BreadcrumbRegion-titleText |
1rem | |
.t-BreadcrumbRegion--compactTitle .t-BreadcrumbRegion-titleText |
1rem | |
.t-Breadcrumb-item |
1rem |
--ut-breadcrumb-title-font-size
| Selector | Value | Color |
|---|---|---|
.t-Body-title:not(.t-Body-title-shrink) .t-BreadcrumbRegion--useBreadcrumbTitle:not(.t-BreadcrumbRegion--compactTitle) .t-Breadcrumb-item:last-child,
.t-BreadcrumbRegion-titleText |
2rem |
--ut-breadcrumb-title-line-height
| Selector | Value | Color |
|---|---|---|
.t-Body-title:not(.t-Body-title-shrink) .t-BreadcrumbRegion--useBreadcrumbTitle:not(.t-BreadcrumbRegion--compactTitle) .t-Breadcrumb-item:last-child,
.t-BreadcrumbRegion-titleText |
3rem | |
.t-Body-title:not(.t-Body-title-shrink) .t-BreadcrumbRegion-buttons |
3rem |
--ut-breadcrumb-title-font-weight
| Selector | Value | Color |
|---|---|---|
.t-Body-title:not(.t-Body-title-shrink) .t-BreadcrumbRegion--useBreadcrumbTitle:not(.t-BreadcrumbRegion--compactTitle) .t-Breadcrumb-item:last-child,
.t-BreadcrumbRegion-titleText |
500 |
--ut-breadcrumb-item-font-weight
| Selector | Value | Color |
|---|---|---|
.t-Breadcrumb-item |
400 |
--ut-breadcrumb-item-text-color
| Selector | Value | Color |
|---|---|---|
.t-Breadcrumb-item |
var(--ut-component-text-muted-color) |
--ut-breadcrumb-item-sep-opacity
| Selector | Value | Color |
|---|---|---|
.t-Breadcrumb-item:after |
0.5 |
--ut-breadcrumb-item-sep-spacing
| Selector | Value | Color |
|---|---|---|
.t-Breadcrumb-item:after |
0.5rem | |
.t-Breadcrumb-item:after |
0.5rem | |
.t-Breadcrumb-item:after |
0.5rem | |
.t-Breadcrumb-item:after |
0.5rem |
--ut-lv-line-height
| Selector | Value | Color |
|---|---|---|
.a-ListView-item |
1.25rem | |
.a-ListView-item .ui-li-count |
1.25rem |
--ut-lv-item-padding-y
| Selector | Value | Color |
|---|---|---|
.a-ListView-item .ui-btn |
0.5rem | |
.a-ListView-item .ui-btn |
0.5rem | |
.a-ListView-item .ui-btn |
0.5rem | |
.a-ListView-item .ui-btn |
0.5rem | |
.a-ListView-divider,
.a-ListView-item |
0.5rem | |
.a-ListView-divider,
.a-ListView-item |
0.5rem | |
.a-ListView-divider,
.a-ListView-item |
0.5rem | |
.a-ListView-divider,
.a-ListView-item |
0.5rem |
--ut-lv-item-padding-x
| Selector | Value | Color |
|---|---|---|
.a-ListView-item .ui-btn |
0.75rem | |
.a-ListView-item .ui-btn |
0.75rem | |
.a-ListView-item .ui-btn |
0.75rem | |
.a-ListView-item .ui-btn |
0.75rem | |
.a-ListView-divider,
.a-ListView-item |
0.75rem | |
.a-ListView-divider,
.a-ListView-item |
0.75rem | |
.a-ListView-divider,
.a-ListView-item |
0.75rem | |
.a-ListView-divider,
.a-ListView-item |
0.75rem |
--ut-lv-item-font-size
| Selector | Value | Color |
|---|---|---|
.a-ListView-divider,
.a-ListView-item |
0.875rem |
--ut-lv-count-position-x
| Selector | Value | Color |
|---|---|---|
.a-ListView-item .ui-li-count |
0.5rem | |
.u-RTL .a-ListView-item .ui-li-count |
0.5rem |
--ut-lv-count-position-y
| Selector | Value | Color |
|---|---|---|
.a-ListView-item .ui-li-count |
0.75rem |
--ut-lv-count-font-size
| Selector | Value | Color |
|---|---|---|
.a-ListView-item .ui-li-count |
0.6875rem |
--ut-lv-count-padding-y
| Selector | Value | Color |
|---|---|---|
.a-ListView-item .ui-li-count |
0 | |
.a-ListView-item .ui-li-count |
0 | |
.a-ListView-item .ui-li-count |
0 | |
.a-ListView-item .ui-li-count |
0 |
--ut-lv-count-padding-x
| Selector | Value | Color |
|---|---|---|
.a-ListView-item .ui-li-count |
0.25rem | |
.a-ListView-item .ui-li-count |
0.25rem | |
.a-ListView-item .ui-li-count |
0.25rem | |
.a-ListView-item .ui-li-count |
0.25rem |
--ut-lv-count-border-radius
| Selector | Value | Color |
|---|---|---|
.a-ListView-item .ui-li-count |
0.125rem |
--ut-lv-divider-font-weight
| Selector | Value | Color |
|---|---|---|
.a-ListView-divider |
700 |
--ut-lv-divider-line-height
| Selector | Value | Color |
|---|---|---|
.a-ListView-divider |
1.5 |
--ut-lv-divider-background-color
| Selector | Value | Color |
|---|---|---|
.a-ListView-divider |
var(--ut-component-toolbar-background-color) |
--ut-region-border-width
| Selector | Value | Color |
|---|---|---|
.t-Region |
1px | |
.t-Body-side .t-Region,
.t-Body-actions .t-Region |
1px 0 | |
.t-Body-side .t-Region:first-child,
.t-Body-actions .t-Region:first-child |
0px | |
.t-Region--stacked |
1px |
--ut-region-border-color
| Selector | Value | Color |
|---|---|---|
.t-Region |
var(--ut-component-border-color) |
--ut-region-border-radius
| Selector | Value | Color |
|---|---|---|
.t-Region |
var(--ut-component-border-radius) | |
.t-Region-header |
var(--ut-component-border-radius) | |
.t-Region-header |
var(--ut-component-border-radius) | |
.t-Region--hideShow.is-collapsed > .t-Region-header |
var(--ut-component-border-radius) | |
.t-Region--hideShow.is-collapsed > .t-Region-header |
var(--ut-component-border-radius) | |
.t-Body-side .t-Region,
.t-Body-actions .t-Region |
0 |
--ut-region-box-shadow
| Selector | Value | Color |
|---|---|---|
.t-Region |
var(--ut-component-box-shadow) | |
.t-Body-side .t-Region,
.t-Body-actions .t-Region |
none |
--ut-region-margin
| Selector | Value | Color |
|---|---|---|
.t-Region |
1rem | |
.t-Region |
1rem | |
.t-Body-side .t-Region,
.t-Body-actions .t-Region |
0rem |
--ut-region-background-color
| Selector | Value | Color |
|---|---|---|
.t-Region |
var(--ut-component-background-color) | |
.t-Body-side .t-Region,
.t-Body-actions .t-Region |
transparent | |
.t-Body-actions .t-Region |
transparent |
--ut-region-text-color
| Selector | Value | Color |
|---|---|---|
.t-Region |
var(--ut-component-text-default-color) |
--ut-region-font-size
| Selector | Value | Color |
|---|---|---|
.t-Region |
0.875rem |
--ut-region-line-height
| Selector | Value | Color |
|---|---|---|
.t-Region |
1.25rem |
--ut-region-header-border-width
| Selector | Value | Color |
|---|---|---|
.t-Region-header |
1px | |
.t-Region--hideShow.is-collapsed |
0px | |
.t-Region--noBorder > .t-Region-header |
0px | |
.t-Region--stacked > .t-Region-header |
1px | |
.t-Region--textContent > .t-Region-header, .t-Region--textContent > .t-Region-bodyWrap > .t-Region-body |
0px |
--ut-region-header-border-color
| Selector | Value | Color |
|---|---|---|
.t-Region-header |
rgba(0, 0, 0, 0.075) |
--ut-region-header-background-color
| Selector | Value | Color |
|---|---|---|
.t-Region-header |
var(--ut-component-background-color) | |
.t-Body-side .t-Region,
.t-Body-actions .t-Region |
transparent | |
.t-Region--accent1 > .t-Region-header |
var(--u-color-1) | |
.t-Region--accent2 > .t-Region-header |
var(--u-color-2) | |
.t-Region--accent3 > .t-Region-header |
var(--u-color-3) | |
.t-Region--accent4 > .t-Region-header |
var(--u-color-4) | |
.t-Region--accent5 > .t-Region-header |
var(--u-color-5) | |
.t-Region--accent6 > .t-Region-header |
var(--u-color-6) | |
.t-Region--accent7 > .t-Region-header |
var(--u-color-7) | |
.t-Region--accent8 > .t-Region-header |
var(--u-color-8) | |
.t-Region--accent9 > .t-Region-header |
var(--u-color-9) | |
.t-Region--accent10 > .t-Region-header |
var(--u-color-10) | |
.t-Region--accent11 > .t-Region-header |
var(--u-color-11) | |
.t-Region--accent12 > .t-Region-header |
var(--u-color-12) | |
.t-Region--accent13 > .t-Region-header |
var(--u-color-13) | |
.t-Region--accent14 > .t-Region-header |
var(--u-color-14) | |
.t-Region--accent15 > .t-Region-header |
var(--u-color-15) |
--ut-region-header-text-color
| Selector | Value | Color |
|---|---|---|
.t-Region-header |
var(--ut-component-text-default-color) | |
.t-Region--accent1 > .t-Region-header |
var(--u-color-1-contrast) | |
.t-Region--accent2 > .t-Region-header |
var(--u-color-2-contrast) | |
.t-Region--accent3 > .t-Region-header |
var(--u-color-3-contrast) | |
.t-Region--accent4 > .t-Region-header |
var(--u-color-4-contrast) | |
.t-Region--accent5 > .t-Region-header |
var(--u-color-5-contrast) | |
.t-Region--accent6 > .t-Region-header |
var(--u-color-6-contrast) | |
.t-Region--accent7 > .t-Region-header |
var(--u-color-7-contrast) | |
.t-Region--accent8 > .t-Region-header |
var(--u-color-8-contrast) | |
.t-Region--accent9 > .t-Region-header |
var(--u-color-9-contrast) | |
.t-Region--accent10 > .t-Region-header |
var(--u-color-10-contrast) | |
.t-Region--accent11 > .t-Region-header |
var(--u-color-11-contrast) | |
.t-Region--accent12 > .t-Region-header |
var(--u-color-12-contrast) | |
.t-Region--accent13 > .t-Region-header |
var(--u-color-13-contrast) | |
.t-Region--accent14 > .t-Region-header |
var(--u-color-14-contrast) | |
.t-Region--accent15 > .t-Region-header |
var(--u-color-15-contrast) |
--ut-region-header-font-size
| Selector | Value | Color |
|---|---|---|
.t-Region-header |
1rem | |
.t-Body-actions .t-Region |
.875rem |
--ut-region-header-line-height
| Selector | Value | Color |
|---|---|---|
.t-Region-header |
1.5rem | |
.t-Body-actions .t-Region |
1rem |
--ut-region-header-icon-spacing
| Selector | Value | Color |
|---|---|---|
.t-Region-headerIcon |
0.25rem | |
.t-Region-headerIcon |
0.25rem |
--ut-region-header-icon-padding
| Selector | Value | Color |
|---|---|---|
.t-Region-headerIcon .t-Icon |
0.25rem |
--ut-region-header-icon-border-radius
| Selector | Value | Color |
|---|---|---|
.t-Region-headerIcon .t-Icon |
0.125rem |
--ut-region-header-item-spacing
| Selector | Value | Color |
|---|---|---|
.t-Region-headerItems--controls |
0.5rem | |
.t-Region-headerItems--controls |
0.5rem | |
.t-Region-headerItems--buttons |
0.5rem | |
.t-Region-headerItems--buttons |
0.5rem | |
.t-Region-headerItems--buttons |
0.5rem | |
.t-Region-headerItems--buttons |
0.5rem | |
.t-Region--controlsPosEnd .t-Region-headerItems--controls |
0.5rem | |
.t-Region--controlsPosEnd .t-Region-headerItems--controls |
0.5rem |
--ut-region-header-padding-y
| Selector | Value | Color |
|---|---|---|
.t-Region-headerItems--title |
0.75rem | |
.t-Region-headerItems--title |
0.75rem | |
.t-Region-headerItems--title |
0.75rem | |
.t-Region-headerItems--title |
0.75rem |
--ut-region-header-padding-x
| Selector | Value | Color |
|---|---|---|
.t-Region-headerItems--title |
0.75rem | |
.t-Region-headerItems--title |
0.75rem | |
.t-Region-headerItems--title |
0.75rem | |
.t-Region-headerItems--title |
0.75rem | |
.t-Region-headerItems--buttons |
0.75rem | |
.t-Region-headerItems--buttons |
0.75rem | |
.t-Region--noUI > .t-Region-header |
0rem | |
.t-Region-headerItems--buttons .t-Button + .js-maximizeButtonContainer |
0.75rem | |
.t-Region-headerItems--buttons .t-Button + .js-maximizeButtonContainer |
0.75rem |
--ut-region-body-padding-y
| Selector | Value | Color |
|---|---|---|
.t-Region-body |
1rem | |
.t-Region-body |
1rem | |
.t-Region-body |
1rem | |
.t-Region-body |
1rem | |
.t-Body-actions .t-Region |
.75rem |
--ut-region-body-padding-x
| Selector | Value | Color |
|---|---|---|
.t-Region-body |
1rem | |
.t-Region-body |
1rem | |
.t-Region-body |
1rem | |
.t-Region-body |
1rem | |
.t-Body-actions .t-Region |
.75rem |
--ut-region-buttons-padding-y
| Selector | Value | Color |
|---|---|---|
.t-Region-buttons-left,
.t-Region-buttons-right |
0.5rem | |
.t-Region-buttons-left,
.t-Region-buttons-right |
0.5rem | |
.t-Region-buttons-left,
.t-Region-buttons-right |
0.5rem | |
.t-Region-buttons-left,
.t-Region-buttons-right |
0.5rem | |
.t-Region-buttons-left:empty,
.t-Region-buttons-right:empty |
0rem |
--ut-region-buttons-padding-x
| Selector | Value | Color |
|---|---|---|
.t-Region-buttons-left,
.t-Region-buttons-right |
0.75rem | |
.t-Region-buttons-left,
.t-Region-buttons-right |
0.75rem | |
.t-Region-buttons-left,
.t-Region-buttons-right |
0.75rem | |
.t-Region-buttons-left,
.t-Region-buttons-right |
0.75rem | |
.t-Region-buttons-left:empty,
.t-Region-buttons-right:empty |
0rem |
--ut-region-hideshow-header-padding-x
| Selector | Value | Color |
|---|---|---|
.t-Region--hideShow > .t-Region-header .t-Region-headerItems--title |
0.5rem | |
.t-Region--hideShow > .t-Region-header .t-Region-headerItems--title |
0.5rem | |
.t-Region--hideShow > .t-Region-header .t-Region-headerItems--title |
0.5rem | |
.t-Region--hideShow > .t-Region-header .t-Region-headerItems--title |
0.5rem | |
.t-Region--controlsPosEnd .t-Region-headerItems--title |
var(--ut-region-header-padding-x, .75rem) |
--ut-ccalendar-title-padding
| Selector | Value | Color |
|---|---|---|
.t-ClassicCalendar-title |
1rem |
--ut-ccalendar-title-font-size
| Selector | Value | Color |
|---|---|---|
.t-ClassicCalendar-title |
1.5rem |
--ut-ccalendar-title-line-height
| Selector | Value | Color |
|---|---|---|
.t-ClassicCalendar-title |
2rem |
--ut-ccalendar-heading-padding
| Selector | Value | Color |
|---|---|---|
.t-ClassicCalendar-dayColumn |
0.25rem 0.5rem | |
.t-ClassicCalendar--weekly .t-ClassicCalendar-timeCol,
.t-ClassicCalendar--daily .t-ClassicCalendar-timeCol |
0.25rem 0.5rem |
--ut-ccalendar-heading-font-size
| Selector | Value | Color |
|---|---|---|
.t-ClassicCalendar-dayColumn |
0.75rem |
--ut-ccalendar-heading-line-height
| Selector | Value | Color |
|---|---|---|
.t-ClassicCalendar-dayColumn |
1rem |
--ut-ccalendar-border-width
| Selector | Value | Color |
|---|---|---|
.t-ClassicCalendar-dayColumn |
1px | |
.t-ClassicCalendar-day |
1px | |
.t-ClassicCalendar-list |
1px | |
.t-ClassicCalendar-listTitle,
.t-ClassicCalendar-listEvent |
1px | |
.t-ClassicCalendar-listTitle:first-child |
0px |
--ut-ccalendar-day-height
| Selector | Value | Color |
|---|---|---|
.t-ClassicCalendar-day |
4.5rem | |
.t-ClassicCalendar |
3rem | |
.t-ClassicCalendar--weekly,
.t-ClassicCalendar--daily |
auto |
--ut-ccalendar-day-font-size
| Selector | Value | Color |
|---|---|---|
.t-ClassicCalendar-day |
0.75rem | |
.t-ClassicCalendar |
.6875rem |
--ut-ccalendar-day-line-height
| Selector | Value | Color |
|---|---|---|
.t-ClassicCalendar-day |
1rem |
--ut-ccalendar-date-text-color
| Selector | Value | Color |
|---|---|---|
.t-ClassicCalendar-day.is-today |
var(--ut-ccalendar-date-today-text-color) |
--ut-ccalendar-date-background-color
| Selector | Value | Color |
|---|---|---|
.t-ClassicCalendar-day.is-today |
var(--ut-ccalendar-date-today-background-color) |
--ut-ccalendar-date-font-weight
| Selector | Value | Color |
|---|---|---|
.t-ClassicCalendar-day.is-today |
var(--ut-ccalendar-date-today-font-weight, 700) |
--ut-ccalendar-date-margin
| Selector | Value | Color |
|---|---|---|
.t-ClassicCalendar-date |
0.25rem | |
.t-ClassicCalendar |
.125rem |
--ut-ccalendar-date-font-size
| Selector | Value | Color |
|---|---|---|
.t-ClassicCalendar-date |
0.6875rem | |
.t-ClassicCalendar |
.625rem |
--ut-ccalendar-date-width
| Selector | Value | Color |
|---|---|---|
.t-ClassicCalendar-date |
1.25rem | |
.t-ClassicCalendar |
1rem |
--ut-ccalendar-date-height
| Selector | Value | Color |
|---|---|---|
.t-ClassicCalendar-date |
1.25rem | |
.t-ClassicCalendar-date |
1.25rem | |
.t-ClassicCalendar |
1rem |
--ut-ccalendar-date-border-radius
| Selector | Value | Color |
|---|---|---|
.t-ClassicCalendar-date |
100% |
--ut-ccalendar-event-margin
| Selector | Value | Color |
|---|---|---|
.t-ClassicCalendar-event |
0.25rem | |
.t-ClassicCalendar |
.125rem | |
.t-ClassicCalendar--weekly .t-ClassicCalendar-dayEvents a,
.t-ClassicCalendar--daily .t-ClassicCalendar-dayEvents a |
0.25rem |
--ut-ccalendar-event-padding
| Selector | Value | Color |
|---|---|---|
.t-ClassicCalendar-event a |
0.125rem 0.5rem | |
.t-ClassicCalendar |
.125rem .25rem | |
.t-ClassicCalendar--weekly .t-ClassicCalendar-dayEvents a,
.t-ClassicCalendar--daily .t-ClassicCalendar-dayEvents a |
0.125rem 0.5rem |
--ut-ccalendar-event-border-radius
| Selector | Value | Color |
|---|---|---|
.t-ClassicCalendar-event a |
0.125rem | |
.t-ClassicCalendar--weekly .t-ClassicCalendar-dayEvents a,
.t-ClassicCalendar--daily .t-ClassicCalendar-dayEvents a |
0.125rem |
--ut-ccalendar-day-background-color
| Selector | Value | Color |
|---|---|---|
.t-ClassicCalendar--weekly .t-ClassicCalendar-day.is-today,
.t-ClassicCalendar--daily .t-ClassicCalendar-day.is-today |
var(--ut-ccalendar-day-today-background-color) |
--ut-ccalendar-day-text-color
| Selector | Value | Color |
|---|---|---|
.t-ClassicCalendar--weekly .t-ClassicCalendar-day.is-today,
.t-ClassicCalendar--daily .t-ClassicCalendar-day.is-today |
var(--ut-ccalendar-day-today-text-color) |
--ut-ccalendar-list-title-padding
| Selector | Value | Color |
|---|---|---|
.t-ClassicCalendar-listTitle |
0.25rem 0.5rem |
--ut-ccalendar-list-title-font-size
| Selector | Value | Color |
|---|---|---|
.t-ClassicCalendar-listTitle |
1rem |
--ut-ccalendar-list-title-line-height
| Selector | Value | Color |
|---|---|---|
.t-ClassicCalendar-listTitle |
1.5rem |
--ut-ccalendar-list-date-font-weight
| Selector | Value | Color |
|---|---|---|
.t-ClassicCalendar-listTitle.is-today |
var(--ut-ccalendar-date-today-font-weight, 700) |
--ut-ccalendar-list-event-padding
| Selector | Value | Color |
|---|---|---|
.t-ClassicCalendar-listEvent |
0.25rem 0.5rem |
--ut-ccalendar-list-event-font-size
| Selector | Value | Color |
|---|---|---|
.t-ClassicCalendar-listEvent |
0.875rem |
--ut-ccalendar-list-event-line-height
| Selector | Value | Color |
|---|---|---|
.t-ClassicCalendar-listEvent |
1.25rem |
--ut-ccalendar-list-date-font-size
| Selector | Value | Color |
|---|---|---|
.t-ClassicCalendar-listDayDate |
0.75rem |
--ut-badge-background-color
| Selector | Value | Color |
|---|---|---|
.t-Badge |
transparent | |
.t-Badge--orb:before |
transparent | |
.t-Badge--orb.is-primary |
#AAC7DA | |
.t-Badge--basic.is-primary |
#fcfdfe | |
.t-Badge--orb.is-info |
#8ABCEB | |
.t-Badge--basic.is-info |
#eef5fc | |
.t-Badge--orb.is-warning |
#FFBE2A | |
.t-Badge--basic.is-warning |
#fff4dd | |
.t-Badge--orb.is-success |
#2ECC71 | |
.t-Badge--basic.is-success |
#d1f5e0 | |
.t-Badge--orb.is-danger |
#F54B21 | |
.t-Badge--basic.is-danger |
#fdd5cc | |
.t-Badge--orb.is-complete |
#E0E0E0 | |
.t-Badge--basic.is-complete |
#E0E0E0 |
--ut-badge-text-color
| Selector | Value | Color |
|---|---|---|
.t-Badge |
inherit | |
.t-Badge--basic.is-primary |
#404040 | |
.t-Badge--basic.is-info |
#404040 | |
.t-Badge--basic.is-warning |
#775200 | |
.t-Badge--basic.is-success |
#0d3a20 | |
.t-Badge--basic.is-danger |
#5f1604 | |
.t-Badge--basic.is-complete |
#404040 | |
.t-Badge--orb.is-null,
.t-Badge--basic.is-null |
#707070 |
--ut-badge-font-size
| Selector | Value | Color |
|---|---|---|
.t-Badge |
0.75rem | |
.t-Badge--large |
.875rem | |
.t-Badge--small |
.6875rem | |
.t-Badge--xsmall |
.6875rem |
--ut-badge-line-height
| Selector | Value | Color |
|---|---|---|
.t-Badge |
1rem |
--ut-badge-icon-gap
| Selector | Value | Color |
|---|---|---|
.t-Badge .t-Icon |
0.25rem | |
.t-Badge .t-Icon |
0.25rem | |
.t-Badge--orb:before |
0.25rem | |
.t-Badge--orb:before |
0.25rem |
--ut-badge-border-radius
| Selector | Value | Color |
|---|---|---|
.t-Badge--basic |
.125rem | |
.t-Badge--orb |
100% |
--ut-badge-border-width
| Selector | Value | Color |
|---|---|---|
.t-Badge--basic |
1px | |
.t-Badge--orb |
1px |
--ut-badge-border-color
| Selector | Value | Color |
|---|---|---|
.t-Badge--basic |
rgba(0, 0, 0, .025) | |
.t-Badge--orb |
rgba(0, 0, 0, .025) |
--ut-badge-padding-y
| Selector | Value | Color |
|---|---|---|
.t-Badge--basic |
.5rem | |
.t-Badge--large.t-Badge--basic |
1rem | |
.t-Badge--small.t-Badge--basic |
.25rem | |
.t-Badge--xsmall.t-Badge--basic |
0rem |
--ut-badge-padding-x
| Selector | Value | Color |
|---|---|---|
.t-Badge--basic |
.75rem | |
.t-Badge--large.t-Badge--basic |
1rem | |
.t-Badge--small.t-Badge--basic |
.5rem | |
.t-Badge--xsmall.t-Badge--basic |
.5rem |
--ut-badge-orb-size
| Selector | Value | Color |
|---|---|---|
.t-Badge--orb:before |
0.625rem | |
.t-Badge--orb:before |
0.625rem | |
.t-Badge--large.t-Badge--orb |
.75rem | |
.t-Badge--xsmall.t-Badge--orb |
.5rem |
--ut-badge-icon-size
| Selector | Value | Color |
|---|---|---|
.t-Badge--xsmall |
.875rem |
--ut-completeness-background-color
| Selector | Value | Color |
|---|---|---|
.t-Completeness |
#fff |
--ut-completeness-border-radius
| Selector | Value | Color |
|---|---|---|
.t-Completeness |
0.125rem |
--ut-completeness-fill-background-color
| Selector | Value | Color |
|---|---|---|
.t-Completeness.is-danger |
#ff3b30 | |
.t-Completeness.is-warning |
#ffcc00 | |
.t-Completeness.is-success |
#4cd964 | |
.t-Completeness-fill |
rgba(0, 0, 0, 0.2) |
--ut-completeness-labelwrap-background-color
| Selector | Value | Color |
|---|---|---|
a.t-Completeness:hover .t-Completeness-labelWrap |
rgba(0, 0, 0, .25) |
--ut-completeness-label-background-color
| Selector | Value | Color |
|---|---|---|
a.t-Completeness:hover .t-Completeness-label |
#fff | |
.t-Completeness-label |
rgba(255, 255, 255, 0.75) |
--ut-completeness-fill-height
| Selector | Value | Color |
|---|---|---|
.t-Completeness-fill |
3rem |
--ut-completeness-label-font-size
| Selector | Value | Color |
|---|---|---|
.t-Completeness-label |
0.875rem |
--ut-completeness-label-line-height
| Selector | Value | Color |
|---|---|---|
.t-Completeness-label |
1.5rem |
--ut-completeness-label-padding
| Selector | Value | Color |
|---|---|---|
.t-Completeness-label |
0.25rem 0.75rem |
--ut-completeness-label-margin
| Selector | Value | Color |
|---|---|---|
.t-Completeness-label |
0.5rem |
--ut-completeness-label-border-radius
| Selector | Value | Color |
|---|---|---|
.t-Completeness-label |
0.125rem |
--ut-completeness-label-text-color
| Selector | Value | Color |
|---|---|---|
.t-Completeness-label |
rgba(0, 0, 0, 0.75) |
--ut-content-block-margin
| Selector | Value | Color |
|---|---|---|
.t-ContentBlock |
2rem | |
.t-ContentBlock |
2rem | |
.t-ContentBlock |
1rem |
--ut-content-block-header-item-spacing
| Selector | Value | Color |
|---|---|---|
.t-ContentBlock-headerItems--buttons |
0.75rem | |
.t-ContentBlock-headerItems--buttons |
0.75rem | |
.t-ContentBlock--showIcon > .t-ContentBlock-header .t-ContentBlock-headerIcon |
0.75rem | |
.t-ContentBlock--showIcon > .t-ContentBlock-header .t-ContentBlock-headerIcon |
0.75rem | |
.t-ContentBlock-title |
0.75rem | |
.t-ContentBlock-title |
0.75rem | |
.t-ContentBlock-title:last-child |
0 |
--ut-content-block-header-font-weight
| Selector | Value | Color |
|---|---|---|
.t-ContentBlock-title |
500 |
--ut-content-block-header-line-height
| Selector | Value | Color |
|---|---|---|
.t-ContentBlock-title |
1.5 |
--ut-content-block-border-width
| Selector | Value | Color |
|---|---|---|
.t-ContentBlock-body |
0 | |
.t-ContentBlock--shadowBG |
1px | |
.t-ContentBlock--lightBG |
1px |
--ut-content-block-border-color
| Selector | Value | Color |
|---|---|---|
.t-ContentBlock-body |
var(--ut-component-border-color) |
--ut-content-block-border-radius
| Selector | Value | Color |
|---|---|---|
.t-ContentBlock-body |
var(--ut-region-border-radius) |
--ut-content-block-font-size
| Selector | Value | Color |
|---|---|---|
.t-ContentBlock-body |
0.875rem |
--ut-content-block-line-height
| Selector | Value | Color |
|---|---|---|
.t-ContentBlock-body |
1.25rem |
--ut-content-block-padding-y
| Selector | Value | Color |
|---|---|---|
.t-ContentBlock--padded |
1rem |
--ut-content-block-padding-x
| Selector | Value | Color |
|---|---|---|
.t-ContentBlock--padded |
1rem |
--ut-content-block-background-color
| Selector | Value | Color |
|---|---|---|
.t-ContentBlock--shadowBG |
var(--ut-content-block-shadow-background-color, var(--ut-component-badge-background-color)) | |
.t-ContentBlock--lightBG |
var(--ut-content-block-light-background-color, var(--ut-component-background-color)) |
--ut-content-block-box-shadow
| Selector | Value | Color |
|---|---|---|
.t-ContentBlock--shadowBG |
var(--ut-region-box-shadow) | |
.t-ContentBlock--lightBG |
var(--ut-region-box-shadow) |
--ut-content-block-header-margin
| Selector | Value | Color |
|---|---|---|
.t-ContentBlock--h1 |
1rem | |
.t-ContentBlock--h1 |
.5rem | |
.t-ContentBlock--h2 |
.75rem | |
.t-ContentBlock--h2 |
.25rem | |
.t-ContentBlock--h3 |
.75rem | |
.t-ContentBlock--h3 |
.25rem |
--ut-content-block-header-font-size
| Selector | Value | Color |
|---|---|---|
.t-ContentBlock--h1 |
2rem | |
.t-ContentBlock--h1 |
1.5rem | |
.t-ContentBlock--h2 |
1.5rem | |
.t-ContentBlock--h2 |
1.25rem | |
.t-ContentBlock--h3 |
1.25rem | |
.t-ContentBlock--h3 |
1rem |
--a-gv-background-color
| Selector | Value | Color |
|---|---|---|
.a-GV-row.is-hover |
var(--a-gv-row-hover-background-color) |
--ut-field-input-padding-x-offset
| Selector | Value | Color |
|---|---|---|
.a-GV-cell .a-GV-columnItem input:not([type=radio]):not([type=checkbox]) |
1px | |
.a-GV-cell .a-GV-columnItem input:not([type=radio]):not([type=checkbox]) |
1px | |
.u-UTR .a-GV-cell .a-GV-columnItem input:not([type=radio]):not([type=checkbox]) |
1px | |
.u-UTR .a-GV-cell .a-GV-columnItem input:not([type=radio]):not([type=checkbox]) |
1px | |
.a-FS-search,
.a-FS-filter |
calc(var(--a-icon-size, 1rem) + var(--ut-field-input-icon-padding-x, .25rem) + calc(var(--a-field-input-padding-x, .25rem) - var(--a-field-input-border-width, 1px))) | |
.a-FS-search .apex-item-text,
.a-FS-filter .apex-item-text |
1px | |
.a-FS-search .apex-item-text,
.a-FS-filter .apex-item-text |
1px | |
.t-Form-fieldContainer--floatingLabel.apex-item-wrapper--has-icon |
calc(var(--ut-field-input-icon-offset, 1.5rem) + var(--a-field-input-padding-x, .25rem) - var(--a-field-input-border-width, 1px)) | |
.t-Form-fieldContainer--floatingLabel.apex-item-wrapper--color-picker |
calc(var(--ut-field-input-icon-offset, 1.5rem) - var(--a-field-input-border-width, 1px)) | |
.t-Form-fieldContainer--floatingLabel .apex-item-display-only |
1px | |
.t-Form-fieldContainer--floatingLabel .apex-item-display-only |
1px | |
.apex-item-wrapper--has-icon,
.apex-item-wrapper--color-picker |
calc(var(--ut-field-input-icon-offset, 1.5rem) - var(--a-field-input-border-width, 1px)) | |
.apex-item-text,
.apex-item-select,
.apex-item-textarea,
.u-TF-item--text,
.u-TF-item--select,
select.listmanager,
select.group_selectlist,
.apex-item-multi,
.datetimepicker_newMonth |
1px | |
.apex-item-text,
.apex-item-select,
.apex-item-textarea,
.u-TF-item--text,
.u-TF-item--select,
select.listmanager,
select.group_selectlist,
.apex-item-multi,
.datetimepicker_newMonth |
1px | |
.apex-item-text.apex-item-popup-lov |
1px | |
.apex-item-text.apex-item-popup-lov |
1px | |
.apex-item-wrapper--date-picker-jet .oj-text-field-container:not(.oj-text-field-has-start-slot) .oj-text-field-input,
.a-GV-columnItem .apex-item-datepicker-jet .oj-text-field-container:not(.oj-text-field-has-start-slot) .oj-text-field-input |
1px | |
.apex-item-wrapper--date-picker-jet .oj-text-field-container:not(.oj-text-field-has-start-slot) .oj-text-field-input,
.a-GV-columnItem .apex-item-datepicker-jet .oj-text-field-container:not(.oj-text-field-has-start-slot) .oj-text-field-input |
1px | |
.apex-item-wrapper--date-picker-jet .oj-datepicker-inline .oj-datepicker-content,
.a-GV-columnItem .apex-item-datepicker-jet .oj-datepicker-inline .oj-datepicker-content |
1px | |
.apex-item-wrapper--date-picker-jet .oj-datepicker-inline .oj-datepicker-content,
.a-GV-columnItem .apex-item-datepicker-jet .oj-datepicker-inline .oj-datepicker-content |
1px |
--a-gv-border-radius
| Selector | Value | Color |
|---|---|---|
.a-IRR |
.125rem | |
.t-IRR-region--noBorders |
0 | |
.is-maximized.t-IRR-region .a-IRR |
0 |
--a-gv-cell-padding-y
| Selector | Value | Color |
|---|---|---|
.a-IRR |
.5rem |
--a-gv-cell-padding-x
| Selector | Value | Color |
|---|---|---|
.a-IRR |
.75rem |
--ut-irr-region-margin
| Selector | Value | Color |
|---|---|---|
.t-IRR-region |
1rem | |
.t-IRR-region |
1rem | |
.t-Region .t-IRR-region |
0 |
--ut-irr-region-box-shadow
| Selector | Value | Color |
|---|---|---|
.t-Region .t-IRR-region |
none |
--a-gv-border-width
| Selector | Value | Color |
|---|---|---|
.t-IRR-region--noBorders |
0 |
--a-toolbar-sep-border-width
| Selector | Value | Color |
|---|---|---|
.a-IRR-controlGroup |
1px |
--a-toolbar-sep-spacing
| Selector | Value | Color |
|---|---|---|
.a-IRR-controlGroup |
0.5rem | |
.a-IRR-controlGroup |
0.5rem |
--ut-fs-total-font-size
| Selector | Value | Color |
|---|---|---|
.a-FS |
inherit | |
.a-FS-totalArea |
1.125rem |
--ut-field-input-icon-offset
| Selector | Value | Color |
|---|---|---|
.a-FS-search,
.a-FS-filter |
calc(var(--a-icon-size, 1rem) + var(--ut-field-input-icon-padding-x, .25rem) + var(--ut-field-input-icon-padding-x, .25rem)) | |
.a-FS-search span.apex-item-icon,
.a-FS-filter span.apex-item-icon |
1.5rem | |
.u-RTL .a-FS-search span.apex-item-icon,
.u-RTL .a-FS-filter span.apex-item-icon |
1.5rem | |
.apex-item-wrapper--has-icon,
.apex-item-wrapper--color-picker |
calc(var(--ut-field-input-icon-size, var(--a-icon-size, 1rem)) + var(--ut-field-input-icon-padding-x, .25rem) + var(--ut-field-input-icon-padding-x, .25rem)) | |
.apex-item-icon |
1.5rem | |
.u-RTL .apex-item-icon |
1.5rem | |
.apex-item-display-only |
0 | |
.apex-item-display-only |
0 |
--ut-field-fl-label-offset
| Selector | Value | Color |
|---|---|---|
.a-FS-search .apex-item-text,
.a-FS-filter .apex-item-text |
1px | |
.a-FS-search .apex-item-text,
.a-FS-filter .apex-item-text |
1px | |
.t-Form-fieldContainer--floatingLabel |
calc(var(--ut-field-fl-label-line-height, 1.25rem) + var(--a-field-input-padding-y, .25rem) - var(--a-field-input-border-width, 1px)) | |
.t-Form-fieldContainer--floatingLabel .apex-item-group--popup-lov .apex-item-multi .apex-item-popup-lov |
calc(var(--a-field-input-padding-y, .25rem) - var(--a-field-input-border-width, 1px)) | |
.apex-item-text,
.apex-item-select,
.apex-item-textarea,
.u-TF-item--text,
.u-TF-item--select,
select.listmanager,
select.group_selectlist,
.apex-item-multi,
.datetimepicker_newMonth |
1px | |
.apex-item-text,
.apex-item-select,
.apex-item-textarea,
.u-TF-item--text,
.u-TF-item--select,
select.listmanager,
select.group_selectlist,
.apex-item-multi,
.datetimepicker_newMonth |
1px | |
.apex-item-text.apex-item-popup-lov,
.apex-item-multi |
1px | |
.apex-item-text.apex-item-popup-lov,
.apex-item-multi |
1px | |
.apex-item-wrapper--date-picker-jet .oj-text-field-container:not(.oj-text-field-has-start-slot) .oj-text-field-input,
.a-GV-columnItem .apex-item-datepicker-jet .oj-text-field-container:not(.oj-text-field-has-start-slot) .oj-text-field-input |
1px | |
.apex-item-wrapper--date-picker-jet .oj-text-field-container:not(.oj-text-field-has-start-slot) .oj-text-field-input,
.a-GV-columnItem .apex-item-datepicker-jet .oj-text-field-container:not(.oj-text-field-has-start-slot) .oj-text-field-input |
1px | |
.apex-item-wrapper--date-picker-jet .oj-datepicker-inline .oj-datepicker-content,
.a-GV-columnItem .apex-item-datepicker-jet .oj-datepicker-inline .oj-datepicker-content |
1px | |
.apex-item-wrapper--date-picker-jet .oj-datepicker-inline .oj-datepicker-content,
.a-GV-columnItem .apex-item-datepicker-jet .oj-datepicker-inline .oj-datepicker-content |
1px |
--ut-fs-total-margin
| Selector | Value | Color |
|---|---|---|
.a-FS-currentList .a-FS-currentItems:not(:empty) + .a-FS-totalArea,
.a-FS-currentList .a-FS-totalArea + .a-FS-currentItems:not(:empty) |
0.5rem | |
.a-FS-currentList .a-FS-currentItems:not(:empty) + .a-FS-totalArea,
.a-FS-currentList .a-FS-totalArea + .a-FS-currentItems:not(:empty) |
0.5rem |
--ut-fs-total-font-weight
| Selector | Value | Color |
|---|---|---|
.a-FS-totalArea |
500 |
--ut-focus-outline-offset
| Selector | Value | Color |
|---|---|---|
.a-FS-toggle |
2px |
--a-fs-toggle-background-color
| Selector | Value | Color |
|---|---|---|
.a-FS-toggle:hover |
var(--a-button-hover-background-color) | |
.a-FS-toggle:active |
var(--a-button-active-background-color) | |
.a-FS-toggle:focus |
var(--a-button-focus-background-color) |
--a-fs-toggle-text-color
| Selector | Value | Color |
|---|---|---|
.a-FS-toggle:hover |
var(--a-button-hover-text-color) | |
.a-FS-toggle:active |
var(--a-button-active-text-color) | |
.a-FS-toggle:focus |
var(--a-button-focus-text-color) |
--a-fs-toggle-border-color
| Selector | Value | Color |
|---|---|---|
.a-FS-toggle:hover |
var(--a-button-hover-border-color) | |
.a-FS-toggle:active |
var(--a-button-active-border-color) | |
.a-FS-toggle:focus |
var(--a-button-focus-border-color) |
--a-fs-toggle-shadow
| Selector | Value | Color |
|---|---|---|
.a-FS-toggle:hover |
var(--a-button-hover-shadow) | |
.a-FS-toggle:active |
var(--a-button-active-shadow) | |
.a-FS-toggle:focus |
var(--a-button-focus-shadow) |
--a-chip-input-font-size
| Selector | Value | Color |
|---|---|---|
.a-FS--smart |
var(--ut-xs-field-input-font-size) |
--a-chip-input-line-height
| Selector | Value | Color |
|---|---|---|
.a-FS--smart |
var(--ut-xs-field-input-line-height) |
--ut-cv-subtitle-margin
| Selector | Value | Color |
|---|---|---|
.a-CardView-subTitle:not(first-child) |
0.25rem 0 0 |
--ut-cv-subcontent-margin
| Selector | Value | Color |
|---|---|---|
.a-CardView-subContent |
0.75rem 0 0 |
--ut-searchresults-item-margin
| Selector | Value | Color |
|---|---|---|
.t-SearchResults-item |
1.5rem | |
.t-SearchResults-item |
1.5rem | |
.t-SearchResults-item:last-child |
0.75rem | |
.t-SearchResults-item:last-child |
0.75rem |
--ut-searchresults-item-title-font-weight
| Selector | Value | Color |
|---|---|---|
.t-SearchResults-title |
500 |
--ut-searchresults-item-title-font-size
| Selector | Value | Color |
|---|---|---|
.t-SearchResults-title |
1rem |
--ut-searchresults-item-title-line-height
| Selector | Value | Color |
|---|---|---|
.t-SearchResults-title |
1.25rem |
--ut-searchresults-item-info-margin
| Selector | Value | Color |
|---|---|---|
.t-SearchResults-info |
0.25rem | |
.t-SearchResults-info |
0.25rem | |
.t-SearchResults-desc |
0.25rem | |
.t-SearchResults-desc |
0.25rem | |
.t-SearchResults-misc |
0.25rem | |
.t-SearchResults-misc |
0.25rem |
--ut-searchresults-item-info-font-size
| Selector | Value | Color |
|---|---|---|
.t-SearchResults-info |
0.875rem |
--ut-searchresults-item-info-line-height
| Selector | Value | Color |
|---|---|---|
.t-SearchResults-info |
1.25rem |
--ut-searchresults-item-desc-text-color
| Selector | Value | Color |
|---|---|---|
.t-SearchResults-desc |
var(--ut-component-text-default-color) |
--ut-searchresults-item-date-text-color
| Selector | Value | Color |
|---|---|---|
.t-SearchResults-date |
var(--ut-component-text-muted-color) |
--ut-searchresults-item-misc-text-color
| Selector | Value | Color |
|---|---|---|
.t-SearchResults-misc |
var(--ut-component-text-muted-color) |
--ut-searchresults-item-misc-font-size
| Selector | Value | Color |
|---|---|---|
.t-SearchResults-misc |
0.75rem |
--ut-searchresults-item-misc-line-height
| Selector | Value | Color |
|---|---|---|
.t-SearchResults-misc |
1rem |
--ut-report-pagination-padding-y
| Selector | Value | Color |
|---|---|---|
.t-Report-pagination .pagination |
0.5rem | |
.t-Report-pagination .pagination |
0.5rem | |
.t-Report-pagination .pagination |
0.5rem | |
.t-Report-pagination .pagination |
0.5rem |
--ut-report-pagination-padding-x
| Selector | Value | Color |
|---|---|---|
.t-Report-pagination .pagination |
0.25rem | |
.t-Report-pagination .pagination |
0.25rem | |
.t-Report-pagination .pagination |
0.25rem | |
.t-Report-pagination .pagination |
0.25rem |
--ut-report-pagination-font-size
| Selector | Value | Color |
|---|---|---|
.t-Report-paginationText |
0.75rem |
--ut-report-pagination-line-height
| Selector | Value | Color |
|---|---|---|
.t-Report-paginationText |
1rem |
--ut-report-pagination-text-padding-y
| Selector | Value | Color |
|---|---|---|
.t-Report-paginationText |
0.25rem | |
.t-Report-paginationText |
0.25rem | |
.t-Report-paginationText |
0.25rem | |
.t-Report-paginationText |
0.25rem |
--ut-report-pagination-text-padding-x
| Selector | Value | Color |
|---|---|---|
.t-Report-paginationText |
0.5rem | |
.t-Report-paginationText |
0.5rem | |
.t-Report-paginationText |
0.5rem | |
.t-Report-paginationText |
0.5rem |
--ut-report-pagination-link-border-radius
| Selector | Value | Color |
|---|---|---|
.t-Report-paginationText a,
.t-Report-paginationText b,
.t-Report-paginationText strong |
0.125rem |
--ut-report-pagination-link-padding-y
| Selector | Value | Color |
|---|---|---|
.t-Report-paginationText a,
.t-Report-paginationText b,
.t-Report-paginationText strong |
0.25rem | |
.t-Report-paginationText a,
.t-Report-paginationText b,
.t-Report-paginationText strong |
0.25rem | |
.t-Report-paginationText a,
.t-Report-paginationText b,
.t-Report-paginationText strong |
0.25rem | |
.t-Report-paginationText a,
.t-Report-paginationText b,
.t-Report-paginationText strong |
0.25rem |
--ut-report-pagination-link-padding-x
| Selector | Value | Color |
|---|---|---|
.t-Report-paginationText a,
.t-Report-paginationText b,
.t-Report-paginationText strong |
0.5rem | |
.t-Report-paginationText a,
.t-Report-paginationText b,
.t-Report-paginationText strong |
0.5rem | |
.t-Report-paginationText a,
.t-Report-paginationText b,
.t-Report-paginationText strong |
0.5rem | |
.t-Report-paginationText a,
.t-Report-paginationText b,
.t-Report-paginationText strong |
0.5rem |
--ut-report-pagination-link-background-color
| Selector | Value | Color |
|---|---|---|
.t-Report-paginationText b,
.t-Report-paginationText strong,
.t-Report-paginationText a:hover |
var(--ut-report-pagination-link-hover-background-color, var(--ut-palette-primary)) |
--ut-report-pagination-link-text-color
| Selector | Value | Color |
|---|---|---|
.t-Report-paginationText b,
.t-Report-paginationText strong,
.t-Report-paginationText a:hover |
var(--ut-report-pagination-link-hover-text-color, var(--ut-palette-primary-contrast)) |
--ut-report-links-border-width
| Selector | Value | Color |
|---|---|---|
.t-Report-links |
1px | |
.t-Report--noBorders |
0 |
--ut-report-links-border-color
| Selector | Value | Color |
|---|---|---|
.t-Report-links |
var(--ut-component-inner-border-color) |
--ut-report-links-font-size
| Selector | Value | Color |
|---|---|---|
.t-Report-links |
0.75rem |
--ut-report-links-line-height
| Selector | Value | Color |
|---|---|---|
.t-Report-links |
1rem |
--ut-report-links-padding-y
| Selector | Value | Color |
|---|---|---|
.t-Report-links |
0.5rem | |
.t-Report-links |
0.5rem | |
.t-Report-links |
0.5rem | |
.t-Report-links |
0.5rem |
--ut-report-links-padding-x
| Selector | Value | Color |
|---|---|---|
.t-Report-links |
0.75rem | |
.t-Report-links |
0.75rem | |
.t-Report-links |
0.75rem | |
.t-Report-links |
0.75rem |
--ut-report-border-style
| Selector | Value | Color |
|---|---|---|
.t-Report-report |
solid | |
.t-Region--noPadding .t-Report--horizontalBorders,
.t-Report--inline |
hidden |
--ut-report-border-color
| Selector | Value | Color |
|---|---|---|
.t-Report-report |
var(--ut-component-inner-border-color) |
--ut-report-border-width
| Selector | Value | Color |
|---|---|---|
.t-Report-report |
1px | |
.t-Report--noBorders |
0 | |
.t-Region--noPadding .t-Report--horizontalBorders,
.t-Report--inline |
0 |
--ut-report-header-cell-font-size
| Selector | Value | Color |
|---|---|---|
.t-Report-colHead |
0.75rem |
--ut-report-header-cell-line-height
| Selector | Value | Color |
|---|---|---|
.t-Report-colHead |
1rem |
--ut-report-header-cell-padding-y
| Selector | Value | Color |
|---|---|---|
.t-Report-colHead |
0.75rem | |
.t-Report-colHead |
0.75rem | |
.t-Report-colHead |
0.75rem | |
.t-Report-colHead |
0.75rem |
--ut-report-header-cell-padding-x
| Selector | Value | Color |
|---|---|---|
.t-Report-colHead |
0.75rem | |
.t-Report-colHead |
0.75rem | |
.t-Report-colHead |
0.75rem | |
.t-Report-colHead |
0.75rem |
--ut-report-header-cell-font-weight
| Selector | Value | Color |
|---|---|---|
.t-Report-colHead |
700 |
--ut-report-header-cell-background-color
| Selector | Value | Color |
|---|---|---|
.t-Report-colHead |
var(--a-gv-header-background-color) |
--ut-report-header-cell-border-width
| Selector | Value | Color |
|---|---|---|
.t-Report-colHead |
1px | |
.t-Report--noBorders |
0 |
--ut-report-header-cell-border-color
| Selector | Value | Color |
|---|---|---|
.t-Report-colHead |
var(--ut-component-inner-border-color) |
--ut-report-cell-font-size
| Selector | Value | Color |
|---|---|---|
.t-Report-cell |
0.75rem |
--ut-report-cell-line-height
| Selector | Value | Color |
|---|---|---|
.t-Report-cell |
1rem |
--ut-report-cell-padding-y
| Selector | Value | Color |
|---|---|---|
.t-Report-cell |
0.5rem | |
.t-Report-cell |
0.5rem | |
.t-Report-cell |
0.5rem | |
.t-Report-cell |
0.5rem |
--ut-report-cell-padding-x
| Selector | Value | Color |
|---|---|---|
.t-Report-cell |
0.75rem | |
.t-Report-cell |
0.75rem | |
.t-Report-cell |
0.75rem | |
.t-Report-cell |
0.75rem |
--ut-report-cell-border-width
| Selector | Value | Color |
|---|---|---|
.t-Report-cell |
1px | |
.t-Report--noBorders |
0 | |
.t-Region--noPadding .t-Report--horizontalBorders .t-Report-links,
.t-Report--inline .t-Report-links |
1px |
--ut-report-cell-border-color
| Selector | Value | Color |
|---|---|---|
.t-Report-cell |
var(--ut-component-inner-border-color) |
--ut-report-cell-background-color
| Selector | Value | Color |
|---|---|---|
.t-Report-cell |
transparent | |
.t-Report--staticRowColors .t-Report-report tr:nth-child(odd) |
transparent | |
.t-Report--altRowsDefault .t-Report-report tr:nth-child(odd) |
var(--ut-report-cell-alt-background-color) | |
.t-Report--rowHighlight .t-Report-report tr:hover |
var(--ut-report-cell-hover-background-color) | |
.u-Report td |
var(--ut-component-background-color) |
--ut-report-header-background-color
| Selector | Value | Color |
|---|---|---|
.u-Report .u-Report-header,
.u-Report th |
var(--a-gv-header-background-color) |
--ut-report-header-text-color
| Selector | Value | Color |
|---|---|---|
.u-Report .u-Report-header,
.u-Report th |
var(--a-gv-header-text-color) |
--ut-report-cell-text-color
| Selector | Value | Color |
|---|---|---|
.u-Report td |
var(--a-gv-text-color) |
--ut-report-cell-stripe-background-color
| Selector | Value | Color |
|---|---|---|
.a-Table.u-Report.table-stripe tr:nth-child(even) td,
.a-Table.u-Report.table-stripe tr:nth-child(even) th[scope=row] |
var(--ut-component-highlight-background-color) |
--ut-configpanel-font-size
| Selector | Value | Color |
|---|---|---|
.t-ConfigPanel |
0.875rem |
--ut-configpanel-line-height
| Selector | Value | Color |
|---|---|---|
.t-ConfigPanel |
1.25rem |
--ut-configpanel-border-width
| Selector | Value | Color |
|---|---|---|
.t-ConfigPanel |
1px | |
.t-ConfigPanel-about |
1px | |
.t-ConfigPanel-main |
1px | |
.t-ConfigPanel-main |
1px | |
.u-RTL .t-ConfigPanel-main |
1px |
--ut-configpanel-border-color
| Selector | Value | Color |
|---|---|---|
.t-ConfigPanel |
rgba(0, 0, 0, 0.1) | |
.t-ConfigPanel-about |
rgba(0, 0, 0, 0.1) | |
.t-ConfigPanel-main |
rgba(0, 0, 0, 0.1) |
--ut-configpanel-padding
| Selector | Value | Color |
|---|---|---|
.t-ConfigPanel-about |
0.75rem | |
.t-ConfigPanel-main,
.t-ConfigPanel-list |
0.75rem | |
.t-ConfigPanel-icon |
0.75rem | |
.t-ConfigPanel-icon |
0.75rem | |
.t-ConfigPanel-actions |
0.75rem | |
.t-ConfigPanel-actions |
0.75rem | |
.t-ConfigPanel-attrLabel |
0.75rem | |
.t-ConfigPanel-attrLabel |
0.75rem |
--ut-configpanel-icon-border-radius
| Selector | Value | Color |
|---|---|---|
.t-ConfigPanel-icon |
100% |
--ut-configpanel-icon-background-color
| Selector | Value | Color |
|---|---|---|
.t-ConfigPanel-icon.is-enabled |
var(--ut-palette-success) | |
.t-ConfigPanel-icon.is-disabled |
var(--ut-palette-danger) |
--ut-configpanel-icon-text-color
| Selector | Value | Color |
|---|---|---|
.t-ConfigPanel-icon.is-enabled |
var(--ut-palette-success-contrast) | |
.t-ConfigPanel-icon.is-disabled |
var(--ut-palette-danger-contrast) |
--ut-configpanel-attr-border-width
| Selector | Value | Color |
|---|---|---|
.t-ConfigPanel-attr |
1px | |
.t-ConfigPanel-attr:last-child |
0 |
--ut-configpanel-attr-border-color
| Selector | Value | Color |
|---|---|---|
.t-ConfigPanel-attr |
rgba(0, 0, 0, 0.05) |
--ut-configpanel-attr-padding
| Selector | Value | Color |
|---|---|---|
.t-ConfigPanel-attrLink |
0.875rem 0.75rem |
--ut-configpanel-attr-background-color
| Selector | Value | Color |
|---|---|---|
.t-ConfigPanel-attrLink:hover |
var(--ut-configpanel-attr-hover-background-color, rgba(0, 0, 0, 0.05)) |
--ut-configpanel-attr-value-text-color
| Selector | Value | Color |
|---|---|---|
.t-ConfigPanel-attrValue |
var(--ut-link-text-color) |
--ut-statuslist-block-header-font-size
| Selector | Value | Color |
|---|---|---|
.t-StatusList-blockHeader |
1rem |
--ut-statuslist-block-header-line-height
| Selector | Value | Color |
|---|---|---|
.t-StatusList-blockHeader |
1.125rem |
--ut-statuslist-block-header-font-weight
| Selector | Value | Color |
|---|---|---|
.t-StatusList-blockHeader |
400 |
--ut-statuslist-block-header-padding
| Selector | Value | Color |
|---|---|---|
.t-StatusList-blockHeader |
0.75rem | |
.t-StatusList-headerTextAlt |
0.75rem | |
.t-StatusList-headerTextAlt |
0.75rem |
--ut-statuslist-border-width
| Selector | Value | Color |
|---|---|---|
.t-StatusList-blockHeader |
var(--ut-component-border-width) | |
.t-StatusList-blockHeader |
var(--ut-component-border-width) |
--ut-statuslist-border-color
| Selector | Value | Color |
|---|---|---|
.t-StatusList-blockHeader |
var(--ut-component-border-color) |
--ut-statuslist-block-header-background-color
| Selector | Value | Color |
|---|---|---|
.t-StatusList-blockHeader |
var(--ut-component-background-color) |
--ut-statuslist-item-padding
| Selector | Value | Color |
|---|---|---|
.t-StatusList-item |
0.5rem |
--ut-statuslist-item-marker-margin-x
| Selector | Value | Color |
|---|---|---|
.t-StatusList-itemMarker |
0.25rem | |
.t-StatusList-itemMarker |
0.25rem |
--ut-statuslist-marker-text-color
| Selector | Value | Color |
|---|---|---|
.t-StatusList-marker |
var(--ut-component-text-muted-color) |
--ut-statuslist-item-title-margin-y
| Selector | Value | Color |
|---|---|---|
.t-StatusList-itemTitle |
0.25rem | |
.t-StatusList-itemTitle |
0.25rem | |
.t-StatusList-itemTitle |
0.25rem | |
.t-StatusList-itemTitle |
0.25rem |
--ut-statuslist-item-title-font-size
| Selector | Value | Color |
|---|---|---|
.t-StatusList-itemTitle |
1rem |
--ut-statuslist-item-title-line-height
| Selector | Value | Color |
|---|---|---|
.t-StatusList-itemTitle |
1.5rem |
--ut-statuslist-item-title-text-color
| Selector | Value | Color |
|---|---|---|
.t-StatusList-itemTitle |
var(--ut-component-text-title-color) |
--ut-statuslist-item-icon-size
| Selector | Value | Color |
|---|---|---|
.t-StatusList-itemIcon |
1.5rem | |
.t-StatusList-itemIcon |
1.5rem |
--ut-statuslist-item-icon-padding
| Selector | Value | Color |
|---|---|---|
.t-StatusList-itemIcon |
0.25rem |
--ut-statuslist-item-icon-border-radius
| Selector | Value | Color |
|---|---|---|
.t-StatusList-itemIcon |
1.5rem |
--ut-statuslist-item-icon-margin-x
| Selector | Value | Color |
|---|---|---|
.t-StatusList-itemIcon |
0.5rem | |
.t-StatusList-itemIcon |
0.5rem |
--ut-statuslist-item-icon-color
| Selector | Value | Color |
|---|---|---|
.t-StatusList-itemIcon |
rgba(0, 0, 0, 0.4) |
--ut-statuslist-item-icon-box-shadow
| Selector | Value | Color |
|---|---|---|
.t-StatusList-itemIcon |
0 0 0 1px rgba(0, 0, 0, 0.2) inset |
--ut-statuslist-item-icon-background-color
| Selector | Value | Color |
|---|---|---|
.t-StatusList-itemIcon |
#FFF |
--ut-statuslist-item-attr-font-size
| Selector | Value | Color |
|---|---|---|
.t-StatusList-attr |
0.6875rem |
--ut-statuslist-item-attr-line-height
| Selector | Value | Color |
|---|---|---|
.t-StatusList-attr |
0.875rem |
--ut-statuslist-item-attr-margin-x
| Selector | Value | Color |
|---|---|---|
.t-StatusList-attr |
1rem | |
.t-StatusList-attr |
1rem |
--ut-statuslist-item-desc-font-size
| Selector | Value | Color |
|---|---|---|
.t-StatusList-textDesc,
p.t-StatusList-textDesc |
0.875rem |
--ut-statuslist-item-desc-line-height
| Selector | Value | Color |
|---|---|---|
.t-StatusList-textDesc,
p.t-StatusList-textDesc |
1.25rem |
--ut-statuslist-item-desc-margin-y
| Selector | Value | Color |
|---|---|---|
.t-StatusList-textDesc,
p.t-StatusList-textDesc |
0.5rem | |
.t-StatusList-textDesc,
p.t-StatusList-textDesc |
0.5rem |
--ut-statuslist-item-desc-text-color
| Selector | Value | Color |
|---|---|---|
.t-StatusList-textDesc,
p.t-StatusList-textDesc |
var(--ut-component-text-muted-color) |
--ut-statuslist-marker-size
| Selector | Value | Color |
|---|---|---|
.t-StatusList--dates |
1.5rem | |
.t-StatusList--bullets |
1rem |
--ut-statuslist-marker-font-size
| Selector | Value | Color |
|---|---|---|
.t-StatusList--dates |
.75rem | |
.t-StatusList--bullets |
0 |
--ut-statuslist-marker-border-radius
| Selector | Value | Color |
|---|---|---|
.t-StatusList--dates |
.125rem | |
.t-StatusList--dates .t-StatusList-marker:after |
0.125rem | |
.t-StatusList--dates .t-StatusList-marker:after |
0.125rem | |
.t-StatusList--bullets |
1rem |
--ut-statuslist-marker-margin-y
| Selector | Value | Color |
|---|---|---|
.t-StatusList--dates |
.25rem | |
.t-StatusList--bullets |
.5rem |
--ut-statuslist-marker-margin-x
| Selector | Value | Color |
|---|---|---|
.t-StatusList--dates |
.25rem | |
.t-StatusList--bullets |
.5rem |
--ut-statuslist-marker-cal-height
| Selector | Value | Color |
|---|---|---|
.t-StatusList--dates .t-StatusList-marker |
0.25rem | |
.t-StatusList--dates .t-StatusList-marker |
0.25rem | |
.t-StatusList--dates .t-StatusList-marker:after |
0.25rem |
--ut-statuslist-marker-cal-background-color
| Selector | Value | Color |
|---|---|---|
.t-StatusList--dates .t-StatusList-marker:after |
rgba(0, 0, 0, 0.2) |
--ut-statuslist-marker-line-height
| Selector | Value | Color |
|---|---|---|
.t-StatusList--bullets |
1rem |
--ut-statuslist-marker-border-width
| Selector | Value | Color |
|---|---|---|
.t-StatusList--bullets .t-StatusList-item.is-complete,
.t-StatusList--bullets .t-StatusList-item.is-danger,
.t-StatusList--bullets .t-StatusList-item.is-open,
.t-StatusList--bullets .t-StatusList-item.is-warning,
.t-StatusList--bullets .t-StatusList-item.is-null |
0 |
--a-iconlist-item-border-radius
| Selector | Value | Color |
|---|---|---|
.a-PopupLOV-results |
0rem |
--a-iconlist-item-padding-y
| Selector | Value | Color |
|---|---|---|
.a-PopupLOV-results |
var(--a-menu-item-generic-padding-y, .5rem) |
--a-iconlist-item-padding-x
| Selector | Value | Color |
|---|---|---|
.a-PopupLOV-results |
var(--a-menu-item-generic-padding-x, .5rem) |
--ut-popuplov-background-color
| Selector | Value | Color |
|---|---|---|
.t-Page--popupLOV |
#fff |
--ut-popuplov-actions-padding-y
| Selector | Value | Color |
|---|---|---|
.t-PopupLOV-actions |
0.5r |
--ut-popuplov-actions-background-color
| Selector | Value | Color |
|---|---|---|
.t-PopupLOV-actions |
var(--a-toolbar-background-color) |
--ut-popuplov-actions-border-width
| Selector | Value | Color |
|---|---|---|
.t-PopupLOV-actions |
1px |
--ut-popuplov-actions-border-color
| Selector | Value | Color |
|---|---|---|
.t-PopupLOV-actions |
var(--a-toolbar-border-color) |
--ut-popuplov-actions-padding-x
| Selector | Value | Color |
|---|---|---|
.t-PopupLOV-actions .u-pullRight |
0.5rem | |
.t-PopupLOV-actions .u-pullRight |
0.5rem |
--ut-popuplov-item-padding-y
| Selector | Value | Color |
|---|---|---|
.t-PopupLOV-links a |
0.5re |
--ut-popuplov-item-border-width
| Selector | Value | Color |
|---|---|---|
.t-PopupLOV-links a |
1px | |
.t-PopupLOV-links a:last-child |
0 |
--ut-popuplov-item-border-color
| Selector | Value | Color |
|---|---|---|
.t-PopupLOV-links a |
var(--ut-component-inner-border-color) |
--ut-popuplov-item-font-size
| Selector | Value | Color |
|---|---|---|
.t-PopupLOV-links a |
0.75rem |
--ut-popuplov-item-line-height
| Selector | Value | Color |
|---|---|---|
.t-PopupLOV-links a |
1rem |
--ut-popuplov-item-background-color
| Selector | Value | Color |
|---|---|---|
.t-PopupLOV-links a:hover |
var(--a-menu-focused-background-color) |
--ut-popuplov-item-text-color
| Selector | Value | Color |
|---|---|---|
.t-PopupLOV-links a:hover |
var(--a-menu-focused-text-color) |
--ut-contextualinfo-margin-x
| Selector | Value | Color |
|---|---|---|
.t-ContextualInfo-item |
1rem | |
.t-ContextualInfo-item |
1rem | |
.t-ContextualInfo-label--stacked |
var(--ut-contextualinfo-item-label-stacked-margin-x) |
--ut-contextualinfo-margin-y
| Selector | Value | Color |
|---|---|---|
.t-ContextualInfo-item |
1rem | |
.t-ContextualInfo-item |
1rem | |
.t-ContextualInfo-label--stacked |
var(--ut-contextualinfo-item-label-stacked-margin-y) |
--ut-contextualinfo-label-font-size
| Selector | Value | Color |
|---|---|---|
.t-ContextualInfo-label |
0.875rem | |
.t-ContextualInfo-label--stacked |
var(--ut-contextualinfo-item-label-stacked-font-size) |
--ut-contextualinfo-label-line-height
| Selector | Value | Color |
|---|---|---|
.t-ContextualInfo-label |
1rem | |
.t-ContextualInfo-label--stacked |
var(--ut-contextualinfo-item-label-stacked-line-height) |
--ut-contextualinfo-label-text-color
| Selector | Value | Color |
|---|---|---|
.t-ContextualInfo-label |
var(--ut-component-text-muted-color) |
--ut-contextualinfo-value-font-size
| Selector | Value | Color |
|---|---|---|
.t-ContextualInfo-value |
0.875rem | |
.t-ContextualInfo-label--stacked |
var(--ut-contextualinfo-item-value-stacked-font-size) |
--ut-contextualinfo-value-line-height
| Selector | Value | Color |
|---|---|---|
.t-ContextualInfo-value |
1rem | |
.t-ContextualInfo-label--stacked |
var(--ut-contextualinfo-item-value-stacked-line-height) |
--ut-contextualinfo-value-text-color
| Selector | Value | Color |
|---|---|---|
.t-ContextualInfo-value |
var(--ut-component-text-default-color) |
--ut-contextualinfo-label-margin-x
| Selector | Value | Color |
|---|---|---|
.t-ContextualInfo-label--stacked .t-ContextualInfo-label |
0.25rem | |
.t-ContextualInfo-label--stacked .t-ContextualInfo-label |
0.25rem |
--ut-contextualinfo-border-color
| Selector | Value | Color |
|---|---|---|
.t-ContextualInfo + .t-Report-pagination |
var(--ut-component-border-color) |
--ut-contextualinfo-border-width
| Selector | Value | Color |
|---|---|---|
.t-ContextualInfo + .t-Report-pagination |
1px |
--ut-image-region-border-radius
| Selector | Value | Color |
|---|---|---|
.t-ImageRegion--rounded |
0.5rem |
--a-field-input-line-height
| Selector | Value | Color |
|---|---|---|
.t-Form-fieldContainer |
var(--ut-xs-field-input-line-height) | |
.t-Form-fieldContainer--floatingLabel .apex-item-display-only |
1rem | |
.apex-item-display-only |
1rem | |
.apex-item-text,
.apex-item-select,
.apex-item-textarea,
.u-TF-item--text,
.u-TF-item--select,
select.listmanager,
select.group_selectlist,
.apex-item-multi,
.datetimepicker_newMonth |
1rem | |
.apex-item-file--native |
1rem | |
.apex-item-wrapper--date-picker-jet .oj-text-field-input,
.a-GV-columnItem .apex-item-datepicker-jet .oj-text-field-input |
1rem |
--ut-field-label-padding-y
| Selector | Value | Color |
|---|---|---|
.t-Form-label |
0.25rem | |
.t-Form-label |
0.25rem | |
.t-Form-label |
0.25rem | |
.t-Form-label |
0.25rem |
--ut-field-label-line-height
| Selector | Value | Color |
|---|---|---|
.t-Form-label |
1rem | |
.t-Form-fieldContainer--floatingLabel |
var(--ut-field-fl-label-line-height, 1.25rem) |
--ut-field-label-font-size
| Selector | Value | Color |
|---|---|---|
.t-Form-label |
0.75rem | |
.t-Form-fieldContainer--floatingLabel |
.875rem |
--a-form-required-asterisk-text-color
| Selector | Value | Color |
|---|---|---|
.t-Form-fieldContainer.is-required .t-Form-label:before, .t-Form-fieldContainer.is-required .t-Form-label:after |
red | |
.t-Form-fieldContainer--floatingLabel.is-required .t-Form-itemRequired-marker:before |
re | |
.u-RTL .t-Form-fieldContainer--floatingLabel.is-required .t-Form-itemRequired-marker:before |
red transparent transpare | |
.apex-item-wrapper--single-checkbox.is-required .apex-item-single-checkbox:after |
red |
--ut-field-item-min-height
| Selector | Value | Color |
|---|---|---|
.t-Form-itemWrapper |
0.25rem * |
--ut-field-inline-help-line-height
| Selector | Value | Color |
|---|---|---|
.t-Form-inlineHelp |
1rem | |
.apex-item-wrapper--date-picker-jet .oj-helphints-inline-container,
.apex-item-wrapper--date-picker-jet .oj-user-assistance-inline-container,
.apex-item-wrapper--date-picker-jet .oj-user-assistance-inline-container .oj-message-detail,
.a-GV-columnItem .apex-item-datepicker-jet .oj-helphints-inline-container,
.a-GV-columnItem .apex-item-datepicker-jet .oj-user-assistance-inline-container,
.a-GV-columnItem .apex-item-datepicker-jet .oj-user-assistance-inline-container .oj-message-detail |
1rem |
--ut-field-inline-help-font-size
| Selector | Value | Color |
|---|---|---|
.t-Form-inlineHelp |
0.6875rem |
--ut-field-inline-help-spacing
| Selector | Value | Color |
|---|---|---|
.t-Form-inlineHelp |
0.25rem | |
.t-Form-inlineHelp |
0.25rem | |
.apex-item-wrapper--date-picker-jet .oj-helphints-inline-container,
.apex-item-wrapper--date-picker-jet .oj-user-assistance-inline-container,
.apex-item-wrapper--date-picker-jet .oj-user-assistance-inline-container .oj-message-detail,
.a-GV-columnItem .apex-item-datepicker-jet .oj-helphints-inline-container,
.a-GV-columnItem .apex-item-datepicker-jet .oj-user-assistance-inline-container,
.a-GV-columnItem .apex-item-datepicker-jet .oj-user-assistance-inline-container .oj-message-detail |
0.25rem | |
.apex-item-wrapper--date-picker-jet .oj-helphints-inline-container,
.apex-item-wrapper--date-picker-jet .oj-user-assistance-inline-container,
.apex-item-wrapper--date-picker-jet .oj-user-assistance-inline-container .oj-message-detail,
.a-GV-columnItem .apex-item-datepicker-jet .oj-helphints-inline-container,
.a-GV-columnItem .apex-item-datepicker-jet .oj-user-assistance-inline-container,
.a-GV-columnItem .apex-item-datepicker-jet .oj-user-assistance-inline-container .oj-message-detail |
0.25rem |
--ut-prepost-border-radius
| Selector | Value | Color |
|---|---|---|
.t-Form-fieldContainer--preTextBlock |
var(--a-field-input-border-radius) | |
.t-Form-fieldContainer--postTextBlock |
var(--a-field-input-border-radius) |
--ut-prepost-background-color
| Selector | Value | Color |
|---|---|---|
.t-Form-fieldContainer--preTextBlock .t-Form-itemText--pre |
var(--a-field-input-background-color) | |
.t-Form-fieldContainer--postTextBlock .t-Form-itemText--post |
var(--a-field-input-background-color) | |
.apex-item-wrapper--checkbox,
.apex-item-wrapper--radiogroup,
.apex-item-wrapper--single-checkbox,
.apex-item-wrapper--yes-no,
.apex-item-wrapper--display-only,
.apex-item-wrapper--shuttle,
.apex-item-wrapper--list-manager,
.apex-item-wrapper--geocoded-address |
transparent |
--a-field-input-border-width
| Selector | Value | Color |
|---|---|---|
.t-Form-fieldContainer--preTextBlock .t-Form-itemText--pre |
var(--a-field-input-border-color | |
.u-RTL .t-Form-fieldContainer--preTextBlock .t-Form-itemText--pre |
1px | |
.t-Form-fieldContainer--postTextBlock .t-Form-itemText--post |
var(--a-field-input-border-color | |
.u-RTL .t-Form-fieldContainer--postTextBlock .t-Form-itemText--post |
1px | |
.t-Form-fieldContainer--floatingLabel .apex-item-display-only |
1px | |
.apex-item-text,
.apex-item-select,
.apex-item-textarea,
.u-TF-item--text,
.u-TF-item--select,
select.listmanager,
select.group_selectlist,
.apex-item-multi,
.datetimepicker_newMonth |
1px |
--a-field-input-border-radius
| Selector | Value | Color |
|---|---|---|
.t-Form-fieldContainer--preTextBlock .t-Form-inputContainer |
0 var(--ut-prepost-border-radius) var(--ut-prepost-border-radius) 0 | |
.u-RTL .t-Form-fieldContainer--preTextBlock .t-Form-inputContainer |
var(--ut-prepost-border-radius) 0 0 var(--ut-prepost-border-radius) | |
.t-Form-fieldContainer--postTextBlock .t-Form-inputContainer |
var(--ut-prepost-border-radius) 0 0 var(--ut-prepost-border-radius) | |
.u-RTL .t-Form-fieldContainer--postTextBlock .t-Form-inputContainer |
0 var(--ut-prepost-border-radius) var(--ut-prepost-border-radius) 0 | |
.t-Form-fieldContainer--preTextBlock.t-Form-fieldContainer--postTextBlock .t-Form-inputContainer |
0 | |
.t-Form-fieldContainer--floatingLabel.is-required .t-Form-itemRequired-marker:before |
0.125rem | |
.u-RTL .t-Form-fieldContainer--floatingLabel.is-required .t-Form-itemRequired-marker:before |
0.125rem | |
.t-Form-fieldContainer--floatingLabel.apex-item-wrapper--has-icon .apex-item-icon |
0.125re | |
.t-Form-fieldContainer--floatingLabel .apex-item-display-only |
0.125rem | |
.t-Form-fieldContainer--floatingLabel.apex-item-wrapper--textarea.js-show-label .t-Form-label:before, .t-Form-fieldContainer--floatingLabel.apex-item-wrapper--textarea.is-active .t-Form-label:before |
0.125rem | |
.apex-item-text,
.apex-item-select,
.apex-item-textarea,
.u-TF-item--text,
.u-TF-item--select,
select.listmanager,
select.group_selectlist,
.apex-item-multi,
.datetimepicker_newMonth |
0.125rem | |
.a-GeoCoder-map |
0.125rem | |
.apex-item-wrapper--rich-text-editor .cke_chrome |
var(--ut-component-border-radius) |
--ut-prepost-border-color
| Selector | Value | Color |
|---|---|---|
.apex-item-wrapper--checkbox,
.apex-item-wrapper--radiogroup,
.apex-item-wrapper--single-checkbox,
.apex-item-wrapper--yes-no,
.apex-item-wrapper--display-only,
.apex-item-wrapper--shuttle,
.apex-item-wrapper--list-manager,
.apex-item-wrapper--geocoded-address |
transparent |
--ut-field-error-font-size
| Selector | Value | Color |
|---|---|---|
.a-Form-error,
.t-Form-error |
0.6875rem |
--ut-field-error-line-height
| Selector | Value | Color |
|---|---|---|
.a-Form-error,
.t-Form-error |
1rem |
--ut-field-error-margin-y
| Selector | Value | Color |
|---|---|---|
.a-Form-error,
.t-Form-error |
0.25rem | |
.a-Form-error,
.t-Form-error |
0.25rem |
--ut-field-required-margin-y
| Selector | Value | Color |
|---|---|---|
.t-Form-itemRequired |
0.25rem | |
.t-Form-itemRequired |
0.25rem |
--ut-field-required-font-size
| Selector | Value | Color |
|---|---|---|
.t-Form-itemRequired |
0.6875rem |
--ut-field-required-line-height
| Selector | Value | Color |
|---|---|---|
.t-Form-itemRequired |
1rem |
--ut-field-required-text-color
| Selector | Value | Color |
|---|---|---|
.t-Form-itemRequired |
var(--ut-component-text-muted-color) |
--ut-smart-filter-max-width
| Selector | Value | Color |
|---|---|---|
.t-Form--stretchInputs |
100% |
--ut-field-fixed-min-width
| Selector | Value | Color |
|---|---|---|
.t-Form--fixedLabels .t-Form-labelContainer |
10rem |
--a-field-input-padding-y
| Selector | Value | Color |
|---|---|---|
.t-Form-fieldContainer--floatingLabel |
.375rem | |
.t-Form-fieldContainer--floatingLabel .t-Form-label |
0.25rem | |
.t-Form-fieldContainer--floatingLabel .t-Form-label |
0.25rem | |
.apex-item-multi .apex-item-popup-lov |
0rem | |
.apex-item-wrapper--date-picker-jet .oj-datepicker-inline + .oj-inputdatetime-time-only,
.a-GV-columnItem .apex-item-datepicker-jet .oj-datepicker-inline + .oj-inputdatetime-time-only |
0.25rem | |
.apex-item-wrapper--date-picker-jet .oj-datepicker-inline + .oj-inputdatetime-time-only,
.a-GV-columnItem .apex-item-datepicker-jet .oj-datepicker-inline + .oj-inputdatetime-time-only |
0.25rem |
--a-field-input-width
| Selector | Value | Color |
|---|---|---|
.t-Form-fieldContainer--floatingLabel |
100% | |
.apex-item-wrapper--date-picker-jet .oj-text-field,
.a-GV-columnItem .apex-item-datepicker-jet .oj-text-field |
auto |
--ut-field-fl-label-line-height
| Selector | Value | Color |
|---|---|---|
.t-Form-fieldContainer--floatingLabel |
1.25rem |
--ut-field-fl-label-font-size
| Selector | Value | Color |
|---|---|---|
.t-Form-fieldContainer--floatingLabel |
.6875rem | |
.t-Form-fieldContainer--floatingLabel.is-active .t-Form-label, .t-Form-fieldContainer--floatingLabel.js-show-label .t-Form-label, .t-Form-fieldContainer--floatingLabel:focus-within .t-Form-label, .t-Form-fieldContainer--floatingLabel.apex-item-wrapper--display-only .t-Form-label, .t-Form-fieldContainer--floatingLabel.apex-item-wrapper--display-image .t-Form-label, .t-Form-fieldContainer--floatingLabel.apex-item-wrapper--baseline .t-Form-label, .t-Form-fieldContainer--floatingLabel.apex-item-wrapper--yes-no .t-Form-label, .t-Form-fieldContainer--floatingLabel.apex-item-wrapper--checkbox .t-Form-label, .t-Form-fieldContainer--floatingLabel.apex-item-wrapper--radiogroup .t-Form-label, .t-Form-fieldContainer--floatingLabel.apex-item-wrapper--shuttle .t-Form-label, .t-Form-fieldContainer--floatingLabel.apex-item-wrapper--file .t-Form-label, .t-Form-fieldContainer--floatingLabel.apex-item-wrapper--rich-text-editor .t-Form-label, .t-Form-fieldContainer--floatingLabel.apex-item-wrapper--star-rating .t-Form-label, .t-Form-fieldContainer--floatingLabel.apex-item-wrapper--geocoded-address .t-Form-label, .t-Form-fieldContainer--floatingLabel.apex-item-wrapper--display-map .t-Form-label, .t-Form-fieldContainer--floatingLabel.apex-item-wrapper--mdeditor .t-Form-label, .t-Form-fieldContainer--floatingLabel.apex-item-wrapper--markdown-editor .t-Form-label, .t-Form-fieldContainer--floatingLabel.apex-item-wrapper--pct-graph .t-Form-label, .t-Form-fieldContainer--floatingLabel.apex-item-wrapper--color-picker .t-Form-label, .t-Form-fieldContainer--floatingLabel.apex-item-wrapper--date-picker-html5 .t-Form-label, .t-Form-fieldContainer--floatingLabel.apex-item-wrapper--date-picker-jet .t-Form-label, .t-Form-fieldContainer--floatingLabel.apex-item-wrapper--date-picker-apex-inline .t-Form-label |
0.875rem |
--ut-field-label-offset
| Selector | Value | Color |
|---|---|---|
.t-Form-fieldContainer--floatingLabel |
calc(var(--a-field-input-line-height, 1rem) + var(--a-field-input-padding-y, .25rem) + var(--a-field-input-padding-y, .25rem) + var(--ut-field-fl-label-line-height, 1.25rem)) |
--ut-field-label-cursor
| Selector | Value | Color |
|---|---|---|
.t-Form-fieldContainer--floatingLabel .t-Form-label |
pointer |
--ut-field-label-padding-x-offset
| Selector | Value | Color |
|---|---|---|
.t-Form-fieldContainer--floatingLabel .t-Form-label |
0.25rem | |
.t-Form-fieldContainer--floatingLabel .t-Form-label |
0.25rem | |
.t-Form-fieldContainer--floatingLabel.apex-item-wrapper--has-icon |
calc(var(--ut-field-input-icon-offset, 1.5rem) + var(--a-field-input-padding-x, .25rem)) | |
.t-Form-fieldContainer--floatingLabel.apex-item-wrapper--color-picker |
var(--ut-field-input-icon-offset, 1.5rem) | |
.t-Form-fieldContainer--floatingLabel.apex-item-wrapper--select-list .t-Form-label, .t-Form-fieldContainer--floatingLabel.apex-item-wrapper--popup-lov .t-Form-label |
4px | |
.t-Form-fieldContainer--floatingLabel.apex-item-wrapper--select-list .t-Form-label, .t-Form-fieldContainer--floatingLabel.apex-item-wrapper--popup-lov .t-Form-label |
4px |
--a-field-input-state-background-color
| Selector | Value | Color |
|---|---|---|
.t-Form-fieldContainer--floatingLabel.is-active, .t-Form-fieldContainer--floatingLabel:focus-within |
var(--a-field-input-focus-background-color) | |
.t-Form-fieldContainer--floatingLabel.apex-item-wrapper--textarea.js-show-label .t-Form-label:before, .t-Form-fieldContainer--floatingLabel.apex-item-wrapper--textarea.is-active .t-Form-label:before |
var(--a-field-input-background-color) | |
.t-Form-fieldContainer--floatingLabel.apex-item-wrapper--textarea:hover .t-Form-label:before |
var(--a-field-input-hover-background-color) | |
.t-Form-fieldContainer--floatingLabel.apex-item-wrapper--textarea:focus-within .t-Form-label:before |
var(--a-field-input-focus-background-color) | |
.apex-item-text,
.apex-item-select,
.apex-item-textarea,
.u-TF-item--text,
.u-TF-item--select,
select.listmanager,
select.group_selectlist,
.apex-item-multi,
.datetimepicker_newMonth |
var(--a-field-input-background-color) | |
.apex-item-text:hover,
.apex-item-select:hover,
.apex-item-textarea:hover,
.u-TF-item--text:hover,
.u-TF-item--select:hover,
select.listmanager:hover,
select.group_selectlist:hover,
.apex-item-multi:hover,
.datetimepicker_newMonth:hover |
var(--a-field-input-hover-background-color) | |
.apex-item-text:focus, .apex-item-text:focus-within,
.apex-item-select:focus,
.apex-item-select:focus-within,
.apex-item-textarea:focus,
.apex-item-textarea:focus-within,
.u-TF-item--text:focus,
.u-TF-item--text:focus-within,
.u-TF-item--select:focus,
.u-TF-item--select:focus-within,
select.listmanager:focus,
select.listmanager:focus-within,
select.group_selectlist:focus,
select.group_selectlist:focus-within,
.apex-item-multi:focus,
.apex-item-multi:focus-within,
.datetimepicker_newMonth:focus,
.datetimepicker_newMonth:focus-within |
var(--a-field-input-focus-background-color) | |
.apex-item-wrapper--date-picker-jet .oj-text-field:hover .oj-text-field-container,
.a-GV-columnItem .apex-item-datepicker-jet .oj-text-field:hover .oj-text-field-container |
var(--a-field-input-hover-background-color) | |
.apex-item-wrapper--date-picker-jet .oj-text-field.oj-focus .oj-text-field-container,
.a-GV-columnItem .apex-item-datepicker-jet .oj-text-field.oj-focus .oj-text-field-container |
var(--a-field-input-focus-background-color) | |
body .ck.ck-input-text,
body .ck.ck-editor__main > .ck-editor__editable |
var(--a-field-input-background-color) |
--a-field-input-state-border-color
| Selector | Value | Color |
|---|---|---|
.t-Form-fieldContainer--floatingLabel.is-active, .t-Form-fieldContainer--floatingLabel:focus-within |
var(--a-field-input-focus-border-color) | |
.apex-item-text,
.apex-item-select,
.apex-item-textarea,
.u-TF-item--text,
.u-TF-item--select,
select.listmanager,
select.group_selectlist,
.apex-item-multi,
.datetimepicker_newMonth |
var(--a-field-input-border-color) | |
.apex-item-text:hover,
.apex-item-select:hover,
.apex-item-textarea:hover,
.u-TF-item--text:hover,
.u-TF-item--select:hover,
select.listmanager:hover,
select.group_selectlist:hover,
.apex-item-multi:hover,
.datetimepicker_newMonth:hover |
var(--a-field-input-hover-border-color) | |
.apex-item-text:focus, .apex-item-text:focus-within,
.apex-item-select:focus,
.apex-item-select:focus-within,
.apex-item-textarea:focus,
.apex-item-textarea:focus-within,
.u-TF-item--text:focus,
.u-TF-item--text:focus-within,
.u-TF-item--select:focus,
.u-TF-item--select:focus-within,
select.listmanager:focus,
select.listmanager:focus-within,
select.group_selectlist:focus,
select.group_selectlist:focus-within,
.apex-item-multi:focus,
.apex-item-multi:focus-within,
.datetimepicker_newMonth:focus,
.datetimepicker_newMonth:focus-within |
var(--a-field-input-focus-border-color) | |
.apex-item-text.apex-page-item-error,
.apex-item-select.apex-page-item-error,
.apex-item-textarea.apex-page-item-error,
.u-TF-item--text.apex-page-item-error,
.u-TF-item--select.apex-page-item-error,
select.listmanager.apex-page-item-error,
select.group_selectlist.apex-page-item-error,
.apex-item-multi.apex-page-item-error,
.datetimepicker_newMonth.apex-page-item-error |
var(--ut-palette-danger) | |
.apex-item-text.apex-page-item-error:required:valid,
.apex-item-select.apex-page-item-error:required:valid,
.apex-item-textarea.apex-page-item-error:required:valid,
.u-TF-item--text.apex-page-item-error:required:valid,
.u-TF-item--select.apex-page-item-error:required:valid,
select.listmanager.apex-page-item-error:required:valid,
select.group_selectlist.apex-page-item-error:required:valid,
.apex-item-multi.apex-page-item-error:required:valid,
.datetimepicker_newMonth.apex-page-item-error:required:valid |
var(--a-field-input-border-color) | |
.apex-item-wrapper--date-picker-jet .oj-text-field:hover .oj-text-field-container,
.a-GV-columnItem .apex-item-datepicker-jet .oj-text-field:hover .oj-text-field-container |
var(--a-field-input-hover-border-color) | |
.apex-item-wrapper--date-picker-jet .oj-text-field.oj-focus .oj-text-field-container,
.a-GV-columnItem .apex-item-datepicker-jet .oj-text-field.oj-focus .oj-text-field-container |
var(--a-field-input-focus-border-color) | |
.apex-item-wrapper--date-picker-jet .oj-text-field.oj-invalid .oj-text-field-container,
.a-GV-columnItem .apex-item-datepicker-jet .oj-text-field.oj-invalid .oj-text-field-container |
var(--ut-palette-danger) | |
.apex-item-wrapper--date-picker-jet .oj-text-field.apex-page-item-error,
.a-GV-columnItem .apex-item-datepicker-jet .oj-text-field.apex-page-item-error |
var(--ut-palette-danger) | |
.apex-item-wrapper--date-picker-jet .oj-text-field.apex-page-item-error:required:valid,
.a-GV-columnItem .apex-item-datepicker-jet .oj-text-field.apex-page-item-error:required:valid |
var(--a-field-input-border-color) | |
body .ck.ck-editor__main > .ck-editor__editable:not(.ck-focused) |
var(--a-field-input-border-color) | |
body .ck.ck-editor__editable:not(.ck-editor__nested-editable).ck-focused |
var(--a-field-input-focus-border-color) | |
body .ck.ck-editor__editable:not(.ck-editor__nested-editable).ck-focused |
var(--a-field-input-border-color) |
--a-field-input-state-text-color
| Selector | Value | Color |
|---|---|---|
.t-Form-fieldContainer--floatingLabel.is-active, .t-Form-fieldContainer--floatingLabel:focus-within |
var(--a-field-input-focus-text-color) | |
.apex-item-text,
.apex-item-select,
.apex-item-textarea,
.u-TF-item--text,
.u-TF-item--select,
select.listmanager,
select.group_selectlist,
.apex-item-multi,
.datetimepicker_newMonth |
var(--a-field-input-text-color) | |
.apex-item-text:hover,
.apex-item-select:hover,
.apex-item-textarea:hover,
.u-TF-item--text:hover,
.u-TF-item--select:hover,
select.listmanager:hover,
select.group_selectlist:hover,
.apex-item-multi:hover,
.datetimepicker_newMonth:hover |
var(--a-field-input-hover-text-color) | |
.apex-item-text:focus, .apex-item-text:focus-within,
.apex-item-select:focus,
.apex-item-select:focus-within,
.apex-item-textarea:focus,
.apex-item-textarea:focus-within,
.u-TF-item--text:focus,
.u-TF-item--text:focus-within,
.u-TF-item--select:focus,
.u-TF-item--select:focus-within,
select.listmanager:focus,
select.listmanager:focus-within,
select.group_selectlist:focus,
select.group_selectlist:focus-within,
.apex-item-multi:focus,
.apex-item-multi:focus-within,
.datetimepicker_newMonth:focus,
.datetimepicker_newMonth:focus-within |
var(--a-field-input-focus-text-color) | |
.apex-item-file--native |
var(--a-field-input-text-color) | |
.apex-item-wrapper--date-picker-jet .oj-text-field:hover .oj-text-field-container,
.a-GV-columnItem .apex-item-datepicker-jet .oj-text-field:hover .oj-text-field-container |
var(--a-field-input-hover-text-color) | |
.apex-item-wrapper--date-picker-jet .oj-text-field.oj-focus .oj-text-field-container,
.a-GV-columnItem .apex-item-datepicker-jet .oj-text-field.oj-focus .oj-text-field-container |
var(--a-field-input-focus-text-color) | |
body .ck.ck-input-text,
body .ck.ck-editor__main > .ck-editor__editable |
var(--a-field-input-text-color) |
--ut-field-input-icon-background-color
| Selector | Value | Color |
|---|---|---|
.t-Form-fieldContainer--floatingLabel.is-active, .t-Form-fieldContainer--floatingLabel:focus-within |
var(--ut-field-fl-input-focus-icon-background-color) | |
.apex-item-wrapper--date-picker-jet .oj-text-field:hover .oj-text-field-container,
.a-GV-columnItem .apex-item-datepicker-jet .oj-text-field:hover .oj-text-field-container |
var(--ut-field-input-hover-icon-background-color) | |
.apex-item-wrapper--date-picker-jet .oj-text-field.oj-focus .oj-text-field-container,
.a-GV-columnItem .apex-item-datepicker-jet .oj-text-field.oj-focus .oj-text-field-container |
var(--ut-field-input-focus-icon-background-color) |
--ut-field-input-icon-color
| Selector | Value | Color |
|---|---|---|
.t-Form-fieldContainer--floatingLabel.is-active, .t-Form-fieldContainer--floatingLabel:focus-within |
var(--ut-field-fl-input-focus-icon-color) | |
.apex-item-icon |
var(--a-field-input-text-color) | |
.apex-item-text:hover + .apex-item-icon,
.apex-item-select:hover + .apex-item-icon,
.apex-item-textarea:hover + .apex-item-icon,
.u-TF-item--text:hover + .apex-item-icon,
.u-TF-item--select:hover + .apex-item-icon,
select.listmanager:hover + .apex-item-icon,
select.group_selectlist:hover + .apex-item-icon,
.apex-item-multi:hover + .apex-item-icon,
.datetimepicker_newMonth:hover + .apex-item-icon |
var(--a-field-input-hover-text-color) | |
.apex-item-text:focus + .apex-item-icon,
.apex-item-select:focus + .apex-item-icon,
.apex-item-textarea:focus + .apex-item-icon,
.u-TF-item--text:focus + .apex-item-icon,
.u-TF-item--select:focus + .apex-item-icon,
select.listmanager:focus + .apex-item-icon,
select.group_selectlist:focus + .apex-item-icon,
.apex-item-multi:focus + .apex-item-icon,
.datetimepicker_newMonth:focus + .apex-item-icon |
var(--ut-field-input-focus-icon-color, var(--a-field-input-focus-text-color)) | |
.apex-item-wrapper--date-picker-jet .oj-text-field:hover .oj-text-field-container,
.a-GV-columnItem .apex-item-datepicker-jet .oj-text-field:hover .oj-text-field-container |
var(--ut-field-input-hover-icon-color) | |
.apex-item-wrapper--date-picker-jet .oj-text-field.oj-focus .oj-text-field-container,
.a-GV-columnItem .apex-item-datepicker-jet .oj-text-field.oj-focus .oj-text-field-container |
var(--ut-field-input-focus-icon-color) |
--ut-field-input-focus-icon-color
| Selector | Value | Color |
|---|---|---|
.t-Form-fieldContainer--floatingLabel.is-active, .t-Form-fieldContainer--floatingLabel:focus-within |
var(--ut-field-input-icon-color) |
--ut-field-input-icon-border
| Selector | Value | Color |
|---|---|---|
.t-Form-fieldContainer--floatingLabel.apex-item-wrapper--has-icon .apex-item-icon |
1px) * -1) 0 0 0 var(--a-field-input-border-color | |
.u-RTL .t-Form-fieldContainer--floatingLabel.apex-item-wrapper--has-icon .apex-item-icon |
1px) 0 0 0 var(--a-field-input-border-color | |
.t-Form-fieldContainer--floatingLabel.apex-item-wrapper--display-only |
none |
--a-datepicker-header-background-color
| Selector | Value | Color |
|---|---|---|
.t-Form-fieldContainer--floatingLabel.apex-item-wrapper--date-picker-apex .a-DatePicker-inline |
transparent |
--a-field-input-font-weight
| Selector | Value | Color |
|---|---|---|
.t-Form-fieldContainer--floatingLabel .apex-item-display-only |
400 | |
.apex-item-text,
.apex-item-select,
.apex-item-textarea,
.u-TF-item--text,
.u-TF-item--select,
select.listmanager,
select.group_selectlist,
.apex-item-multi,
.datetimepicker_newMonth |
400 | |
.apex-item-file--native |
400 | |
.apex-item-wrapper--date-picker-jet .oj-text-field-input,
.a-GV-columnItem .apex-item-datepicker-jet .oj-text-field-input |
400 |
--a-field-select-arrow-padding
| Selector | Value | Color |
|---|---|---|
.t-Form-fieldContainer--floatingLabel.apex-item-wrapper--select-list .t-Form-label, .t-Form-fieldContainer--floatingLabel.apex-item-wrapper--popup-lov .t-Form-label |
32px | |
.t-Form-fieldContainer--floatingLabel.apex-item-wrapper--select-list .t-Form-label, .t-Form-fieldContainer--floatingLabel.apex-item-wrapper--popup-lov .t-Form-label |
32px | |
.apex-item-select,
.u-TF-item--select,
select.group_selectlist,
.datetimepicker_newMonth |
2rem | |
.apex-item-select,
.u-TF-item--select,
select.group_selectlist,
.datetimepicker_newMonth |
2rem |
--ut-field-input-min-height
| Selector | Value | Color |
|---|---|---|
.apex-item-wrapper--has-icon,
.apex-item-wrapper--color-picker |
calc(var(--ut-field-input-icon-size, var(--a-icon-size, 1rem)) + var(--ut-field-input-icon-padding-y, .25rem) + var(--ut-field-input-icon-padding-y, .25rem)) | |
.apex-item-text,
.apex-item-select,
.apex-item-textarea,
.u-TF-item--text,
.u-TF-item--select,
select.listmanager,
select.group_selectlist,
.apex-item-multi,
.datetimepicker_newMonth |
0 | |
.apex-item-file--native |
0 | |
.apex-item-group--popup-lov |
calc(var(--a-field-input-padding-y, .25rem) + var(--a-field-input-padding-y, .25rem) + var(--a-field-input-line-height, 1rem)) | |
.apex-item-multi |
0 |
--ut-field-input-icon-size
| Selector | Value | Color |
|---|---|---|
.apex-item-icon |
1rem | |
.a-Button--colorPicker.apex-item-color-picker-preview |
1rem | |
.a-Button--colorPicker.apex-item-color-picker-preview |
1rem | |
.apex-item-color-picker-preview |
1rem | |
.apex-item-color-picker-preview |
1rem | |
.apex-item-wrapper--date-picker-jet .oj-text-field:not(.oj-text-field-label-inside) .oj-text-field-container .oj-clickable-icon-nocontext.oj-menucheckbox-icon:not(.oj-select-clear-entry-icon):not(.oj-combobox-clear-entry-icon):not(.oj-label-help-icon-anchor),
.apex-item-wrapper--date-picker-jet .oj-text-field:not(.oj-text-field-label-inside) .oj-text-field-container .oj-clickable-icon-nocontext.oj-radiocheckbox-icon:not(.oj-select-clear-entry-icon):not(.oj-combobox-clear-entry-icon):not(.oj-label-help-icon-anchor),
.apex-item-wrapper--date-picker-jet .oj-text-field:not(.oj-text-field-label-inside) .oj-text-field-container .oj-component-icon.oj-clickable-icon-nocontext:not(.oj-select-clear-entry-icon):not(.oj-combobox-clear-entry-icon):not(.oj-label-help-icon-anchor),
.a-GV-columnItem .apex-item-datepicker-jet .oj-text-field:not(.oj-text-field-label-inside) .oj-text-field-container .oj-clickable-icon-nocontext.oj-menucheckbox-icon:not(.oj-select-clear-entry-icon):not(.oj-combobox-clear-entry-icon):not(.oj-label-help-icon-anchor),
.a-GV-columnItem .apex-item-datepicker-jet .oj-text-field:not(.oj-text-field-label-inside) .oj-text-field-container .oj-clickable-icon-nocontext.oj-radiocheckbox-icon:not(.oj-select-clear-entry-icon):not(.oj-combobox-clear-entry-icon):not(.oj-label-help-icon-anchor),
.a-GV-columnItem .apex-item-datepicker-jet .oj-text-field:not(.oj-text-field-label-inside) .oj-text-field-container .oj-component-icon.oj-clickable-icon-nocontext:not(.oj-select-clear-entry-icon):not(.oj-combobox-clear-entry-icon):not(.oj-label-help-icon-anchor) |
1rem |
--a-field-input-state-shadow
| Selector | Value | Color |
|---|---|---|
.apex-item-text,
.apex-item-select,
.apex-item-textarea,
.u-TF-item--text,
.u-TF-item--select,
select.listmanager,
select.group_selectlist,
.apex-item-multi,
.datetimepicker_newMonth |
var(--a-field-input-shadow) | |
body .ck.ck-input-text,
body .ck.ck-editor__main > .ck-editor__editable |
var(--a-field-input-shadow) | |
body .ck.ck-editor__editable:not(.ck-editor__nested-editable).ck-focused |
var(--a-field-input-shadow) |
--a-field-placeholder-text-color
| Selector | Value | Color |
|---|---|---|
.apex-item-text::-moz-placeholder, .apex-item-select::-moz-placeholder, .apex-item-textarea::-moz-placeholder, .u-TF-item--text::-moz-placeholder, .u-TF-item--select::-moz-placeholder, select.listmanager::-moz-placeholder, select.group_selectlist::-moz-placeholder, .apex-item-multi::-moz-placeholder, .datetimepicker_newMonth::-moz-placeholder |
currentColor | |
.apex-item-text::placeholder,
.apex-item-select::placeholder,
.apex-item-textarea::placeholder,
.u-TF-item--text::placeholder,
.u-TF-item--select::placeholder,
select.listmanager::placeholder,
select.group_selectlist::placeholder,
.apex-item-multi::placeholder,
.datetimepicker_newMonth::placeholder |
currentColor | |
.apex-item-group--auto-complete .apex-item-auto-complete::-moz-placeholder |
#000 | |
.apex-item-group--auto-complete .apex-item-auto-complete::placeholder |
#000 |
--a-field-placeholder-opacity
| Selector | Value | Color |
|---|---|---|
.apex-item-text::-moz-placeholder, .apex-item-select::-moz-placeholder, .apex-item-textarea::-moz-placeholder, .u-TF-item--text::-moz-placeholder, .u-TF-item--select::-moz-placeholder, select.listmanager::-moz-placeholder, select.group_selectlist::-moz-placeholder, .apex-item-multi::-moz-placeholder, .datetimepicker_newMonth::-moz-placeholder |
0.6 | |
.apex-item-text::placeholder,
.apex-item-select::placeholder,
.apex-item-textarea::placeholder,
.u-TF-item--text::placeholder,
.u-TF-item--select::placeholder,
select.listmanager::placeholder,
select.group_selectlist::placeholder,
.apex-item-multi::placeholder,
.datetimepicker_newMonth::placeholder |
0.6 | |
.apex-item-group--auto-complete .apex-item-auto-complete::-moz-placeholder |
0.5 | |
.apex-item-group--auto-complete .apex-item-auto-complete::placeholder |
0.5 |
--a-field-input-border-color
| Selector | Value | Color |
|---|---|---|
.apex-item-text:focus + .apex-item-icon,
.apex-item-select:focus + .apex-item-icon,
.apex-item-textarea:focus + .apex-item-icon,
.u-TF-item--text:focus + .apex-item-icon,
.u-TF-item--select:focus + .apex-item-icon,
select.listmanager:focus + .apex-item-icon,
select.group_selectlist:focus + .apex-item-icon,
.apex-item-multi:focus + .apex-item-icon,
.datetimepicker_newMonth:focus + .apex-item-icon |
var(--a-field-input-state-border-color) | |
.apex-item-group--popup-lov:focus-within |
var(--a-field-input-focus-border-color) | |
.apex-item-wrapper--date-picker-jet .oj-text-field.oj-focus .oj-text-field-container,
.a-GV-columnItem .apex-item-datepicker-jet .oj-text-field.oj-focus .oj-text-field-container |
var(--a-field-input-focus-border-color) |
--ut-field-disabled-opacity
| Selector | Value | Color |
|---|---|---|
.apex-item-text:disabled,
.apex-item-select:disabled,
.apex-item-textarea:disabled,
.u-TF-item--text:disabled,
.u-TF-item--select:disabled,
select.listmanager:disabled,
select.group_selectlist:disabled,
.apex-item-multi:disabled,
.datetimepicker_newMonth:disabled |
0.5 |
--a-field-select-background-size
| Selector | Value | Color |
|---|---|---|
.apex-item-select,
.u-TF-item--select,
select.group_selectlist,
.datetimepicker_newMonth |
2rem 1rem |
--a-checkbox-label-font-size
| Selector | Value | Color |
|---|---|---|
.apex-item-wrapper--single-checkbox.is-required .apex-item-single-checkbox:after |
0.75rem |
--a-checkbox-size
| Selector | Value | Color |
|---|---|---|
.apex-item-wrapper--single-checkbox.is-required .apex-item-single-checkbox:after |
1rem | |
.apex-item-group--rc input + label |
1rem |
--a-color-picker-color-only-height
| Selector | Value | Color |
|---|---|---|
.apex-item-group--color-picker .a-Button--colorPickerOnly |
1rem |
--a-color-picker-color-only-width
| Selector | Value | Color |
|---|---|---|
.apex-item-group--color-picker .a-Button--colorPickerOnly |
1.5rem |
--a-button-padding
| Selector | Value | Color |
|---|---|---|
.apex-item-group--color-picker .a-Button--colorPickerOnly |
.25rem |
--ck-z-modal
| Selector | Value | Color |
|---|---|---|
.ck-editor |
700 |
--a-item-icon-offset
| Selector | Value | Color |
|---|---|---|
.apex-item-group--popup-lov |
var(--ut-field-input-icon-offset, 0rem) | |
.apex-item-group--popup-lov .apex-item-popup-lov:not(.apex-item-has-icon) |
0rem |
--ut-checkbox-item-spacing
| Selector | Value | Color |
|---|---|---|
.apex-item-group--rc input + label |
0.5rem | |
.apex-item-group--rc input + label |
0.5rem |
--oj-text-field-height
| Selector | Value | Color |
|---|---|---|
.apex-item-wrapper--date-picker-jet .oj-text-field,
.a-GV-columnItem .apex-item-datepicker-jet .oj-text-field |
auto |
--oj-text-field-border-width
| Selector | Value | Color |
|---|---|---|
.apex-item-wrapper--date-picker-jet .oj-text-field .oj-text-field-container,
.a-GV-columnItem .apex-item-datepicker-jet .oj-text-field .oj-text-field-container |
var(--a-field-input-border-width, 1px) | |
.a-GV-columnItem .oj-inputdatetime |
var(--a-field-input-border-width, 1px) |
--oj-text-field-border-color
| Selector | Value | Color |
|---|---|---|
.apex-item-wrapper--date-picker-jet .oj-text-field .oj-text-field-container,
.a-GV-columnItem .apex-item-datepicker-jet .oj-text-field .oj-text-field-container |
var(--a-field-input-state-border-color, var(--a-field-input-border-color)) | |
.apex-item-wrapper--date-picker-jet .oj-inputdatetime-input-trigger,
.a-GV-columnItem .apex-item-datepicker-jet .oj-inputdatetime-input-trigger |
var(--a-field-input-state-border-color, var(--a-field-input-border-color)) | |
.a-GV-columnItem .oj-inputdatetime |
var(--a-field-input-state-border-color, var(--a-field-input-border-color)) |
--oj-text-field-border-radius
| Selector | Value | Color |
|---|---|---|
.apex-item-wrapper--date-picker-jet .oj-text-field .oj-text-field-container,
.a-GV-columnItem .apex-item-datepicker-jet .oj-text-field .oj-text-field-container |
var(--a-field-input-border-radius, .125rem) | |
.a-GV-columnItem .oj-inputdatetime |
0 |
--oj-text-field-bg-color
| Selector | Value | Color |
|---|---|---|
.apex-item-wrapper--date-picker-jet .oj-text-field .oj-text-field-container,
.a-GV-columnItem .apex-item-datepicker-jet .oj-text-field .oj-text-field-container |
var(--a-field-input-state-background-color, var(--a-field-input-background-color)) | |
.a-GV-columnItem .oj-inputdatetime |
var(--a-field-input-state-background-color, var(--a-field-input-background-color)) |
--oj-text-field-border-color-focus
| Selector | Value | Color |
|---|---|---|
.apex-item-wrapper--date-picker-jet .oj-text-field .oj-text-field-container,
.a-GV-columnItem .apex-item-datepicker-jet .oj-text-field .oj-text-field-container |
var(--a-field-input-focus-border-color) | |
.a-GV-columnItem .oj-inputdatetime |
var(--a-field-input-focus-border-color) |
--oj-text-field-text-color
| Selector | Value | Color |
|---|---|---|
.apex-item-wrapper--date-picker-jet .oj-inputdatetime-input,
.a-GV-columnItem .apex-item-datepicker-jet .oj-inputdatetime-input |
var(--a-field-input-state-text-color, var(--a-field-input-text-color)) |
--oj-button-sm-height
| Selector | Value | Color |
|---|---|---|
.apex-item-wrapper--date-picker-jet .oj-text-field:not(.oj-text-field-label-inside) .oj-text-field-container .oj-clickable-icon-nocontext.oj-menucheckbox-icon:not(.oj-select-clear-entry-icon):not(.oj-combobox-clear-entry-icon):not(.oj-label-help-icon-anchor),
.apex-item-wrapper--date-picker-jet .oj-text-field:not(.oj-text-field-label-inside) .oj-text-field-container .oj-clickable-icon-nocontext.oj-radiocheckbox-icon:not(.oj-select-clear-entry-icon):not(.oj-combobox-clear-entry-icon):not(.oj-label-help-icon-anchor),
.apex-item-wrapper--date-picker-jet .oj-text-field:not(.oj-text-field-label-inside) .oj-text-field-container .oj-component-icon.oj-clickable-icon-nocontext:not(.oj-select-clear-entry-icon):not(.oj-combobox-clear-entry-icon):not(.oj-label-help-icon-anchor),
.a-GV-columnItem .apex-item-datepicker-jet .oj-text-field:not(.oj-text-field-label-inside) .oj-text-field-container .oj-clickable-icon-nocontext.oj-menucheckbox-icon:not(.oj-select-clear-entry-icon):not(.oj-combobox-clear-entry-icon):not(.oj-label-help-icon-anchor),
.a-GV-columnItem .apex-item-datepicker-jet .oj-text-field:not(.oj-text-field-label-inside) .oj-text-field-container .oj-clickable-icon-nocontext.oj-radiocheckbox-icon:not(.oj-select-clear-entry-icon):not(.oj-combobox-clear-entry-icon):not(.oj-label-help-icon-anchor),
.a-GV-columnItem .apex-item-datepicker-jet .oj-text-field:not(.oj-text-field-label-inside) .oj-text-field-container .oj-component-icon.oj-clickable-icon-nocontext:not(.oj-select-clear-entry-icon):not(.oj-combobox-clear-entry-icon):not(.oj-label-help-icon-anchor) |
auto |
--oj-private-icon-color-default
| Selector | Value | Color |
|---|---|---|
.apex-item-wrapper--date-picker-jet .oj-text-field-container .oj-component-icon.oj-clickable-icon-nocontext:not(.oj-select-clear-entry-icon):not(.oj-combobox-clear-entry-icon):not(.oj-label-help-icon-anchor),
.a-GV-columnItem .apex-item-datepicker-jet .oj-text-field-container .oj-component-icon.oj-clickable-icon-nocontext:not(.oj-select-clear-entry-icon):not(.oj-combobox-clear-entry-icon):not(.oj-label-help-icon-anchor) |
var(--a-button-state-text-color, var(--a-button-type-text-color, var(--a-button-text-color, inherit))) |
--oj-private-icon-color-hover
| Selector | Value | Color |
|---|---|---|
.apex-item-wrapper--date-picker-jet .oj-text-field-container .oj-component-icon.oj-clickable-icon-nocontext:not(.oj-select-clear-entry-icon):not(.oj-combobox-clear-entry-icon):not(.oj-disabled):hover,
.a-GV-columnItem .apex-item-datepicker-jet .oj-text-field-container .oj-component-icon.oj-clickable-icon-nocontext:not(.oj-select-clear-entry-icon):not(.oj-combobox-clear-entry-icon):not(.oj-disabled):hover |
var(--a-button-hover-text-color) |
--oj-private-icon-bg-color-hover
| Selector | Value | Color |
|---|---|---|
.apex-item-wrapper--date-picker-jet .oj-text-field-container .oj-component-icon.oj-clickable-icon-nocontext:not(.oj-select-clear-entry-icon):not(.oj-combobox-clear-entry-icon):not(.oj-disabled):hover,
.a-GV-columnItem .apex-item-datepicker-jet .oj-text-field-container .oj-component-icon.oj-clickable-icon-nocontext:not(.oj-select-clear-entry-icon):not(.oj-combobox-clear-entry-icon):not(.oj-disabled):hover |
var(--a-button-state-background-color) |
--oj-private-icon-border-color-hover
| Selector | Value | Color |
|---|---|---|
.apex-item-wrapper--date-picker-jet .oj-text-field-container .oj-component-icon.oj-clickable-icon-nocontext:not(.oj-select-clear-entry-icon):not(.oj-combobox-clear-entry-icon):not(.oj-disabled):hover,
.a-GV-columnItem .apex-item-datepicker-jet .oj-text-field-container .oj-component-icon.oj-clickable-icon-nocontext:not(.oj-select-clear-entry-icon):not(.oj-combobox-clear-entry-icon):not(.oj-disabled):hover |
var(--a-button-state-border-color) |
--oj-user-assistance-inline-text-color
| Selector | Value | Color |
|---|---|---|
.apex-item-wrapper--date-picker-jet .oj-helphints-inline-container,
.apex-item-wrapper--date-picker-jet .oj-user-assistance-inline-container,
.apex-item-wrapper--date-picker-jet .oj-user-assistance-inline-container .oj-message-detail,
.a-GV-columnItem .apex-item-datepicker-jet .oj-helphints-inline-container,
.a-GV-columnItem .apex-item-datepicker-jet .oj-user-assistance-inline-container,
.a-GV-columnItem .apex-item-datepicker-jet .oj-user-assistance-inline-container .oj-message-detail |
var(--ut-component-text-muted-color) |
--oj-user-assistance-inline-font-size
| Selector | Value | Color |
|---|---|---|
.apex-item-wrapper--date-picker-jet .oj-helphints-inline-container,
.apex-item-wrapper--date-picker-jet .oj-user-assistance-inline-container,
.apex-item-wrapper--date-picker-jet .oj-user-assistance-inline-container .oj-message-detail,
.a-GV-columnItem .apex-item-datepicker-jet .oj-helphints-inline-container,
.a-GV-columnItem .apex-item-datepicker-jet .oj-user-assistance-inline-container,
.a-GV-columnItem .apex-item-datepicker-jet .oj-user-assistance-inline-container .oj-message-detail |
var(--ut-field-inline-help-font-size, .6875rem) |
--oj-core-bg-color-selected
| Selector | Value | Color |
|---|---|---|
.a-GV-columnItem .oj-inputdatetime |
Highlight |
--oj-button-height
| Selector | Value | Color |
|---|---|---|
.oj-datepicker-header |
2.25rem |
--oj-core-icon-size-lg
| Selector | Value | Color |
|---|---|---|
.oj-datepicker-header |
1.25rem |
--oj-heading-text-color
| Selector | Value | Color |
|---|---|---|
.oj-datepicker-header |
var(--ut-component-text-title-color) |
--oj-typography-body-lg-font-size
| Selector | Value | Color |
|---|---|---|
.oj-datepicker-title |
.875rem |
--oj-typography-body-2xs-font-size
| Selector | Value | Color |
|---|---|---|
.oj-datepicker-calendar th |
.6875rem |
--oj-date-picker-cell-font-size
| Selector | Value | Color |
|---|---|---|
.oj-datepicker-calendar td |
.75rem |
--ut-palette-primary
| Selector | Value | Color |
|---|---|---|
.oj-datepicker-calendar td a.oj-selected,
.oj-datepicker-calendar td.oj-datepicker-today a.oj-selected |
var(--a-palette-primary) |
--ut-palette-primary-contrast
| Selector | Value | Color |
|---|---|---|
.oj-datepicker-calendar td a.oj-selected,
.oj-datepicker-calendar td.oj-datepicker-today a.oj-selected |
var(--a-palette-primary-contrast) |
--a-bar-chart-item-padding
| Selector | Value | Color |
|---|---|---|
.a-BarChart-item |
0.75rem |
--a-bar-chart-item-border-width
| Selector | Value | Color |
|---|---|---|
.a-BarChart-item |
var(--ut-component-inner-border-width) |
--a-bar-chart-item-border-color
| Selector | Value | Color |
|---|---|---|
.a-BarChart-item |
var(--ut-component-inner-border-color) |
--a-bar-chart-img-border-radius
| Selector | Value | Color |
|---|---|---|
.a-BarChart-image,
.a-BarChart-item img |
0.125rem |
--a-bar-chart-bar-height
| Selector | Value | Color |
|---|---|---|
.a-BarChart-bar |
0.5rem | |
.a-BarChart-filled |
0.5rem | |
.a-BarChart--classic |
.75rem | |
.a-BarChart--modern |
.5rem |
--a-bar-chart-bar-border-radius
| Selector | Value | Color |
|---|---|---|
.a-BarChart--classic |
.0625rem | |
.a-BarChart--modern |
.0625rem |
--a-bar-chart-bar-margin
| Selector | Value | Color |
|---|---|---|
.a-BarChart--classic |
.25rem 0 | |
.a-BarChart--modern |
.125rem 0 |
--a-bar-chart-bar-opacity
| Selector | Value | Color |
|---|---|---|
.a-BarChart--classic |
.75 | |
.a-BarChart--modern |
.75 |
--ut-fc4-event-font-size
| Selector | Value | Color |
|---|---|---|
.fc .fc-event |
0.6875rem |
--ut-fc4-event-line-height
| Selector | Value | Color |
|---|---|---|
.fc .fc-event |
0.75rem |
--ut-fc4-event-padding
| Selector | Value | Color |
|---|---|---|
.fc .fc-event |
0.125rem 0.25rem |
--ut-fc4-basic-number-font-size
| Selector | Value | Color |
|---|---|---|
.fc .fc-basic-view .fc-week-number,
.fc .fc-basic-view .fc-day-number |
0.875rem |
--ut-fc4-basic-number-padding
| Selector | Value | Color |
|---|---|---|
.fc .fc-basic-view .fc-week-number,
.fc .fc-basic-view .fc-day-number |
0.25rem |
--ut-minical-border-width
| Selector | Value | Color |
|---|---|---|
.a-MiniCal |
0 |
--ut-minical-title-padding
| Selector | Value | Color |
|---|---|---|
.a-MiniCal-title |
0.75rem |
--ut-minical-title-font-size
| Selector | Value | Color |
|---|---|---|
.a-MiniCal-title |
1rem |
--ut-minical-title-line-height
| Selector | Value | Color |
|---|---|---|
.a-MiniCal-title |
1.5rem |
--ut-minical-month-font-size
| Selector | Value | Color |
|---|---|---|
.a-MiniCal-month |
0.75rem |
--ut-minical-heading-font-size
| Selector | Value | Color |
|---|---|---|
.a-MiniCal-dayOfWeek |
0.6875rem |
--ut-minical-heading-line-height
| Selector | Value | Color |
|---|---|---|
.a-MiniCal-dayOfWeek |
1.25rem |
--ut-minical-date-font-size
| Selector | Value | Color |
|---|---|---|
.a-MiniCal-date |
0.6875rem |
--ut-minical-date-width
| Selector | Value | Color |
|---|---|---|
.a-MiniCal-date |
1.25rem |
--ut-minical-date-height
| Selector | Value | Color |
|---|---|---|
.a-MiniCal-date |
1.25rem | |
.a-MiniCal-date |
1.25rem |
--ut-minical-day-padding
| Selector | Value | Color |
|---|---|---|
.a-MiniCal-day |
0.375rem 0 |
--ut-minical-date-border-radius
| Selector | Value | Color |
|---|---|---|
.a-MiniCal-day.is-today, .a-MiniCal-day.is-active |
100% |
--ut-minical-date-font-weight
| Selector | Value | Color |
|---|---|---|
.a-MiniCal-day.is-today, .a-MiniCal-day.is-active |
var(--a-base-font-weight-bold, 700) |
--ut-minical-date-opacity
| Selector | Value | Color |
|---|---|---|
.a-MiniCal-day.is-today, .a-MiniCal-day.is-active |
1 | |
.a-MiniCal-day.is-weekend, .a-MiniCal-day.is-null |
.5 |
--ut-tagcloud-item-border-width
| Selector | Value | Color |
|---|---|---|
.a-TagCloud-link |
1px |
--ut-tagcloud-item-text-color
| Selector | Value | Color |
|---|---|---|
.a-TagCloud-link |
initial |
--ut-tagcloud-item-gap
| Selector | Value | Color |
|---|---|---|
.a-TagCloud-link |
0.25rem | |
.a-TagCloud-count |
0.25rem | |
.a-TagCloud-count |
0.25rem |
--ut-tagcloud-item-padding
| Selector | Value | Color |
|---|---|---|
.a-TagCloud-link |
0.25rem 0.75rem |
--ut-tagcloud-item-font-size
| Selector | Value | Color |
|---|---|---|
.a-TagCloud-link |
inherit | |
.a-TagCloud-link--size1 |
.75rem | |
.a-TagCloud-link--size2 |
.875rem | |
.a-TagCloud-link--size3 |
1rem | |
.a-TagCloud-link--size4 |
1.125rem | |
.a-TagCloud-link--size5 |
1.25rem | |
.a-TagCloud-link--size6 |
1.375rem |
--ut-tagcloud-item-line-height
| Selector | Value | Color |
|---|---|---|
.a-TagCloud-link |
2rem |
--ut-tagcloud-item-count-font-weight
| Selector | Value | Color |
|---|---|---|
.a-TagCloud-count |
500 |
--ut-valiation-icon-background-color
| Selector | Value | Color |
|---|---|---|
.t-Validation.is-invalid |
var(--ut-palette-danger) | |
.t-Validation.is-warning |
var(--ut-palette-warning) | |
.t-Validation.is-valid |
var(--ut-palette-success) |
--ut-validaiton-icon-margin
| Selector | Value | Color |
|---|---|---|
.t-Validation-icon |
0.75rem | |
.t-Validation-icon |
0.75rem |
--ut-valiation-icon-text-color
| Selector | Value | Color |
|---|---|---|
.t-Validation-icon .a-Icon |
#FFF |
--ut-valiation-icon-border-radius
| Selector | Value | Color |
|---|---|---|
.t-Validation-icon .a-Icon |
100% |
--ut-valiation-icon-padding
| Selector | Value | Color |
|---|---|---|
.t-Validation-icon .a-Icon |
0.25rem |
--ut-validaiton-date-font-size
| Selector | Value | Color |
|---|---|---|
.t-Validation-date |
1rem |
--ut-validation-date-line-height
| Selector | Value | Color |
|---|---|---|
.t-Validation-date |
1.5rem |
--ut-validaiton-date-text-color
| Selector | Value | Color |
|---|---|---|
.t-Validation-date |
#404040 |
--ut-validaiton-user-font-size
| Selector | Value | Color |
|---|---|---|
.t-Validation-user |
0.75rem |
--ut-validation-user-line-height
| Selector | Value | Color |
|---|---|---|
.t-Validation-user |
1rem |
--ut-validaiton-user-text-color
| Selector | Value | Color |
|---|---|---|
.t-Validation-user |
#707070 |
--ut-border-radius
| Selector | Value | Color |
|---|---|---|
.rounded, .rounded-md |
0.25rem | |
.rounded-sm |
var(--ut-border-radius-sm, .125rem) | |
.rounded-lg |
var(--ut-border-radius-lg, .5rem) | |
.rounded-top, .rounded-top-md |
0.25rem | |
.rounded-top, .rounded-top-md |
0.25rem | |
.rounded-top-sm |
var(--ut-border-radius-sm, .125rem) | |
.rounded-top-lg |
var(--ut-border-radius-lg, .5rem) | |
.rounded-right, .rounded-right-md |
0.25rem | |
.rounded-right, .rounded-right-md |
0.25rem | |
.rounded-right-sm |
var(--ut-border-radius-sm, .125rem) | |
.rounded-right-lg |
var(--ut-border-radius-lg, .5rem) | |
.rounded-bottom, .rounded-bottom-md |
0.25rem | |
.rounded-bottom, .rounded-bottom-md |
0.25rem | |
.rounded-bottom-sm |
var(--ut-border-radius-sm, .125rem) | |
.rounded-bottom-lg |
var(--ut-border-radius-lg, .5rem) | |
.rounded-left, .rounded-left-md |
0.25rem | |
.rounded-left, .rounded-left-md |
0.25rem | |
.rounded-left-sm |
var(--ut-border-radius-sm, .125rem) | |
.rounded-left-lg |
var(--ut-border-radius-lg, .5rem) |
--ut-table-border-width
| Selector | Value | Color |
|---|---|---|
.u-Table--withBorder > .u-Table-fit, .u-Table--withBorder > .u-Table-fill |
1px | |
.u-Table--withBorder > .u-Table-fit:first-child, .u-Table--withBorder > .u-Table-fill:first-child |
0px |
--ut-table-border-color
| Selector | Value | Color |
|---|---|---|
.u-Table--withBorder > .u-Table-fit, .u-Table--withBorder > .u-Table-fill |
#f0f0f0 |
--jui-datepicker-font-size
| Selector | Value | Color |
|---|---|---|
.ui-datepicker |
0.6875rem |
--jui-datepicker-header
| Selector | Value | Color |
|---|---|---|
.ui-datepicker th |
var(--ut-component-text-muted-color) |
--jui-datepicker-border-width
| Selector | Value | Color |
|---|---|---|
.ui-datepicker th |
1px |
--ut-datepicker-border-color
| Selector | Value | Color |
|---|---|---|
.ui-datepicker th |
var(--ut-component-border-color) |
--jui-datepicker-padding-y
| Selector | Value | Color |
|---|---|---|
.ui-datepicker th |
0.5rem | |
.ui-datepicker th |
0.5rem | |
.ui-datepicker th |
0.5rem | |
.ui-datepicker th |
0.5rem |
--jui-datepicker-padding-x
| Selector | Value | Color |
|---|---|---|
.ui-datepicker th |
0.5rem | |
.ui-datepicker th |
0.5rem | |
.ui-datepicker th |
0.5rem | |
.ui-datepicker th |
0.5rem |
--jui-datepicker-title-font-size
| Selector | Value | Color |
|---|---|---|
.ui-datepicker .ui-datepicker-title |
1rem |
--jui-datepicker-date-size
| Selector | Value | Color |
|---|---|---|
.ui-datepicker .ui-state-default |
2rem | |
.ui-datepicker .ui-state-default |
2rem | |
.ui-datepicker .ui-state-default |
2rem | |
.ui-datepicker .ui-datepicker-current,
.ui-datepicker .ui-datepicker-close |
auto | |
.ui-datepicker .ui-datepicker-current,
.ui-datepicker .ui-datepicker-close |
1.25rem |
--jui-datepicker-date-margin
| Selector | Value | Color |
|---|---|---|
.ui-datepicker .ui-state-default |
0.125rem | |
.ui-datepicker .ui-datepicker-current,
.ui-datepicker .ui-datepicker-close |
.125rem |
--jui-datepicker-date-border-radius
| Selector | Value | Color |
|---|---|---|
.ui-datepicker .ui-state-default |
1.5rem | |
.ui-datepicker .ui-datepicker-current,
.ui-datepicker .ui-datepicker-close |
var(--a-button-border-radius) |
--jui-datepicker-date-background-color
| Selector | Value | Color |
|---|---|---|
.ui-datepicker .ui-state-default |
transparent | |
.ui-datepicker .ui-state-hover |
var(--ut-component-inner-border-color, #f2f2f2) | |
.ui-datepicker .ui-state-highlight |
var(--ut-component-border-color, #ebebeb) | |
.ui-datepicker .ui-state-active,
.ui-datepicker .ui-state-active.ui.state-hover |
var(--ut-palette-primary, var(--a-palette-primary)) |
--jui-datepicker-date-color
| Selector | Value | Color |
|---|---|---|
.ui-datepicker .ui-state-default |
inherit | |
.ui-datepicker .ui-state-hover |
var(--ut-component-text-default-color, #262626) | |
.ui-datepicker .ui-state-highlight |
var(--ut-component-text-default-color, #262626) | |
.ui-datepicker .ui-state-active,
.ui-datepicker .ui-state-active.ui.state-hover |
var(--ut-palette-primary-contrast, var(--a-palette-primary-contrast)) |
--jui-datepicker-date-transition
| Selector | Value | Color |
|---|---|---|
.ui-datepicker .ui-state-default |
background-color 0.1s, color 0.1s |
--jui-datepicker-date-focus-box-shadow
| Selector | Value | Color |
|---|---|---|
.ui-datepicker .ui-state-default:focus |
35 0 0 1px #0076df inset, 0 0 1px 2px rgba(0, 118, 223, 0.25) |
--jui-datepicker-active-font-size
| Selector | Value | Color |
|---|---|---|
.ui-datepicker .ui-state-active,
.ui-datepicker .ui-state-active.ui.state-hover |
0.875rem |
--ut-ojet-font-size
| Selector | Value | Color |
|---|---|---|
.oj-html |
0.875rem | |
.oj-chart-pie-center-label,
.oj-chart-xaxis-title,
.oj-chart-yaxis-title,
.oj-chart-y2axis-title |
0.875rem | |
.oj-dvt-tooltip |
0.875rem | |
.oj-timeline-major-axis-label |
0.875rem | |
.oj-treemap-attribute-type-text |
0.875rem | |
.oj-treemap-attribute-value-text |
0.875rem | |
.oj-treemap-current-text |
0.875rem | |
.oj-sunburst-attribute-type-text |
0.875rem | |
.oj-sunburst-attribute-value-text |
0.875rem | |
.oj-sunburst-current-text |
0.875rem | |
.oj-diagram-link-label |
0.875rem | |
.oj-diagram-node-label |
0.875rem | |
.oj-gantt-row-label |
0.875rem | |
.oj-gantt-major-axis-label |
0.875rem |
--ut-ojet-small-font-size
| Selector | Value | Color |
|---|---|---|
.oj-chart-data-label |
0.75rem | |
.oj-chart-footnote |
0.75rem | |
.oj-chart-stack-label |
0.75rem | |
.oj-chart-xaxis-tick-label,
.oj-chart-yaxis-tick-label,
.oj-chart-y2axis-tick-label |
0.75rem | |
.oj-dvt-datatip |
0.75rem | |
.oj-legend |
0.75rem | |
.oj-legend-section-title |
0.75rem | |
.oj-legend-title |
0.75rem | |
.oj-timeline-minor-axis-label |
0.75rem | |
.oj-treemap |
0.75rem | |
.oj-treemap-node |
0.75rem | |
.oj-treemap-node-header |
0.75rem | |
.oj-sunburst |
0.75rem | |
.oj-sunburst-node |
0.75rem | |
.oj-gantt-no-data-message |
0.75rem | |
.oj-gantt-task-label |
0.75rem | |
.oj-gantt-minor-axis-label |
0.75rem | |
.oj-gantt-tooltip-label |
0.75rem |
--ut-ojet-medium-font-size
| Selector | Value | Color |
|---|---|---|
.oj-chart-subtitle |
1rem | |
.oj-chart-title |
1rem |
--ck-color-base-text
| Selector | Value | Color |
|---|---|---|
body |
var(--ut-body-text-color) |
--ck-color-text
| Selector | Value | Color |
|---|---|---|
body |
var(--ck-color-base-text) |
--ck-color-toolbar-border
| Selector | Value | Color |
|---|---|---|
body |
var(--a-toolbar-border-color) |
--ck-color-toolbar-background
| Selector | Value | Color |
|---|---|---|
body |
var(--a-toolbar-background-color) |
--ck-color-button-save
| Selector | Value | Color |
|---|---|---|
body |
var(--a-palette-success) |
--ck-color-button-cancel
| Selector | Value | Color |
|---|---|---|
body |
var(--a-palette-danger) |
--ck-color-base-focus
| Selector | Value | Color |
|---|---|---|
body |
var(--a-field-input-focus-border-color) |
--ck-color-panel-background
| Selector | Value | Color |
|---|---|---|
body |
var(--a-toolbar-background-color) |
--ck-color-panel-border
| Selector | Value | Color |
|---|---|---|
body |
var(--a-toolbar-border-color) |
--ck-color-labeled-field-label-background
| Selector | Value | Color |
|---|---|---|
body |
var(--a-toolbar-background-color) |
--ck-color-button-default-background
| Selector | Value | Color |
|---|---|---|
body |
transparent |
--ck-color-button-default-hover-background
| Selector | Value | Color |
|---|---|---|
body |
var(--a-button-hover-background-color) |
--ck-color-button-default-active-background
| Selector | Value | Color |
|---|---|---|
body |
var(--a-button-active-background-color) |
--ck-color-button-default-active-shadow
| Selector | Value | Color |
|---|---|---|
body |
var(--a-button-active-shadow) |
--ck-color-button-default-disabled-background
| Selector | Value | Color |
|---|---|---|
body |
transparent |
--ck-color-button-on-background
| Selector | Value | Color |
|---|---|---|
body |
var(--a-button-hover-background-color) |
--ck-color-button-on-hover-background
| Selector | Value | Color |
|---|---|---|
body |
var(--a-button-hover-background-color) |
--ck-color-button-on-active-background
| Selector | Value | Color |
|---|---|---|
body |
var(--a-button-active-background-color) |
--ck-color-button-on-active-shadow
| Selector | Value | Color |
|---|---|---|
body |
var(--a-button-active-shadow) |
--ck-color-button-on-disabled-background
| Selector | Value | Color |
|---|---|---|
body |
transparent |
--ck-color-list-background
| Selector | Value | Color |
|---|---|---|
body |
var(--a-menu-background-color) |
--ck-color-dropdown-panel-background
| Selector | Value | Color |
|---|---|---|
body |
var(--a-menu-background-color) |
--ck-color-dropdown-panel-border
| Selector | Value | Color |
|---|---|---|
body |
var(--a-menu-border-color) |
--ck-drop-shadow
| Selector | Value | Color |
|---|---|---|
body |
var(--a-menu-shadow) |
--ck-color-list-button-hover-background
| Selector | Value | Color |
|---|---|---|
body |
var(--a-menu-focused-background-color) |
--ck-color-list-button-on-background
| Selector | Value | Color |
|---|---|---|
body |
var(--a-menu-focused-background-color) |
--ck-color-list-button-on-text
| Selector | Value | Color |
|---|---|---|
body |
var(--a-menu-focused-text-color) |
--ck-border-radius
| Selector | Value | Color |
|---|---|---|
body .ck.ck-dropdown__panel .ck-list |
0 |
--fc3-toolbar-border-color
| Selector | Value | Color |
|---|---|---|
.apex-fullcalendar-3 .fc-toolbar |
rgba(0, 0, 0, 0.1) |
--fc3-toolbar-background-color
| Selector | Value | Color |
|---|---|---|
.apex-fullcalendar-3 .fc-toolbar |
#fff |
--fc3-toolbar-border-radius
| Selector | Value | Color |
|---|---|---|
.apex-fullcalendar-3 .fc-toolbar |
var(--ut-component-border-radius)) 0 |
--fc3-toolbar-title-text-color
| Selector | Value | Color |
|---|---|---|
.apex-fullcalendar-3 .fc-toolbar |
var(--ut-component-text-title-color) | |
.apex-fullcalendar-3 .fc-toolbar h2 |
var(--ut-component-text-title-color) |
--a-button-border-color
| Selector | Value | Color |
|---|---|---|
.apex-fullcalendar-3.fc .ui-button |
transparent |
--fc3-day-number-text-color
| Selector | Value | Color |
|---|---|---|
.apex-fullcalendar-3.fc .fc-basic-view td.fc-day-number, .apex-fullcalendar-3.fc .fc-day-number |
var(--ut-component-text-default-color) |
--fc3-header-background-color
| Selector | Value | Color |
|---|---|---|
.apex-fullcalendar-3 .fc-day-header.ui-widget-header,
.apex-fullcalendar-3 .fc-view .ui-widget-header |
var(--ut-component-toolbar-background-color) |
--fc3-header-text-color
| Selector | Value | Color |
|---|---|---|
.apex-fullcalendar-3 .fc-day-header.ui-widget-header,
.apex-fullcalendar-3 .fc-view .ui-widget-header |
var(--ut-component-text-default-color) |
--fc3-header-border-color
| Selector | Value | Color |
|---|---|---|
.apex-fullcalendar-3 .fc-day-header.ui-widget-header,
.apex-fullcalendar-3 .fc-view .ui-widget-header |
var(--ut-component-border-color) |
--fc3-today-border-color
| Selector | Value | Color |
|---|---|---|
.apex-fullcalendar-3.fc td.fc-today, .apex-fullcalendar-3.fc .ui-widget-content |
var(--ut-component-border-color) |
--fc3-today-text-color
| Selector | Value | Color |
|---|---|---|
.apex-fullcalendar-3.fc td.fc-today, .apex-fullcalendar-3.fc .ui-widget-content |
var(--ut-component-text-default-color) |
--fc3-today-highlight-background-color
| Selector | Value | Color |
|---|---|---|
.apex-fullcalendar-3.fc .fc-today.ui-state-highlight |
var(--ut-component-toolbar-background-color) |
--fc3-highlight-background-color
| Selector | Value | Color |
|---|---|---|
.apex-fullcalendar-3.fc .fc-highlight |
var(--ut-palette-primary-shade) |
--fc-small-font-size
| Selector | Value | Color |
|---|---|---|
.apex-fullcalendar-5 |
0.85em |
--fc-page-bg-color
| Selector | Value | Color |
|---|---|---|
.apex-fullcalendar-5 |
var(--ut-component-background-color) |
--fc-neutral-bg-color
| Selector | Value | Color |
|---|---|---|
.apex-fullcalendar-5 |
rgba(208, 208, 208, 0.3) |
--fc-neutral-text-color
| Selector | Value | Color |
|---|---|---|
.apex-fullcalendar-5 |
var(--u-color-29) |
--fc-border-color
| Selector | Value | Color |
|---|---|---|
.apex-fullcalendar-5 |
var(--ut-component-border-color) |
--fc-button-text-color
| Selector | Value | Color |
|---|---|---|
.apex-fullcalendar-5 |
var(--a-button-text-color) |
--fc-button-bg-color
| Selector | Value | Color |
|---|---|---|
.apex-fullcalendar-5 |
var(--a-button-background-color) |
--fc-button-border-color
| Selector | Value | Color |
|---|---|---|
.apex-fullcalendar-5 |
var(--a-button-border-color) |
--fc-button-hover-bg-color
| Selector | Value | Color |
|---|---|---|
.apex-fullcalendar-5 |
var(--a-button-hover-background-color) |
--fc-button-hover-border-color
| Selector | Value | Color |
|---|---|---|
.apex-fullcalendar-5 |
var(--a-button-hover-border-color) |
--fc-button-active-bg-color
| Selector | Value | Color |
|---|---|---|
.apex-fullcalendar-5 |
var(--a-button-active-background-color) |
--fc-button-active-border-color
| Selector | Value | Color |
|---|---|---|
.apex-fullcalendar-5 |
var(--a-button-active-border-color) |
--fc-event-bg-color
| Selector | Value | Color |
|---|---|---|
.apex-fullcalendar-5 |
var(--ut-palette-primary) |
--fc-event-border-color
| Selector | Value | Color |
|---|---|---|
.apex-fullcalendar-5 |
var(--ut-palette-primary) |
--fc-event-text-color
| Selector | Value | Color |
|---|---|---|
.apex-fullcalendar-5 |
var(--ut-palette-primary-contrast) |
--fc-event-selected-overlay-color
| Selector | Value | Color |
|---|---|---|
.apex-fullcalendar-5 |
rgba(0, 0, 0, 0.25) |
--fc-event-resizer-thickness
| Selector | Value | Color |
|---|---|---|
.apex-fullcalendar-5 |
.5rem |
--fc-event-resizer-dot-total-width
| Selector | Value | Color |
|---|---|---|
.apex-fullcalendar-5 |
.5rem |
--fc-event-resizer-dot-border-width
| Selector | Value | Color |
|---|---|---|
.apex-fullcalendar-5 |
1px |
--fc-non-business-color
| Selector | Value | Color |
|---|---|---|
.apex-fullcalendar-5 |
rgba(215, 215, 215, 0.3) |
--fc-bg-event-color
| Selector | Value | Color |
|---|---|---|
.apex-fullcalendar-5 |
var(--u-color-20) |
--fc-bg-event-opacity
| Selector | Value | Color |
|---|---|---|
.apex-fullcalendar-5 |
0.3 |
--fc-highlight-color
| Selector | Value | Color |
|---|---|---|
.apex-fullcalendar-5 |
rgba(188, 232, 241, 0.3) |
--fc-today-bg-color
| Selector | Value | Color |
|---|---|---|
.apex-fullcalendar-5 |
rgba(255, 220, 40, 0.15) |
--fc-now-indicator-color
| Selector | Value | Color |
|---|---|---|
.apex-fullcalendar-5 |
var(--ut-palette-danger) |
--fc-daygrid-event-dot-width
| Selector | Value | Color |
|---|---|---|
.apex-fullcalendar-5 |
.5rem |
--fc-list-event-dot-width
| Selector | Value | Color |
|---|---|---|
.apex-fullcalendar-5 |
.625rem |
--fc-list-event-hover-bg-color
| Selector | Value | Color |
|---|---|---|
.apex-fullcalendar-5 |
var(--ut-component-highlight-background-color) |
--fc5-toolbar-padding-y
| Selector | Value | Color |
|---|---|---|
.apex-fullcalendar-5 .fc-toolbar-chunk |
0.75re |