-
Notifications
You must be signed in to change notification settings - Fork 5
99 mweb component for single stats #200
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
Conversation
…nto 99-mweb-component-for-single-stats
titleIcon: { | ||
width: foundationToken.unit[20], | ||
height: foundationToken.unit[20], | ||
marginBottom: foundationToken.unit[16], |
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.
same as above
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.
@fractaljs Done
fontSize: foundationToken.font.size.body.md.fontSize, | ||
fontWeight: foundationToken.font.weight[500], | ||
helpIcon: { | ||
width: '16px', |
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.
Dont use hardcoded values, refer to FOUNDATION_TOKENS
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.
@fractaljs Done
marginLeft: foundationToken.unit[8], | ||
arrow: { | ||
width: '14px', | ||
height: '14px', |
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.
same as above
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.
Done
line: { | ||
strokeWidth: 2, | ||
activeDot: { | ||
radius: 4, |
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.
hardcoded values
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.
done
fontWeight: foundationToken.font.weight[500], | ||
color: foundationToken.colors.gray[400], | ||
bar: { | ||
radius: [2, 2, 0, 0], |
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.
hardcoded value use foundationToken
like
${foundationTokens.units[2]}px ${foundationTokens.units[2]}px 0 0
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.
done
arrow: { | ||
width: '14px', | ||
height: '14px', | ||
marginRight: foundationToken.unit[2], |
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.
hardcoded values
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.
done
}, | ||
bar: { | ||
radius: [2, 2, 0, 0], |
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.
same as above
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.
done
line: { | ||
strokeWidth: toPixels(foundationToken.unit[2]), | ||
activeDot: { | ||
radius: toPixels(foundationToken.unit[4]), |
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.
I am not sure if this is needed, type casting is enough here. If not we would have to use toPixels()
everywhere -- which clearly we are not doing.
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.
done
toPixels(foundationToken.unit[2]), | ||
toPixels(foundationToken.unit[0]), | ||
toPixels(foundationToken.unit[0]), | ||
], |
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.
Same
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.
done
Summary
Added mweb support for stat cards with responsive tokens
Affected Scope
@blend/*
)apps/docs
)Changes Made
Added mweb support for stat cards with responsive tokens
Added maxDropDown height for dropdown input
Added inline support for select and multiselect
How to Test
Screenshots (if applicable)
| Before | After |
|
Screen.Recording.2025-08-06.at.9.00.34.PM.mov
| ----- |
|
Screen.Recording.2025-08-07.at.3.27.03.PM.mov
|
Related Issues
Closes #99
#201
#202