-
Notifications
You must be signed in to change notification settings - Fork 29
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
Rework trail text visibility logic & show on all breakpoints in flexible/general #12584
Conversation
Size Change: -56 B (-0.01%) Total Size: 901 kB
ℹ️ View Unchanged
|
cca4459
to
c570f18
Compare
c570f18
to
e74cc06
Compare
Hello 👋! When you're ready to run Chromatic, please apply the You will need to reapply the label each time you want to run Chromatic. |
const hideTrailTextUntil = () => { | ||
if (isFlexibleContainer) { | ||
return undefined; | ||
} else if ( | ||
imageSize === 'large' && | ||
imagePositionOnDesktop === 'right' && | ||
media?.type !== 'avatar' | ||
) { | ||
return 'desktop'; | ||
} else { | ||
return 'tablet'; | ||
} | ||
}; | ||
|
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.
😚 👌
e74cc06
to
dfd9a3b
Compare
Seen on PROD (created by @cemms1 and merged by @abeddow91 10 minutes and 56 seconds ago) Please check your changes! |
What does this change?
Refactors the trail text component so that:
div
rather than nesting adiv
within adiv
Hide
component to control visibility rather than applying css directly"hideUntil"
to describe when the trail text should be hiddenhideTrailTextUntil
helper function to store this logicisFlexibleContainer
to the logic as we want trail text to show on all breakpoints in flexible containers IF the image has been removed (in which casetrailText
is not provided as a prop toFrontCard
at all, see Show trail text on standard cards inflexible/general
containers if the image has been removed #12570)Why?
Improving the component for easier use and better understanding
Addresses issue of trail text not appearing on mobile screen sizes on standard cards in flexible general containers
Part of this Trello ticket
Screenshots