@patternfly/react-tokens
Version:
This library provides access to the design tokens of PatternFly 4 from JavaScript
593 lines • 20.6 kB
JavaScript
export const c_accordion = {
".pf-v6-c-accordion": {
"c_accordion_BackgroundColor": {
"name": "--pf-v6-c-accordion--BackgroundColor",
"value": "#ffffff",
"values": [
"--pf-t--global--background--color--primary--default",
"--pf-t--global--background--color--100",
"--pf-t--color--white",
"#ffffff"
]
},
"c_accordion_RowGap": {
"name": "--pf-v6-c-accordion--RowGap",
"value": "0.25rem",
"values": [
"--pf-t--global--spacer--xs",
"--pf-t--global--spacer--100",
"0.25rem"
]
},
"c_accordion__item_BorderRadius": {
"name": "--pf-v6-c-accordion__item--BorderRadius",
"value": "6px",
"values": [
"--pf-t--global--border--radius--200",
"6px"
]
},
"c_accordion__item_m_expanded_BackgroundColor": {
"name": "--pf-v6-c-accordion__item--m-expanded--BackgroundColor",
"value": "rgba(199, 199, 199, 0.2500)",
"values": [
"--pf-t--global--background--color--action--plain--clicked",
"--pf-t--global--background--color--600",
"rgba(199, 199, 199, 0.2500)"
]
},
"c_accordion__toggle_ColumnGap": {
"name": "--pf-v6-c-accordion__toggle--ColumnGap",
"value": "0.5rem",
"values": [
"--pf-t--global--spacer--gap--text-to-element--default",
"--pf-t--global--spacer--sm",
"--pf-t--global--spacer--200",
"0.5rem"
]
},
"c_accordion__toggle_PaddingBlockStart": {
"name": "--pf-v6-c-accordion__toggle--PaddingBlockStart",
"value": "0.5rem",
"values": [
"--pf-t--global--spacer--sm",
"--pf-t--global--spacer--200",
"0.5rem"
]
},
"c_accordion__toggle_PaddingInlineEnd": {
"name": "--pf-v6-c-accordion__toggle--PaddingInlineEnd",
"value": "1rem",
"values": [
"--pf-t--global--spacer--md",
"--pf-t--global--spacer--300",
"1rem"
]
},
"c_accordion__toggle_PaddingBlockEnd": {
"name": "--pf-v6-c-accordion__toggle--PaddingBlockEnd",
"value": "0.5rem",
"values": [
"--pf-t--global--spacer--sm",
"--pf-t--global--spacer--200",
"0.5rem"
]
},
"c_accordion__toggle_m_expanded_PaddingBlockEnd": {
"name": "--pf-v6-c-accordion__toggle--m-expanded--PaddingBlockEnd",
"value": "0.5rem",
"values": [
"--pf-t--global--spacer--sm",
"--pf-t--global--spacer--200",
"0.5rem"
]
},
"c_accordion__toggle_PaddingInlineStart": {
"name": "--pf-v6-c-accordion__toggle--PaddingInlineStart",
"value": "1rem",
"values": [
"--pf-t--global--spacer--md",
"--pf-t--global--spacer--300",
"1rem"
]
},
"c_accordion__toggle_BackgroundColor": {
"name": "--pf-v6-c-accordion__toggle--BackgroundColor",
"value": "rgba(255, 255, 255, 0.0000)",
"values": [
"--pf-t--global--background--color--action--plain--default",
"rgba(255, 255, 255, 0.0000)"
]
},
"c_accordion__toggle_hover_BackgroundColor": {
"name": "--pf-v6-c-accordion__toggle--hover--BackgroundColor",
"value": "rgba(199, 199, 199, 0.2500)",
"values": [
"--pf-t--global--background--color--action--plain--hover",
"--pf-t--global--background--color--600",
"rgba(199, 199, 199, 0.2500)"
]
},
"c_accordion__toggle_BorderRadius": {
"name": "--pf-v6-c-accordion__toggle--BorderRadius",
"value": "6px",
"values": [
"--pf-t--global--border--radius--small",
"--pf-t--global--border--radius--200",
"6px"
]
},
"c_accordion_m_toggle_start__toggle_ColumnGap": {
"name": "--pf-v6-c-accordion--m-toggle-start__toggle--ColumnGap",
"value": "0.5rem",
"values": [
"--pf-t--global--spacer--gap--text-to-element--default",
"--pf-t--global--spacer--sm",
"--pf-t--global--spacer--200",
"0.5rem"
]
},
"c_accordion__toggle_text_Color": {
"name": "--pf-v6-c-accordion__toggle-text--Color",
"value": "#151515",
"values": [
"--pf-t--global--text--color--regular",
"--pf-t--global--text--color--100",
"--pf-t--color--gray--95",
"#151515"
]
},
"c_accordion__toggle_text_FontWeight": {
"name": "--pf-v6-c-accordion__toggle-text--FontWeight",
"value": "400",
"values": [
"--pf-t--global--font--weight--body--default",
"--pf-t--global--font--weight--100",
"400"
]
},
"c_accordion__toggle_m_expanded__toggle_text_FontWeight": {
"name": "--pf-v6-c-accordion__toggle--m-expanded__toggle-text--FontWeight",
"value": "500",
"values": [
"--pf-t--global--font--weight--body--bold",
"--pf-t--global--font--weight--200",
"500"
]
},
"c_accordion_m_display_lg__toggle_m_expanded__toggle_text_FontWeight": {
"name": "--pf-v6-c-accordion--m-display-lg__toggle--m-expanded__toggle-text--FontWeight",
"value": "500",
"values": [
"--pf-t--global--font--weight--heading--default",
"--pf-t--global--font--weight--300",
"500"
]
},
"c_accordion__toggle_icon_Transition": {
"name": "--pf-v6-c-accordion__toggle-icon--Transition",
"value": ".2s ease-in 0s"
},
"c_accordion__toggle_m_expanded__toggle_icon_Rotate": {
"name": "--pf-v6-c-accordion__toggle--m-expanded__toggle-icon--Rotate",
"value": "90deg"
},
"c_accordion__expandable_content_MarginInlineEnd": {
"name": "--pf-v6-c-accordion__expandable-content--MarginInlineEnd",
"value": "1rem",
"values": [
"--pf-t--global--spacer--md",
"--pf-t--global--spacer--300",
"1rem"
]
},
"c_accordion__expandable_content_MarginBlockEnd": {
"name": "--pf-v6-c-accordion__expandable-content--MarginBlockEnd",
"value": "1rem",
"values": [
"--pf-t--global--spacer--md",
"--pf-t--global--spacer--300",
"1rem"
]
},
"c_accordion__expandable_content_MarginInlineStart": {
"name": "--pf-v6-c-accordion__expandable-content--MarginInlineStart",
"value": "1rem",
"values": [
"--pf-t--global--spacer--md",
"--pf-t--global--spacer--300",
"1rem"
]
},
"c_accordion__expandable_content_BackgroundColor": {
"name": "--pf-v6-c-accordion__expandable-content--BackgroundColor",
"value": "#ffffff",
"values": [
"--pf-t--global--background--color--primary--default",
"--pf-t--global--background--color--100",
"--pf-t--color--white",
"#ffffff"
]
},
"c_accordion__expandable_content_BorderRadius": {
"name": "--pf-v6-c-accordion__expandable-content--BorderRadius",
"value": "6px",
"values": [
"--pf-t--global--border--radius--small",
"--pf-t--global--border--radius--200",
"6px"
]
},
"c_accordion__expandable_content_Color": {
"name": "--pf-v6-c-accordion__expandable-content--Color",
"value": "#151515",
"values": [
"--pf-t--global--text--color--regular",
"--pf-t--global--text--color--100",
"--pf-t--color--gray--95",
"#151515"
]
},
"c_accordion__expandable_content_FontSize": {
"name": "--pf-v6-c-accordion__expandable-content--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_accordion__expandable_content_m_fixed_MaxHeight": {
"name": "--pf-v6-c-accordion__expandable-content--m-fixed--MaxHeight",
"value": "9.375rem"
},
"c_accordion__expandable_content_body_PaddingBlockStart": {
"name": "--pf-v6-c-accordion__expandable-content-body--PaddingBlockStart",
"value": "0.5rem",
"values": [
"--pf-t--global--spacer--sm",
"--pf-t--global--spacer--200",
"0.5rem"
]
},
"c_accordion__expandable_content_body_PaddingInlineEnd": {
"name": "--pf-v6-c-accordion__expandable-content-body--PaddingInlineEnd",
"value": "0.5rem",
"values": [
"--pf-t--global--spacer--sm",
"--pf-t--global--spacer--200",
"0.5rem"
]
},
"c_accordion__expandable_content_body_PaddingBlockEnd": {
"name": "--pf-v6-c-accordion__expandable-content-body--PaddingBlockEnd",
"value": "0.5rem",
"values": [
"--pf-t--global--spacer--sm",
"--pf-t--global--spacer--200",
"0.5rem"
]
},
"c_accordion__expandable_content_body_PaddingInlineStart": {
"name": "--pf-v6-c-accordion__expandable-content-body--PaddingInlineStart",
"value": "0.5rem",
"values": [
"--pf-t--global--spacer--sm",
"--pf-t--global--spacer--200",
"0.5rem"
]
},
"c_accordion__expandable_content_body_expandable_content_body_PaddingBlockStart": {
"name": "--pf-v6-c-accordion__expandable-content-body--expandable-content-body--PaddingBlockStart",
"value": "0"
},
"c_accordion_m_display_lg__toggle_PaddingBlockStart": {
"name": "--pf-v6-c-accordion--m-display-lg__toggle--PaddingBlockStart",
"value": "1rem",
"values": [
"--pf-t--global--spacer--md",
"--pf-t--global--spacer--300",
"1rem"
]
},
"c_accordion_m_display_lg__toggle_PaddingInlineEnd": {
"name": "--pf-v6-c-accordion--m-display-lg__toggle--PaddingInlineEnd",
"value": "1rem",
"values": [
"--pf-t--global--spacer--md",
"--pf-t--global--spacer--300",
"1rem"
]
},
"c_accordion_m_display_lg__toggle_PaddingBlockEnd": {
"name": "--pf-v6-c-accordion--m-display-lg__toggle--PaddingBlockEnd",
"value": "1rem",
"values": [
"--pf-t--global--spacer--md",
"--pf-t--global--spacer--300",
"1rem"
]
},
"c_accordion_m_display_lg__toggle_m_expanded_PaddingBlockEnd": {
"name": "--pf-v6-c-accordion--m-display-lg__toggle--m-expanded--PaddingBlockEnd",
"value": "0.5rem",
"values": [
"--pf-t--global--spacer--sm",
"--pf-t--global--spacer--200",
"0.5rem"
]
},
"c_accordion_m_display_lg__toggle_PaddingInlineStart": {
"name": "--pf-v6-c-accordion--m-display-lg__toggle--PaddingInlineStart",
"value": "1rem",
"values": [
"--pf-t--global--spacer--md",
"--pf-t--global--spacer--300",
"1rem"
]
},
"c_accordion_m_display_lg__toggle_FontFamily": {
"name": "--pf-v6-c-accordion--m-display-lg__toggle--FontFamily",
"value": "\"Red Hat Display\", \"RedHatDisplay\", \"Noto Sans Arabic\", \"Noto Sans Hebrew\", \"Noto Sans JP\", \"Noto Sans KR\", \"Noto Sans Malayalam\", \"Noto Sans SC\", \"Noto Sans TC\", \"Noto Sans Thai\", Helvetica, Arial, sans-serif",
"values": [
"--pf-t--global--font--family--heading",
"--pf-t--global--font--family--200",
"\"Red Hat Display\", \"RedHatDisplay\", \"Noto Sans Arabic\", \"Noto Sans Hebrew\", \"Noto Sans JP\", \"Noto Sans KR\", \"Noto Sans Malayalam\", \"Noto Sans SC\", \"Noto Sans TC\", \"Noto Sans Thai\", Helvetica, Arial, sans-serif"
]
},
"c_accordion_m_display_lg__toggle_FontSize": {
"name": "--pf-v6-c-accordion--m-display-lg__toggle--FontSize",
"value": "1.125rem",
"values": [
"--pf-t--global--font--size--heading--sm",
"--pf-t--global--font--size--lg",
"--pf-t--global--font--size--400",
"1.125rem"
]
},
"c_accordion_m_display_lg__toggle_text_FontWeight": {
"name": "--pf-v6-c-accordion--m-display-lg__toggle-text--FontWeight",
"value": "500",
"values": [
"--pf-t--global--font--weight--heading--default",
"--pf-t--global--font--weight--300",
"500"
]
},
"c_accordion_m_display_lg__expandable_content_FontSize": {
"name": "--pf-v6-c-accordion--m-display-lg__expandable-content--FontSize",
"value": "1rem",
"values": [
"--pf-t--global--font--size--body--lg",
"--pf-t--global--font--size--md",
"--pf-t--global--font--size--300",
"1rem"
]
},
"c_accordion_m_display_lg__expandable_content_Color": {
"name": "--pf-v6-c-accordion--m-display-lg__expandable-content--Color",
"value": "#151515",
"values": [
"--pf-t--global--text--color--regular",
"--pf-t--global--text--color--100",
"--pf-t--color--gray--95",
"#151515"
]
},
"c_accordion_m_bordered_RowGap": {
"name": "--pf-v6-c-accordion--m-bordered--RowGap",
"value": "0"
},
"c_accordion__item_m_bordered_BorderBlockEndWidth": {
"name": "--pf-v6-c-accordion__item--m-bordered--BorderBlockEndWidth",
"value": "1px",
"values": [
"--pf-t--global--border--width--divider--default",
"--pf-t--global--border--width--100",
"1px"
]
},
"c_accordion__item_m_bordered_BorderBlockEndColor": {
"name": "--pf-v6-c-accordion__item--m-bordered--BorderBlockEndColor",
"value": "#c7c7c7",
"values": [
"--pf-t--global--border--color--default",
"--pf-t--global--border--color--100",
"--pf-t--color--gray--30",
"#c7c7c7"
]
}
},
".pf-v6-c-accordion.pf-m-toggle-start": {
"c_accordion__toggle_ColumnGap": {
"name": "--pf-v6-c-accordion__toggle--ColumnGap",
"value": "0.5rem",
"values": [
"--pf-v6-c-accordion--m-toggle-start__toggle--ColumnGap",
"--pf-t--global--spacer--gap--text-to-element--default",
"--pf-t--global--spacer--sm",
"--pf-t--global--spacer--200",
"0.5rem"
]
}
},
".pf-v6-c-accordion.pf-m-display-lg": {
"c_accordion__toggle_PaddingBlockStart": {
"name": "--pf-v6-c-accordion__toggle--PaddingBlockStart",
"value": "1rem",
"values": [
"--pf-v6-c-accordion--m-display-lg__toggle--PaddingBlockStart",
"--pf-t--global--spacer--md",
"--pf-t--global--spacer--300",
"1rem"
]
},
"c_accordion__toggle_PaddingInlineEnd": {
"name": "--pf-v6-c-accordion__toggle--PaddingInlineEnd",
"value": "1rem",
"values": [
"--pf-v6-c-accordion--m-display-lg__toggle--PaddingInlineEnd",
"--pf-t--global--spacer--md",
"--pf-t--global--spacer--300",
"1rem"
]
},
"c_accordion__toggle_PaddingBlockEnd": {
"name": "--pf-v6-c-accordion__toggle--PaddingBlockEnd",
"value": "1rem",
"values": [
"--pf-v6-c-accordion--m-display-lg__toggle--PaddingBlockEnd",
"--pf-t--global--spacer--md",
"--pf-t--global--spacer--300",
"1rem"
]
},
"c_accordion__toggle_m_expanded_PaddingBlockEnd": {
"name": "--pf-v6-c-accordion__toggle--m-expanded--PaddingBlockEnd",
"value": "0.5rem",
"values": [
"--pf-v6-c-accordion--m-display-lg__toggle--m-expanded--PaddingBlockEnd",
"--pf-t--global--spacer--sm",
"--pf-t--global--spacer--200",
"0.5rem"
]
},
"c_accordion__toggle_PaddingInlineStart": {
"name": "--pf-v6-c-accordion__toggle--PaddingInlineStart",
"value": "1rem",
"values": [
"--pf-v6-c-accordion--m-display-lg__toggle--PaddingInlineStart",
"--pf-t--global--spacer--md",
"--pf-t--global--spacer--300",
"1rem"
]
},
"c_accordion__toggle_FontFamily": {
"name": "--pf-v6-c-accordion__toggle--FontFamily",
"value": "\"Red Hat Display\", \"RedHatDisplay\", \"Noto Sans Arabic\", \"Noto Sans Hebrew\", \"Noto Sans JP\", \"Noto Sans KR\", \"Noto Sans Malayalam\", \"Noto Sans SC\", \"Noto Sans TC\", \"Noto Sans Thai\", Helvetica, Arial, sans-serif",
"values": [
"--pf-v6-c-accordion--m-display-lg__toggle--FontFamily",
"--pf-t--global--font--family--heading",
"--pf-t--global--font--family--200",
"\"Red Hat Display\", \"RedHatDisplay\", \"Noto Sans Arabic\", \"Noto Sans Hebrew\", \"Noto Sans JP\", \"Noto Sans KR\", \"Noto Sans Malayalam\", \"Noto Sans SC\", \"Noto Sans TC\", \"Noto Sans Thai\", Helvetica, Arial, sans-serif"
]
},
"c_accordion__toggle_FontSize": {
"name": "--pf-v6-c-accordion__toggle--FontSize",
"value": "1.125rem",
"values": [
"--pf-v6-c-accordion--m-display-lg__toggle--FontSize",
"--pf-t--global--font--size--heading--sm",
"--pf-t--global--font--size--lg",
"--pf-t--global--font--size--400",
"1.125rem"
]
},
"c_accordion__toggle_text_FontWeight": {
"name": "--pf-v6-c-accordion__toggle-text--FontWeight",
"value": "500",
"values": [
"--pf-v6-c-accordion--m-display-lg__toggle-text--FontWeight",
"--pf-t--global--font--weight--heading--default",
"--pf-t--global--font--weight--300",
"500"
]
},
"c_accordion__toggle_m_expanded__toggle_text_FontWeight": {
"name": "--pf-v6-c-accordion__toggle--m-expanded__toggle-text--FontWeight",
"value": "500",
"values": [
"--pf-v6-c-accordion--m-display-lg__toggle--m-expanded__toggle-text--FontWeight",
"--pf-t--global--font--weight--heading--default",
"--pf-t--global--font--weight--300",
"500"
]
},
"c_accordion__expandable_content_FontSize": {
"name": "--pf-v6-c-accordion__expandable-content--FontSize",
"value": "1rem",
"values": [
"--pf-v6-c-accordion--m-display-lg__expandable-content--FontSize",
"--pf-t--global--font--size--body--lg",
"--pf-t--global--font--size--md",
"--pf-t--global--font--size--300",
"1rem"
]
},
"c_accordion__expandable_content_Color": {
"name": "--pf-v6-c-accordion__expandable-content--Color",
"value": "#151515",
"values": [
"--pf-v6-c-accordion--m-display-lg__expandable-content--Color",
"--pf-t--global--text--color--regular",
"--pf-t--global--text--color--100",
"--pf-t--color--gray--95",
"#151515"
]
}
},
".pf-v6-c-accordion.pf-m-bordered": {
"c_accordion_RowGap": {
"name": "--pf-v6-c-accordion--RowGap",
"value": "0",
"values": [
"--pf-v6-c-accordion--m-bordered--RowGap",
"0"
]
},
"c_accordion__item_BorderRadius": {
"name": "--pf-v6-c-accordion__item--BorderRadius",
"value": "0"
},
"c_accordion__toggle_BorderRadius": {
"name": "--pf-v6-c-accordion__toggle--BorderRadius",
"value": "0"
}
},
".pf-v6-c-accordion__item.pf-m-expanded": {
"c_accordion__toggle_PaddingBlockEnd": {
"name": "--pf-v6-c-accordion__toggle--PaddingBlockEnd",
"value": "0.5rem",
"values": [
"--pf-v6-c-accordion__toggle--m-expanded--PaddingBlockEnd",
"--pf-t--global--spacer--sm",
"--pf-t--global--spacer--200",
"0.5rem"
]
},
"c_accordion__toggle_text_FontWeight": {
"name": "--pf-v6-c-accordion__toggle-text--FontWeight",
"value": "500",
"values": [
"--pf-v6-c-accordion__toggle--m-expanded__toggle-text--FontWeight",
"--pf-t--global--font--weight--body--bold",
"--pf-t--global--font--weight--200",
"500"
]
}
},
".pf-v6-c-accordion__toggle:is(:hover, :focus)": {
"c_accordion__toggle_BackgroundColor": {
"name": "--pf-v6-c-accordion__toggle--BackgroundColor",
"value": "rgba(199, 199, 199, 0.2500)",
"values": [
"--pf-v6-c-accordion__toggle--hover--BackgroundColor",
"--pf-t--global--background--color--action--plain--hover",
"--pf-t--global--background--color--600",
"rgba(199, 199, 199, 0.2500)"
]
}
},
".pf-v6-c-accordion__expandable-content-body + .pf-v6-c-accordion__expandable-content-body": {
"c_accordion__expandable_content_body_PaddingBlockStart": {
"name": "--pf-v6-c-accordion__expandable-content-body--PaddingBlockStart",
"value": "0",
"values": [
"--pf-v6-c-accordion__expandable-content-body--expandable-content-body--PaddingBlockStart",
"0"
]
}
}
};
export default c_accordion;