Skip to content
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.

Sign up for GitHub

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

Jump to bottom

fix(card): heading/copy spacing #11018

Merged
merged 8 commits into from
Oct 13, 2023
Merged

fix(card): heading/copy spacing #11018

merged 8 commits into from
Oct 13, 2023

Conversation

ariellalgilmore
Copy link
Member

@ariellalgilmore ariellalgilmore commented Oct 9, 2023 •
edited
Loading

Related Ticket(s)

#10047

Description

Card heading/copy spacing
Screenshot 2023-10-09 at 12 33 01 PM

before there was additional margin top spacing on the copy

Changelog

New

  • {{new thing}}

Changed

  • added a pictogram attribute to be added/removed if _hasPictogram, since pictogram-placement is always reflected and the pictogram card has different spacing for the heading/copy
  • updated color-scheme: inverse border
  • updated hovering to show on the image and video-poster

Removed

  • {{removed thing}}

@ariellalgilmore ariellalgilmore added package: web components Work necessary for the IBM.com Library web components package Needs design approval PRs on feature requests and new components have to get design approval before merge. v2 labels Oct 9, 2023
@ariellalgilmore ariellalgilmore requested a review from a team as a code owner October 9, 2023 19:37
@ibmdotcom-bot
Copy link
Contributor

ibmdotcom-bot commented Oct 9, 2023 •
edited
Loading

Deploy preview created for package Carbon Web Components:
https://carbon-web-components.s3.us-east.cloud-object-storage.appdomain.cloud/deploy-previews/11018/index.html

Built with commit: 65384a0a5ddd07406474493fa58b7f8223776aeb

@ibmdotcom-bot
Copy link
Contributor

ibmdotcom-bot commented Oct 9, 2023 •
edited
Loading

Deploy preview created for package Web Components:
https://ibmdotcom-webcomponents.s3.us-east.cloud-object-storage.appdomain.cloud/deploy-previews/11018/index.html

Built with commit: 65384a0a5ddd07406474493fa58b7f8223776aeb

@ibmdotcom-bot
Copy link
Contributor

ibmdotcom-bot commented Oct 9, 2023 •
edited
Loading

Deploy preview created for package Web Components (React wrapper):
https://ibmdotcom-web-components-react.s3-web.us-east.cloud-object-storage.appdomain.cloud/deploy-previews/11018/index.html

Built with commit: 65384a0a5ddd07406474493fa58b7f8223776aeb

@ariellalgilmore ariellalgilmore marked this pull request as draft October 9, 2023 20:21
RichKummer
RichKummer reviewed Oct 9, 2023
View reviewed changes
Copy link

@RichKummer RichKummer left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

@ariellalgilmore – the spacing seems resolved, but in @sm it looks like the bottom spacing is off as the screen size expands. The bottom spacing should be consistent at 16px – if the size changes, that bottom content should stay with the bottom until the spacing would be <64px from the headline.

Screenshot 2023-10-09 at 4 32 11 PM

@ariellalgilmore ariellalgilmore marked this pull request as ready for review October 10, 2023 16:05
@ariellalgilmore
Copy link
Member Author

@RichKummer ~ updated!

@RichKummer
Copy link

@ariellalgilmore seeing the fix for the footer which looks good. I'm not 100% if this is a storybook issue or not, but when I open card static in a new tab and set to @sm or @md, there seems to be extra spacing between the tags and the link (it should be 32px). The body copy never comes in either.

Weirdly, neither of these are an issue when viewing in the Storybook canvas. Can you double check that this is working fine?

In Storybook canvas:
Screenshot 2023-10-10 at 1 31 02 PM

In a new tab:
Screenshot 2023-10-10 at 1 29 09 PM

From the design specs:
Screenshot 2023-10-10 at 1 29 34 PM

@ariellalgilmore
Copy link
Member Author

@RichKummer should be fixed now! the copy thing is a weird storybook knob issue :(

RichKummer
RichKummer approved these changes Oct 12, 2023
View reviewed changes
Copy link

@RichKummer RichKummer left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

LGTM! Thanks @ariellalgilmore ✨

@ariellalgilmore ariellalgilmore removed the Needs design approval PRs on feature requests and new components have to get design approval before merge. label Oct 12, 2023
emyarod
emyarod approved these changes Oct 13, 2023
View reviewed changes
Copy link
Member

@emyarod emyarod left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

looks good to me!

@ariellalgilmore ariellalgilmore merged commit 97c1418 into carbon-design-system:feat/carbon-for-ibm-dotcom-v2 Oct 13, 2023
3 of 15 checks passed
@ariellalgilmore ariellalgilmore deleted the fix/card-spacing branch October 13, 2023 15:04
kennylam pushed a commit to kennylam/carbon-for-ibm-dotcom that referenced this pull request Oct 17, 2023
@ariellalgilmore @kennylam
fix(card): heading/copy spacing (carbon-design-system#11018)
221a2ad 
* fix(card): heading/copy spacing

* fix(card): format

* fix(card): cleanup styles

* fix(card): clean up inverse and static styles

* fix(card): format

* fix(card): align to bottom
@RichKummer RichKummer mentioned this pull request Oct 20, 2023
Closed
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Reviewers

@RichKummer RichKummer RichKummer approved these changes

@emyarod emyarod emyarod approved these changes

@annawen1 annawen1 Awaiting requested review from annawen1 annawen1 was automatically assigned from carbon-design-system/carbon-for-ibm-com-members

Assignees
No one assigned
Labels
package: web components Work necessary for the IBM.com Library web components package v2
Projects
None yet
Milestone
No milestone
Development

Successfully merging this pull request may close these issues.
4 participants
@ariellalgilmore @ibmdotcom-bot @RichKummer @emyarod