Repository navigation
Conversation
Bump instructure-design-tokens to v2.2.0, which ships the ImageCard tokens. Co-Authored-By: Claude Sonnet 5.5 <noreply@anthropic.com>
|
Visual regression reportCypress suite: ✅ Passing Visual diff: ✅ No changes.
Accessibility (axe): ✅ No violations. 📊 View full report — click a screenshot's ⚠ badge to see each violation boxed on the image, with the offending element named and contrast failures shown as color swatches. Baselines come from the |
adamlobler
left a comment
adamlobler
left a comment
There was a problem hiding this comment.
Everything looks great! Just one minor thing: since this code is likely to be copied, I’d prefer to use the secondary text color for the card content texts in the examples.
| src={placeholderImage(250, 250)} | ||
| alt="A gray placeholder square" | ||
| > | ||
| <Text variant="content">Content goes here.</Text> |
There was a problem hiding this comment.
<Text color="secondary" variant="content">Content goes here.</Text>
| src={placeholderImage(600, 340)} | ||
| alt="A gray placeholder" | ||
| > | ||
| <Text variant="content">Narrower than the medium breakpoint.</Text> |
There was a problem hiding this comment.
<Text color="secondary" variant="content" >Narrower than the medium breakpoint.</Text>
| src={placeholderImage(600, 340)} | ||
| alt="A gray placeholder" | ||
| > | ||
| <Text variant="content">Between the two breakpoints.</Text> |
There was a problem hiding this comment.
<Text color="secondary" variant="content">Between the two breakpoints.</Text>
| src={placeholderImage(600, 340)} | ||
| alt="A gray placeholder" | ||
| > | ||
| <Text variant="content">Wider than the large breakpoint.</Text> |
There was a problem hiding this comment.
<Text color="secondary" variant="content">Wider than the large breakpoint.</Text>
| <div {...passthroughProps(rest)} css={styles?.card} ref={ref}> | ||
| <div css={styles?.container}> | ||
| <img src={src} alt={alt} css={styles?.img} /> | ||
| <Heading variant={headingVariantsBySize[size]}>{title}</Heading> |
There was a problem hiding this comment.
from out own recommendation:
"For legacy reasons, each variant has a default level set. This is not the recommended way and will be removed in a later major release. Please always specify the level!"
is this OK to always use there a h3? wont it mess up page layout? shouldnt this be a prop?
There was a problem hiding this comment.
Good idea. Added new prop
Co-Authored-By: Claude Sonnet 5.5 <noreply@anthropic.com>
Implements https://instructure.atlassian.net/browse/INSTUI-5220