Bug fixes and improvements for border-radius and build warnings#53
Bug fixes and improvements for border-radius and build warnings#53Thanhdan0811 wants to merge 29 commits into
Conversation
![gemini-code-assist[bot]](https://avatars.githubusercontent.com/in/956858?s=60&v=4){kind=small}
There was a problem hiding this comment.
Code Review
This pull request migrates the SCSS codebase to the Sass module system, replacing deprecated @import statements with @use and @forward and updating built-in functions to use namespaced modules like math, string, and map. It also refactors the border-radius utility to support responsive configurations similar to the spacing and font-size systems. Feedback indicates that the generated border-radius class names should have the "px" unit removed to maintain consistency with other utility patterns and that default configuration values should be avoided to minimize the CSS bundle size.
| @for $i from 1 through list.length($values) { | ||
| $value: list.nth($values, $i); | ||
| $postfix: helpers.get-previous-breakpoint-value($i, $value, $breakpoint, helpers.$border_radius); | ||
| .bar#{helpers.replace-prop($postfix)}px { |
There was a problem hiding this comment.
This pull request aims to make the border-radius configuration similar to vertical spacing. To be fully consistent, the generated class names should also follow the same pattern. Spacing classes are generated without units (e.g., .pt12), as are font-size classes (e.g., .fs13). The px unit should be removed from the class name here to align with that pattern, resulting in classes like .bar12. Additionally, ensure that these utility classes do not have default values in the configuration to keep the CSS bundle size minimal.
| .bar#{helpers.replace-prop($postfix)}px { | |
| .bar#{helpers.replace-prop($postfix)} { |
References
- To minimize CSS bundle size, configurable utility classes (e.g., for aspect-ratio, border-radius) should not have default values. Projects should explicitly define the values they require in the configuration.
There was a problem hiding this comment.
With border radius currently our project use pattern bar[value]px name for class. So we will keep px here.
|
Still see warning from terminal |
|
@tung13041996 I have fixed these warning. you can check again. |
…d-atomic-from-outer-project Support custom atomic.css builds from external projects via CLI
daomapsieucap
changed the title
|
This PR has been fixed in the PR: #55. So, I will close this PR |
3 participants
This PR fixes some issues in atomic and migrates the SCSS codebase to the modern Sass module system:
@importto@use/@forwardand namespaced modules (math,string,map), fixing the deprecation warnings when runningnpm run prod.border-radiusto support responsive breakpoint config like vertical spacing.border-radiusof the skeleton class overridingbar*classes likebar-circle.