fix: Color Mode BoxShadow for cards #2849
Conversation
j10sanders
changed the title
|
@dreamwasp I haven't done extensive QA but it does fix the homepage issue Screen.Recording.2024-03-18.at.7.16.52.PM.mov |
|
@dreamwasp I added preview envs to the description |
packages/gamut/src/Card/index.tsx
Outdated
| outline?: boolean; | ||
| mode: ColorModes; |
There was a problem hiding this comment.
seeing test failures in the monorepo here related to this line -maybe happening on initial load before useColorModes has a chance to return the mode? two solutions i can think of are 1. making light the default mode before if mode doesn't exist yet or 2. making mode not required here (tho having a default fallback might be safer)
should be fixed now! Happy to pair on QA as well |
|
🚀 Styleguide deploy preview ready! |
📬Published Alpha Packages:@codecademy/[email protected] |
| boxShadow: `-8px 8px 0 currentColor`, | ||
| }, | ||
| }, | ||
| outline: outlineStyles(mode), |
There was a problem hiding this comment.
this DynamicCardWrapper variant appears to be broken in dark mode:
jon.mov
i think we only need to theme-sensitive outlineStyles in the variant(s) / CardWrapper components.
when i apply a variant they work more the way I'd expect them to (and the white variant is perfect). tested locally with the hyper variant:
jon2.mov
|
Great catch. I believe it is all fixed here. Video of the new functionality With variant=hyper (to be sure it doesn't break variant): |
Overview
Redoing #2846
Previews:
Monolith: https://pr-37365-monolith.dev-eks.codecademy.com/
Not sure we use cards on LE: https://tayra.codecademy.com/workspaces/new?PR_ENV=le-pr-5481
Portal: https://tengu.codecademy.com/catalog?PR_ENV=portal-app-pr-5481