UNPKG

@patternfly/react-tokens

Version:

This library provides access to the design tokens of PatternFly 4 from JavaScript

519 lines 17.7 kB
export const c_toggle_group: { ".pf-v6-c-toggle-group": { "c_toggle_group__button_PaddingBlockStart": { "name": "--pf-v6-c-toggle-group__button--PaddingBlockStart", "value": "0.5rem", "values": [ "--pf-t--global--spacer--sm", "--pf-t--global--spacer--200", "0.5rem" ] }, "c_toggle_group__button_PaddingInlineEnd": { "name": "--pf-v6-c-toggle-group__button--PaddingInlineEnd", "value": "1rem", "values": [ "--pf-t--global--spacer--md", "--pf-t--global--spacer--300", "1rem" ] }, "c_toggle_group__button_PaddingBlockEnd": { "name": "--pf-v6-c-toggle-group__button--PaddingBlockEnd", "value": "0.5rem", "values": [ "--pf-t--global--spacer--sm", "--pf-t--global--spacer--200", "0.5rem" ] }, "c_toggle_group__button_PaddingInlineStart": { "name": "--pf-v6-c-toggle-group__button--PaddingInlineStart", "value": "1rem", "values": [ "--pf-t--global--spacer--md", "--pf-t--global--spacer--300", "1rem" ] }, "c_toggle_group__button_FontSize": { "name": "--pf-v6-c-toggle-group__button--FontSize", "value": "0.875rem", "values": [ "--pf-t--global--font--size--body--default", "--pf-t--global--font--size--sm", "--pf-t--global--font--size--200", "0.875rem" ] }, "c_toggle_group__button_LineHeight": { "name": "--pf-v6-c-toggle-group__button--LineHeight", "value": "1.5", "values": [ "--pf-t--global--font--line-height--body", "--pf-t--global--font--line-height--200", "1.5" ] }, "c_toggle_group__button_Color": { "name": "--pf-v6-c-toggle-group__button--Color", "value": "#151515", "values": [ "--pf-t--global--text--color--regular", "--pf-t--global--text--color--100", "--pf-t--color--gray--95", "#151515" ] }, "c_toggle_group__button_BackgroundColor": { "name": "--pf-v6-c-toggle-group__button--BackgroundColor", "value": "rgba(255, 255, 255, 0.0000)", "values": [ "--pf-t--global--background--color--action--plain--default", "rgba(255, 255, 255, 0.0000)" ] }, "c_toggle_group__button_ZIndex": { "name": "--pf-v6-c-toggle-group__button--ZIndex", "value": "auto" }, "c_toggle_group__button_hover_BackgroundColor": { "name": "--pf-v6-c-toggle-group__button--hover--BackgroundColor", "value": "#f2f2f2", "values": [ "--pf-t--global--background--color--primary--hover", "--pf-t--global--background--color--200", "--pf-t--color--gray--10", "#f2f2f2" ] }, "c_toggle_group__button_hover_ZIndex": { "name": "--pf-v6-c-toggle-group__button--hover--ZIndex", "value": "100", "values": [ "--pf-t--global--z-index--xs", "--pf-t--global--z-index--100", "100" ] }, "c_toggle_group__button_hover_before_BorderColor": { "name": "--pf-v6-c-toggle-group__button--hover--before--BorderColor", "value": "#c7c7c7", "values": [ "--pf-t--global--border--color--default", "--pf-t--global--border--color--100", "--pf-t--color--gray--30", "#c7c7c7" ] }, "c_toggle_group__button_before_BorderWidth": { "name": "--pf-v6-c-toggle-group__button--before--BorderWidth", "value": "1px", "values": [ "--pf-t--global--border--width--control--default", "--pf-t--global--border--width--100", "1px" ] }, "c_toggle_group__button_before_BorderColor": { "name": "--pf-v6-c-toggle-group__button--before--BorderColor", "value": "#c7c7c7", "values": [ "--pf-t--global--border--color--default", "--pf-t--global--border--color--100", "--pf-t--color--gray--30", "#c7c7c7" ] }, "c_toggle_group__item_item_MarginInlineStart": { "name": "--pf-v6-c-toggle-group__item--item--MarginInlineStart", "value": "calc(-1 * 1px)", "values": [ "calc(-1 * --pf-t--global--border--width--control--default)", "calc(-1 * --pf-t--global--border--width--100)", "calc(-1 * 1px)" ] }, "c_toggle_group__item_first_child__button_BorderStartStartRadius": { "name": "--pf-v6-c-toggle-group__item--first-child__button--BorderStartStartRadius", "value": "4px", "values": [ "--pf-t--global--border--radius--tiny", "--pf-t--global--border--radius--100", "4px" ] }, "c_toggle_group__item_first_child__button_BorderEndStartRadius": { "name": "--pf-v6-c-toggle-group__item--first-child__button--BorderEndStartRadius", "value": "4px", "values": [ "--pf-t--global--border--radius--tiny", "--pf-t--global--border--radius--100", "4px" ] }, "c_toggle_group__item_last_child__button_BorderStartEndRadius": { "name": "--pf-v6-c-toggle-group__item--last-child__button--BorderStartEndRadius", "value": "4px", "values": [ "--pf-t--global--border--radius--tiny", "--pf-t--global--border--radius--100", "4px" ] }, "c_toggle_group__item_last_child__button_BorderEndEndRadius": { "name": "--pf-v6-c-toggle-group__item--last-child__button--BorderEndEndRadius", "value": "4px", "values": [ "--pf-t--global--border--radius--tiny", "--pf-t--global--border--radius--100", "4px" ] }, "c_toggle_group__icon_text_MarginInlineStart": { "name": "--pf-v6-c-toggle-group__icon--text--MarginInlineStart", "value": "0.5rem", "values": [ "--pf-t--global--spacer--sm", "--pf-t--global--spacer--200", "0.5rem" ] }, "c_toggle_group__button_m_selected_BackgroundColor": { "name": "--pf-v6-c-toggle-group__button--m-selected--BackgroundColor", "value": "#0066cc", "values": [ "--pf-t--global--color--brand--default", "--pf-t--global--color--brand--200", "--pf-t--color--blue--50", "#0066cc" ] }, "c_toggle_group__button_m_selected_Color": { "name": "--pf-v6-c-toggle-group__button--m-selected--Color", "value": "#ffffff", "values": [ "--pf-t--global--text--color--on-brand--default", "--pf-t--global--text--color--inverse", "--pf-t--global--text--color--300", "--pf-t--color--white", "#ffffff" ] }, "c_toggle_group__button_m_selected_before_BorderColor": { "name": "--pf-v6-c-toggle-group__button--m-selected--before--BorderColor", "value": "#0066cc", "values": [ "--pf-t--global--border--color--clicked", "--pf-t--global--color--brand--200", "--pf-t--color--blue--50", "#0066cc" ] }, "c_toggle_group__button_m_selected_selected_before_BorderInlineStartColor": { "name": "--pf-v6-c-toggle-group__button--m-selected-selected--before--BorderInlineStartColor", "value": "#c7c7c7", "values": [ "--pf-t--global--border--color--default", "--pf-t--global--border--color--100", "--pf-t--color--gray--30", "#c7c7c7" ] }, "c_toggle_group__button_m_selected_ZIndex": { "name": "--pf-v6-c-toggle-group__button--m-selected--ZIndex", "value": "100", "values": [ "--pf-t--global--z-index--xs", "--pf-t--global--z-index--100", "100" ] }, "c_toggle_group__button_disabled_BackgroundColor": { "name": "--pf-v6-c-toggle-group__button--disabled--BackgroundColor", "value": "#c7c7c7", "values": [ "--pf-t--global--background--color--disabled--default", "--pf-t--global--color--disabled--100", "--pf-t--color--gray--30", "#c7c7c7" ] }, "c_toggle_group__button_disabled_Color": { "name": "--pf-v6-c-toggle-group__button--disabled--Color", "value": "#4d4d4d", "values": [ "--pf-t--global--text--color--on-disabled", "--pf-t--global--color--disabled--300", "--pf-t--color--gray--60", "#4d4d4d" ] }, "c_toggle_group__button_disabled_before_BorderColor": { "name": "--pf-v6-c-toggle-group__button--disabled--before--BorderColor", "value": "#a3a3a3", "values": [ "--pf-t--global--border--color--disabled", "--pf-t--global--color--disabled--200", "--pf-t--color--gray--40", "#a3a3a3" ] }, "c_toggle_group__button_disabled_disabled_before_BorderInlineStartColor": { "name": "--pf-v6-c-toggle-group__button--disabled-disabled--before--BorderInlineStartColor", "value": "#c7c7c7", "values": [ "--pf-t--global--border--color--default", "--pf-t--global--border--color--100", "--pf-t--color--gray--30", "#c7c7c7" ] }, "c_toggle_group__button_disabled_ZIndex": { "name": "--pf-v6-c-toggle-group__button--disabled--ZIndex", "value": "100", "values": [ "--pf-t--global--z-index--xs", "--pf-t--global--z-index--100", "100" ] }, "c_toggle_group_m_compact__button_PaddingBlockStart": { "name": "--pf-v6-c-toggle-group--m-compact__button--PaddingBlockStart", "value": "0" }, "c_toggle_group_m_compact__button_PaddingInlineEnd": { "name": "--pf-v6-c-toggle-group--m-compact__button--PaddingInlineEnd", "value": "0.5rem", "values": [ "--pf-t--global--spacer--sm", "--pf-t--global--spacer--200", "0.5rem" ] }, "c_toggle_group_m_compact__button_PaddingBlockEnd": { "name": "--pf-v6-c-toggle-group--m-compact__button--PaddingBlockEnd", "value": "0" }, "c_toggle_group_m_compact__button_PaddingInlineStart": { "name": "--pf-v6-c-toggle-group--m-compact__button--PaddingInlineStart", "value": "0.5rem", "values": [ "--pf-t--global--spacer--sm", "--pf-t--global--spacer--200", "0.5rem" ] }, "c_toggle_group_m_compact__button_FontSize": { "name": "--pf-v6-c-toggle-group--m-compact__button--FontSize", "value": "0.875rem", "values": [ "--pf-t--global--font--size--body--default", "--pf-t--global--font--size--sm", "--pf-t--global--font--size--200", "0.875rem" ] } }, ".pf-v6-c-toggle-group.pf-m-compact": { "c_toggle_group__button_PaddingBlockStart": { "name": "--pf-v6-c-toggle-group__button--PaddingBlockStart", "value": "0", "values": [ "--pf-v6-c-toggle-group--m-compact__button--PaddingBlockStart", "0" ] }, "c_toggle_group__button_PaddingInlineEnd": { "name": "--pf-v6-c-toggle-group__button--PaddingInlineEnd", "value": "0.5rem", "values": [ "--pf-v6-c-toggle-group--m-compact__button--PaddingInlineEnd", "--pf-t--global--spacer--sm", "--pf-t--global--spacer--200", "0.5rem" ] }, "c_toggle_group__button_PaddingBlockEnd": { "name": "--pf-v6-c-toggle-group__button--PaddingBlockEnd", "value": "0", "values": [ "--pf-v6-c-toggle-group--m-compact__button--PaddingBlockEnd", "0" ] }, "c_toggle_group__button_PaddingInlineStart": { "name": "--pf-v6-c-toggle-group__button--PaddingInlineStart", "value": "0.5rem", "values": [ "--pf-v6-c-toggle-group--m-compact__button--PaddingInlineStart", "--pf-t--global--spacer--sm", "--pf-t--global--spacer--200", "0.5rem" ] }, "c_toggle_group__button_FontSize": { "name": "--pf-v6-c-toggle-group__button--FontSize", "value": "0.875rem", "values": [ "--pf-v6-c-toggle-group--m-compact__button--FontSize", "--pf-t--global--font--size--body--default", "--pf-t--global--font--size--sm", "--pf-t--global--font--size--200", "0.875rem" ] } }, ".pf-v6-c-toggle-group__button:is(:hover, :focus)": { "c_toggle_group__button_BackgroundColor": { "name": "--pf-v6-c-toggle-group__button--BackgroundColor", "value": "#f2f2f2", "values": [ "--pf-v6-c-toggle-group__button--hover--BackgroundColor", "--pf-t--global--background--color--primary--hover", "--pf-t--global--background--color--200", "--pf-t--color--gray--10", "#f2f2f2" ] }, "c_toggle_group__button_ZIndex": { "name": "--pf-v6-c-toggle-group__button--ZIndex", "value": "100", "values": [ "--pf-v6-c-toggle-group__button--hover--ZIndex", "--pf-t--global--z-index--xs", "--pf-t--global--z-index--100", "100" ] }, "c_toggle_group__button_before_BorderColor": { "name": "--pf-v6-c-toggle-group__button--before--BorderColor", "value": "#c7c7c7", "values": [ "--pf-v6-c-toggle-group__button--hover--before--BorderColor", "--pf-t--global--border--color--default", "--pf-t--global--border--color--100", "--pf-t--color--gray--30", "#c7c7c7" ] } }, ".pf-v6-c-toggle-group__button.pf-m-selected": { "c_toggle_group__button_BackgroundColor": { "name": "--pf-v6-c-toggle-group__button--BackgroundColor", "value": "#0066cc", "values": [ "--pf-v6-c-toggle-group__button--m-selected--BackgroundColor", "--pf-t--global--color--brand--default", "--pf-t--global--color--brand--200", "--pf-t--color--blue--50", "#0066cc" ] }, "c_toggle_group__button_Color": { "name": "--pf-v6-c-toggle-group__button--Color", "value": "#ffffff, inherit", "values": [ "var(--pf-v6-c-toggle-group__button--m-selected--Color, inherit)", "--pf-t--global--text--color--on-brand--default, inherit", "--pf-t--global--text--color--inverse, inherit", "--pf-t--global--text--color--300, inherit", "--pf-t--color--white, inherit", "#ffffff, inherit" ] }, "c_toggle_group__button_ZIndex": { "name": "--pf-v6-c-toggle-group__button--ZIndex", "value": "100", "values": [ "--pf-v6-c-toggle-group__button--m-selected--ZIndex", "--pf-t--global--z-index--xs", "--pf-t--global--z-index--100", "100" ] }, "c_toggle_group__button_before_BorderColor": { "name": "--pf-v6-c-toggle-group__button--before--BorderColor", "value": "#0066cc", "values": [ "--pf-v6-c-toggle-group__button--m-selected--before--BorderColor", "--pf-t--global--border--color--clicked", "--pf-t--global--color--brand--200", "--pf-t--color--blue--50", "#0066cc" ] } }, ".pf-v6-c-toggle-group__button:is(:disabled, .pf-m-disabled)": { "c_toggle_group__button_BackgroundColor": { "name": "--pf-v6-c-toggle-group__button--BackgroundColor", "value": "#c7c7c7", "values": [ "--pf-v6-c-toggle-group__button--disabled--BackgroundColor", "--pf-t--global--background--color--disabled--default", "--pf-t--global--color--disabled--100", "--pf-t--color--gray--30", "#c7c7c7" ] }, "c_toggle_group__button_Color": { "name": "--pf-v6-c-toggle-group__button--Color", "value": "#4d4d4d", "values": [ "--pf-v6-c-toggle-group__button--disabled--Color", "--pf-t--global--text--color--on-disabled", "--pf-t--global--color--disabled--300", "--pf-t--color--gray--60", "#4d4d4d" ] }, "c_toggle_group__button_ZIndex": { "name": "--pf-v6-c-toggle-group__button--ZIndex", "value": "100", "values": [ "--pf-v6-c-toggle-group__button--disabled--ZIndex", "--pf-t--global--z-index--xs", "--pf-t--global--z-index--100", "100" ] }, "c_toggle_group__button_before_BorderColor": { "name": "--pf-v6-c-toggle-group__button--before--BorderColor", "value": "#a3a3a3", "values": [ "--pf-v6-c-toggle-group__button--disabled--before--BorderColor", "--pf-t--global--border--color--disabled", "--pf-t--global--color--disabled--200", "--pf-t--color--gray--40", "#a3a3a3" ] } }, ".pf-v6-c-toggle-group__item:has(.pf-m-selected) + .pf-v6-c-toggle-group__item:has(.pf-m-selected)": { "c_toggle_group__button_before_BorderInlineStartColor": { "name": "--pf-v6-c-toggle-group__button--before--BorderInlineStartColor", "value": "#c7c7c7", "values": [ "--pf-v6-c-toggle-group__button--m-selected-selected--before--BorderInlineStartColor", "--pf-t--global--border--color--default", "--pf-t--global--border--color--100", "--pf-t--color--gray--30", "#c7c7c7" ] } }, ".pf-v6-c-toggle-group__item:has(:disabled, .pf-m-disabled) + .pf-v6-c-toggle-group__item:has(:disabled, .pf-m-disabled)": { "c_toggle_group__button_before_BorderInlineStartColor": { "name": "--pf-v6-c-toggle-group__button--before--BorderInlineStartColor", "value": "#c7c7c7", "values": [ "--pf-v6-c-toggle-group__button--disabled-disabled--before--BorderInlineStartColor", "--pf-t--global--border--color--default", "--pf-t--global--border--color--100", "--pf-t--color--gray--30", "#c7c7c7" ] } } }; export default c_toggle_group;