-
Notifications
You must be signed in to change notification settings - Fork 1.8k
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
feat(CodeSnippet): allow copy button to be optional #6505
feat(CodeSnippet): allow copy button to be optional #6505
Conversation
Deploy preview for carbon-elements ready! Built with commit 2d57752 |
Deploy preview for carbon-components-react ready! Built with commit 2d57752 https://deploy-preview-6505--carbon-components-react.netlify.app |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
bb079b3
to
4fbe6a2
Compare
1a57c6e
to
78b6fb5
Compare
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Inline code snippet
-The inline code snippet increases in height when the no copy button prop is turned on.
Single line code snippet
-The overflow text is getting a hard cutoff instead of having the gradient when you horizontal scroll.
the inline code snippet height change should be resolved now the gradient does not appear in Netlify because of CSS custom properties (related #4426) and this is not a regression in this PR. but I have implemented a workaround at the component level (#6410 for example) and I can resolve this issue for gradients in the other affected components in a separate PR |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
looks great! thank you 🙌🏻
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
LGTM 👍 ✅
43785f5
to
bb64fbf
Compare
@emyarod it looks like a |
cc @laurenmrice to double check the code snippet borders (single and multiline since it looks like they are the only variants that import border styles and then override them) |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
does it also not belong on the multiline snippet? if so we can change the default mixin styles since they're currently being overridden in both variants |
It doesn't need to be used for any of the code snippet types. @emyarod |
db325d0
to
2d57752
Compare
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
looks good! thank you 👍🏻
Closes #6499
This PR allows the copy button to be optionally hidden from single and multiline code snippet. For inline code snippets, a span will be rendered instead of a button
Testing / Reviewing
Confirm the code snippet variants without copy buttons appear correct