[Enhancement]: Add support for specifying a custom class name on CardNode #1221
Labels
Projects
Comments
AlanGreene
added a commit
to AlanGreene/carbon-charts
that referenced
this issue
Nov 20, 2021
…outer node The CardNode component has a `color` prop which can be used to specify the colour of the border applied on the outer node. However, this requires the code to be aware of the active theme, handle dark mode, etc. to select an appropriate colour in some cases. For component libraries this can be problematic as now both the components and their consumers need to be aware of theme rather than relying on this being handled entirely in (S)CSS. Add support for applying a custom class to the CardNode component which will be applied to the outer node and can be used to apply styles to the card and its children, including specifying the border colour for the card. resolves carbon-design-system#1221
8 tasks
Sure! Feel free to make a PR 🙂 |
|
Thanks for the quick response. PR here #1222 There were a number of formatting changes in unrelated files (including changelogs for other packages) after running |
AlanGreene
added a commit
to AlanGreene/carbon-charts
that referenced
this issue
Nov 30, 2021
…outer node The CardNode component has a `color` prop which can be used to specify the colour of the border applied on the outer node. However, this requires the code to be aware of the active theme, handle dark mode, etc. to select an appropriate colour in some cases. For component libraries this can be problematic as now both the components and their consumers need to be aware of theme rather than relying on this being handled entirely in (S)CSS. Add support for applying a custom class to the CardNode component which will be applied to the outer node and can be used to apply styles to the card and its children, including specifying the border colour for the card. resolves carbon-design-system#1221 Add similar `className` prop to all diagram components for consistency.
AlanGreene
added a commit
to AlanGreene/carbon-charts
that referenced
this issue
Dec 1, 2021
…outer node The CardNode component has a `color` prop which can be used to specify the colour of the border applied on the outer node. However, this requires the code to be aware of the active theme, handle dark mode, etc. to select an appropriate colour in some cases. For component libraries this can be problematic as now both the components and their consumers need to be aware of theme rather than relying on this being handled entirely in (S)CSS. Add support for applying a custom class to the CardNode component which will be applied to the outer node and can be used to apply styles to the card and its children, including specifying the border colour for the card. resolves carbon-design-system#1221 Add similar `className` prop to all diagram components for consistency.
theiliad
pushed a commit
that referenced
this issue
Dec 1, 2021
…outer node (#1222) The CardNode component has a `color` prop which can be used to specify the colour of the border applied on the outer node. However, this requires the code to be aware of the active theme, handle dark mode, etc. to select an appropriate colour in some cases. For component libraries this can be problematic as now both the components and their consumers need to be aware of theme rather than relying on this being handled entirely in (S)CSS. Add support for applying a custom class to the CardNode component which will be applied to the outer node and can be used to apply styles to the card and its children, including specifying the border colour for the card. resolves #1221 Add similar `className` prop to all diagram components for consistency.
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Contact Details
No response
Summary
Add support for specifying a custom class name on the CardNode react component which can then be used to control the colour of the border or other styles as needed.
Justification
The CardNode react component has a
colorprop which can be used to specify the colour of the border applied on the outer node. However, this requires the consuming code to be aware of the active theme, handle dark mode, etc. to select an appropriate colour in some cases.For component libraries this can be problematic as now both the components and their consumers need to be aware of theme rather than relying on this being handled entirely in (S)CSS.
Desired UX and success metrics
Consumers of the CardNode component can add a custom class to the outer node and use this to style the card and its children.
"Must have" functionality
n/a
Specific timeline issues / requests
n/a
Available extra resources
I can implement this if it's an acceptable change.
The text was updated successfully, but these errors were encountered: