@patternfly/react-tokens
Version:
This library provides access to the design tokens of PatternFly 4 from JavaScript
347 lines • 12.1 kB
TypeScript
export const c_panel: {
".pf-v6-c-panel": {
"c_panel_Width": {
"name": "--pf-v6-c-panel--Width",
"value": "auto"
},
"c_panel_MinWidth": {
"name": "--pf-v6-c-panel--MinWidth",
"value": "auto"
},
"c_panel_MaxWidth": {
"name": "--pf-v6-c-panel--MaxWidth",
"value": "none"
},
"c_panel_BackgroundColor": {
"name": "--pf-v6-c-panel--BackgroundColor",
"value": "#ffffff",
"values": [
"--pf-t--global--background--color--primary--default",
"--pf-t--global--background--color--100",
"--pf-t--color--white",
"#ffffff"
]
},
"c_panel_BoxShadow": {
"name": "--pf-v6-c-panel--BoxShadow",
"value": "none"
},
"c_panel_BorderRadius": {
"name": "--pf-v6-c-panel--BorderRadius",
"value": "6px",
"values": [
"--pf-t--global--border--radius--small",
"--pf-t--global--border--radius--200",
"6px"
]
},
"c_panel_before_BorderWidth": {
"name": "--pf-v6-c-panel--before--BorderWidth",
"value": "0"
},
"c_panel_before_BorderColor": {
"name": "--pf-v6-c-panel--before--BorderColor",
"value": "#c7c7c7",
"values": [
"--pf-t--global--border--color--default",
"--pf-t--global--border--color--100",
"--pf-t--color--gray--30",
"#c7c7c7"
]
},
"c_panel_m_secondary_BackgroundColor": {
"name": "--pf-v6-c-panel--m-secondary--BackgroundColor",
"value": "#f2f2f2",
"values": [
"--pf-t--global--background--color--secondary--default",
"--pf-t--global--background--color--200",
"--pf-t--color--gray--10",
"#f2f2f2"
]
},
"c_panel_m_bordered_before_BorderWidth": {
"name": "--pf-v6-c-panel--m-bordered--before--BorderWidth",
"value": "1px",
"values": [
"--pf-t--global--border--width--box--default",
"--pf-t--global--border--width--100",
"1px"
]
},
"c_panel_m_raised_BoxShadow": {
"name": "--pf-v6-c-panel--m-raised--BoxShadow",
"value": "0px\n 4px\n 9px\n 0px\n rgba(41, 41, 41, 0.1500)",
"values": [
"--pf-t--global--box-shadow--md",
"--pf-t--global--box-shadow--X--md--default\n --pf-t--global--box-shadow--Y--md--default\n --pf-t--global--box-shadow--blur--md\n --pf-t--global--box-shadow--spread--md--default\n --pf-t--global--box-shadow--color--md--default",
"--pf-t--global--box-shadow--X--400\n --pf-t--global--box-shadow--Y--600\n --pf-t--global--box-shadow--blur--200\n --pf-t--global--box-shadow--spread--100\n --pf-t--global--box-shadow--color--100",
"0px\n 4px\n 9px\n 0px\n rgba(41, 41, 41, 0.1500)"
]
},
"c_panel_m_raised_BackgroundColor": {
"name": "--pf-v6-c-panel--m-raised--BackgroundColor",
"value": "#ffffff",
"values": [
"--pf-t--global--background--color--floating--default",
"--pf-t--global--background--color--100",
"--pf-t--color--white",
"#ffffff"
]
},
"c_panel__header_PaddingBlockStart": {
"name": "--pf-v6-c-panel__header--PaddingBlockStart",
"value": "1rem",
"values": [
"--pf-t--global--spacer--md",
"--pf-t--global--spacer--300",
"1rem"
]
},
"c_panel__header_PaddingInlineEnd": {
"name": "--pf-v6-c-panel__header--PaddingInlineEnd",
"value": "1.5rem",
"values": [
"--pf-t--global--spacer--lg",
"--pf-t--global--spacer--400",
"1.5rem"
]
},
"c_panel__header_PaddingBlockEnd": {
"name": "--pf-v6-c-panel__header--PaddingBlockEnd",
"value": "1rem",
"values": [
"--pf-t--global--spacer--md",
"--pf-t--global--spacer--300",
"1rem"
]
},
"c_panel__header_PaddingInlineStart": {
"name": "--pf-v6-c-panel__header--PaddingInlineStart",
"value": "1.5rem",
"values": [
"--pf-t--global--spacer--lg",
"--pf-t--global--spacer--400",
"1.5rem"
]
},
"c_panel__main_MaxHeight": {
"name": "--pf-v6-c-panel__main--MaxHeight",
"value": "none"
},
"c_panel__main_Overflow": {
"name": "--pf-v6-c-panel__main--Overflow",
"value": "visible"
},
"c_panel__main_body_PaddingBlockStart": {
"name": "--pf-v6-c-panel__main-body--PaddingBlockStart",
"value": "1rem",
"values": [
"--pf-t--global--spacer--md",
"--pf-t--global--spacer--300",
"1rem"
]
},
"c_panel__main_body_PaddingInlineEnd": {
"name": "--pf-v6-c-panel__main-body--PaddingInlineEnd",
"value": "1.5rem",
"values": [
"--pf-t--global--spacer--lg",
"--pf-t--global--spacer--400",
"1.5rem"
]
},
"c_panel__main_body_PaddingBlockEnd": {
"name": "--pf-v6-c-panel__main-body--PaddingBlockEnd",
"value": "1rem",
"values": [
"--pf-t--global--spacer--md",
"--pf-t--global--spacer--300",
"1rem"
]
},
"c_panel__main_body_PaddingInlineStart": {
"name": "--pf-v6-c-panel__main-body--PaddingInlineStart",
"value": "1.5rem",
"values": [
"--pf-t--global--spacer--lg",
"--pf-t--global--spacer--400",
"1.5rem"
]
},
"c_panel__footer_PaddingBlockStart": {
"name": "--pf-v6-c-panel__footer--PaddingBlockStart",
"value": "0.5rem",
"values": [
"--pf-t--global--spacer--sm",
"--pf-t--global--spacer--200",
"0.5rem"
]
},
"c_panel__footer_PaddingInlineEnd": {
"name": "--pf-v6-c-panel__footer--PaddingInlineEnd",
"value": "1.5rem",
"values": [
"--pf-t--global--spacer--lg",
"--pf-t--global--spacer--400",
"1.5rem"
]
},
"c_panel__footer_PaddingBlockEnd": {
"name": "--pf-v6-c-panel__footer--PaddingBlockEnd",
"value": "0.5rem",
"values": [
"--pf-t--global--spacer--sm",
"--pf-t--global--spacer--200",
"0.5rem"
]
},
"c_panel__footer_PaddingInlineStart": {
"name": "--pf-v6-c-panel__footer--PaddingInlineStart",
"value": "1.5rem",
"values": [
"--pf-t--global--spacer--lg",
"--pf-t--global--spacer--400",
"1.5rem"
]
},
"c_panel__footer_BoxShadow": {
"name": "--pf-v6-c-panel__footer--BoxShadow",
"value": "none"
},
"c_panel_m_scrollable__main_MaxHeight": {
"name": "--pf-v6-c-panel--m-scrollable__main--MaxHeight",
"value": "18.75rem"
},
"c_panel_m_scrollable__main_Overflow": {
"name": "--pf-v6-c-panel--m-scrollable__main--Overflow",
"value": "auto"
},
"c_panel_m_scrollable__footer_BoxShadow": {
"name": "--pf-v6-c-panel--m-scrollable__footer--BoxShadow",
"value": "0px\n -10px\n 9px\n -8px\n rgba(41, 41, 41, 0.1500)",
"values": [
"--pf-t--global--box-shadow--md--top",
"--pf-t--global--box-shadow--X--md--top\n --pf-t--global--box-shadow--Y--md--top\n --pf-t--global--box-shadow--blur--md\n --pf-t--global--box-shadow--spread--md--directional\n --pf-t--global--box-shadow--color--md--directional",
"--pf-t--global--box-shadow--X--400\n --pf-t--global--box-shadow--Y--100\n --pf-t--global--box-shadow--blur--200\n --pf-t--global--box-shadow--spread--300\n --pf-t--global--box-shadow--color--100",
"0px\n -10px\n 9px\n -8px\n rgba(41, 41, 41, 0.1500)"
]
},
"c_panel_m_scrollable__footer_PaddingBlockStart": {
"name": "--pf-v6-c-panel--m-scrollable__footer--PaddingBlockStart",
"value": "1rem",
"values": [
"--pf-t--global--spacer--md",
"--pf-t--global--spacer--300",
"1rem"
]
},
"c_panel_m_scrollable__footer_PaddingBlockEnd": {
"name": "--pf-v6-c-panel--m-scrollable__footer--PaddingBlockEnd",
"value": "1rem",
"values": [
"--pf-t--global--spacer--md",
"--pf-t--global--spacer--300",
"1rem"
]
}
},
".pf-v6-c-panel.pf-m-bordered": {
"c_panel_before_BorderWidth": {
"name": "--pf-v6-c-panel--before--BorderWidth",
"value": "1px",
"values": [
"--pf-v6-c-panel--m-bordered--before--BorderWidth",
"--pf-t--global--border--width--box--default",
"--pf-t--global--border--width--100",
"1px"
]
}
},
".pf-v6-c-panel.pf-m-secondary": {
"c_panel_BackgroundColor": {
"name": "--pf-v6-c-panel--BackgroundColor",
"value": "#f2f2f2",
"values": [
"--pf-v6-c-panel--m-secondary--BackgroundColor",
"--pf-t--global--background--color--secondary--default",
"--pf-t--global--background--color--200",
"--pf-t--color--gray--10",
"#f2f2f2"
]
}
},
".pf-v6-c-panel.pf-m-raised": {
"c_panel_BackgroundColor": {
"name": "--pf-v6-c-panel--BackgroundColor",
"value": "#ffffff",
"values": [
"--pf-v6-c-panel--m-raised--BackgroundColor",
"--pf-t--global--background--color--floating--default",
"--pf-t--global--background--color--100",
"--pf-t--color--white",
"#ffffff"
]
},
"c_panel_BoxShadow": {
"name": "--pf-v6-c-panel--BoxShadow",
"value": "0px\n 4px\n 9px\n 0px\n rgba(41, 41, 41, 0.1500)",
"values": [
"--pf-v6-c-panel--m-raised--BoxShadow",
"--pf-t--global--box-shadow--md",
"--pf-t--global--box-shadow--X--md--default\n --pf-t--global--box-shadow--Y--md--default\n --pf-t--global--box-shadow--blur--md\n --pf-t--global--box-shadow--spread--md--default\n --pf-t--global--box-shadow--color--md--default",
"--pf-t--global--box-shadow--X--400\n --pf-t--global--box-shadow--Y--600\n --pf-t--global--box-shadow--blur--200\n --pf-t--global--box-shadow--spread--100\n --pf-t--global--box-shadow--color--100",
"0px\n 4px\n 9px\n 0px\n rgba(41, 41, 41, 0.1500)"
]
}
},
".pf-v6-c-panel.pf-m-scrollable": {
"c_panel__main_MaxHeight": {
"name": "--pf-v6-c-panel__main--MaxHeight",
"value": "18.75rem",
"values": [
"--pf-v6-c-panel--m-scrollable__main--MaxHeight",
"18.75rem"
]
},
"c_panel__main_Overflow": {
"name": "--pf-v6-c-panel__main--Overflow",
"value": "auto",
"values": [
"--pf-v6-c-panel--m-scrollable__main--Overflow",
"auto"
]
},
"c_panel__footer_BoxShadow": {
"name": "--pf-v6-c-panel__footer--BoxShadow",
"value": "0px\n -10px\n 9px\n -8px\n rgba(41, 41, 41, 0.1500)",
"values": [
"--pf-v6-c-panel--m-scrollable__footer--BoxShadow",
"--pf-t--global--box-shadow--md--top",
"--pf-t--global--box-shadow--X--md--top\n --pf-t--global--box-shadow--Y--md--top\n --pf-t--global--box-shadow--blur--md\n --pf-t--global--box-shadow--spread--md--directional\n --pf-t--global--box-shadow--color--md--directional",
"--pf-t--global--box-shadow--X--400\n --pf-t--global--box-shadow--Y--100\n --pf-t--global--box-shadow--blur--200\n --pf-t--global--box-shadow--spread--300\n --pf-t--global--box-shadow--color--100",
"0px\n -10px\n 9px\n -8px\n rgba(41, 41, 41, 0.1500)"
]
},
"c_panel__footer_PaddingBlockStart": {
"name": "--pf-v6-c-panel__footer--PaddingBlockStart",
"value": "1rem",
"values": [
"--pf-v6-c-panel--m-scrollable__footer--PaddingBlockStart",
"--pf-t--global--spacer--md",
"--pf-t--global--spacer--300",
"1rem"
]
},
"c_panel__footer_PaddingBlockEnd": {
"name": "--pf-v6-c-panel__footer--PaddingBlockEnd",
"value": "1rem",
"values": [
"--pf-v6-c-panel--m-scrollable__footer--PaddingBlockEnd",
"--pf-t--global--spacer--md",
"--pf-t--global--spacer--300",
"1rem"
]
}
}
};
export default c_panel;